Select Page
WIN Atlas Icons


Remember being a teenager? Peer pressure from everyone around you. Dealing with homework, friend's needs, and always that drive to be cool no matter the situation. On top of it all, adulthood loomed right around the corner waiting for you.

To figure out your future, all you had at your disposal were pages of endless surveys or brief meetings with a guidance counselor who had to divide their time up between hundreds of other needy students.

WIN Learning came to Rocksauce Studios to help fix all of that.
We helped them create WIN Atlas.


We were all teenagers once, too. Every generation from this point forward will live & breathe mobile. Want them to use a tool? You've gotta' make it engaging, simple and enjoyable.

But how do you accomplish that when some teens are planners, who have worked hard & planned through school but may not know what the next step is, while also accounting for others who have never thought past their high school graduation day?

For those that knew what they wanted, we let them choose their paths. Others, who were clueless on their future, were offered quick ways to get the information they were craving. We created User Personas for each teen type, so we could better pinpoint how best to communicate with them.

Research verified our expectations - teens wanted information quickly and to get something useful as soon as possible. Based on their User Persona, we helped each get arrive there in a way that was customized for them.

Our goal was to give students numerous paths to discovery, so they were able to choose a method which worked for them, no matter their future career.

WIN Atlas UX Examples


Our client, WIN Learning, knew that for a teen facing their future, the idea of what comes next was the biggest decision they could make. Literally, these teens have the weight of the world on their shoulders. They also needed a "guide" to help them arrive at their eventual career destination. When it came time for naming, WIN Atlas was the perfect name.

Here we played with the simple concept of a compass, but used the type from a geometry class - playing both on the educational aspect and the navigational angle.

A globe symbolized all three of the primary meanings for Atlas - navigational tool, educational assistant, and of course, the world itself.

For these versions, our team wanted to showcase the concept of Atlas holding up the world. Around the planet, we incorporated paths of an atom, bringing in the concept of future thinking.

In the chosen logo, we tied the type treatment & the concept of Atlas together, creating one powerful, distinctive mark.


With the UX planned and our branding defined, we next had to figure out a strong visual identity. Aside from color palette, which you can see throughout this case study, landing on a specific style for the iconography was vital. Driving users to tap, explore, and discover a new career path was our primary goal.

WIN Atlas Icons

After trying out a few different styles, we settled on a simple, outlined icon with an offset "print" design that was fun, distinctive, and would be familiar to the user. From the navigational icons on each page to the defining elements for specific careers, we wanted to make sure students had something easy to remember as they moved through the tool.

WIN Atlas User Interface Elements

We loved the iconography so much, we thought, "Heck, let's apply this style to the rest of the application, too!" So that's what we did. From the various different form fields that users interact with, to the buttons, progress bars and major actions, this style added a sense of fun everywhere.

"We're coming back to Rocksauce (for our website) because your design is stunning and beautiful."

Suzanne Bazarian, WIN Learning