Careers at The Atlantic

A mockup of a tablet and mobile phone showing different sections of the redesigned careers page.

The brief

Challenge

Bring The Atlantic’s career site in line with their newly refreshed brand in order to attract the best talent and showcase their values.

Insight

Use the careers page as more than just a place to show open positions, use it to communicate your values and highlight key work.

Solution

A fully responsive careers landing page, in line with The Atlantic’s brand. The simple but effective page efficiently uses real estate to showcase who the Atlantic is and what it’s like to work there. Visit the site here.

role
CLIENT

Lead UI Designer

The Atlantic

Introduction

The force of ideas

The Atlantic is a powerhouse of an institution and a household name. In their words, “The Atlantic is dedicated to bringing clarity and original thinking to the most important issues of our time. We aim to help our readers better understand the world and its possibilities as they navigate the complexities of daily life.” Although The Atlantic itself is meticulously designed and has a whole in-house team, in order to attract new talent, the careers site desperately needed a refresh. 

Long Dash editorial and strategy staff, with long standing relationships with the Atlantic, were in charge of doing landscape analysis and crystalizing the voice and tone for the site. They wrote the copy and sketched out the main sections of the page. I was brought on to bring the site to life in the new Atlantic brand and ensure all the content was designed and structured beautifully.

An image showing the homepage of the Atlantic Careers site before I redesigned it and after. Before, the page is cramped, with a lot of different colors and no organization of content. After, the page has a cohesive design, breathing room and relevant content.

Architecture and Wireframes

Getting it all down on paper

This project had a tight timeline so we settled on a single landing page with anchor link navigation to communicate quickly and easily what the site wanted to convey.

I sketched out a wireframe and made sure all the pieces were on the page before getting approval from the client. While the page was lean, we still wanted to tell a story about who the Atlantic is and what it would be like to work there.

An image showing a gray and white wireframe for the careers site with some annotations.

Design: Look and feel

Leaning on brand values to guide visual design

I created two distinct design directions for this site based on two of the Atlantic’s values.

The first one is based on the “Force of Ideas”. Part of The Atlantic's explanation of this value reads, “We endeavor to cultivate new ideas, challenge existing ones, and seek out those that otherwise might go unheard. We do this because ideas have consequences—the power to shape our lives, our work, and the world around us.” I used this as inspiration for choosing a powerful typographic element and pared down colors that would let the ideas speak for themselves.

An artboard showing a proposed visual design direction for the Atlantic Careers site. this one is based off "Force of Ideas". It is uses a bold, typographic style and let's ideas speak for themselves.

The second visual direction was based on the “Sense of Belonging”. Part of The Atlantic's explanation of this value reads, “Our culture reflects this calling. It is characterized by goodwill and a deep sense of mutual concern. Our goal is not consensus—on the contrary, our best work may be born of spirited exchange and a diversity of views.” I wanted this visual direction to feel bright and engaging and evoke a sense of team, using the bold illustrative style of the main site.

An artboard showing a proposed visual design direction for the Atlantic Careers site. this one is based off "Sense of Belonging". It is friendly, bright and uses illustration to evoke a sense of team.

The client liked both but decided to go with the second option. However, as is the case with many client projects, they liked pieces of both and the illustration style they ended up going with was much more similar to the first direction. They used one of their internal illustrators to create the art for the site but I was responsible for the rest of the design. 

Conclusion

Making use of the time we had

This project had an extremely tight timeline and I was dropped in at an extremely busy time when I was lead designer on another project (and right when most of those designs were due!) so I didn’t get to put as much time into these designs as I would have liked. Such is agency life!

  • I didn’t have time to mock up mobile designs for this project. The dev team did a great job of ensuring everything was responsive, but I would have liked to be more intentional for some of the mobile designs. The page feels quite long, so I would have used some horizontal scrolls options to showcase content, as well as adjusting some of the font sizes. 
  • I was the only designer working on this project, with no oversight or senior designer. I would have liked to bounce some ideas off of someone else or have the chance to talk through some decisions in order to iterate more and come up with a more polished design. 
  • There was an opportunity to create some more motion down the page and incorporate the illustration style in smaller ways across the page. I ran out of time for this and didn’t get to see the illustrations until the page was complete so there wasn’t an opportunity for collaboration here. It would have been a fun addition if it were possible!

All in all, I’m really happy with how the site came out in the short amount of time we had to produce it. It looks and feels like the Atlantic and expresses their brand both visually and in the voice and content of the page. 

Visit the site here.

A GIF of the homepage of the Atlantic Careers site. You see the top of the page, it scrolls down, and then hovers over three cards, which flip over to reveal text.