Loading ...

Responses by Firebelly

Background: A new national campaign by Planned Parenthood, Unstoppable is designed to activate new allies in the movement to protect and expand reproductive rights, while raising awareness around intersecting issues such as systemic racism, income inequality, sexual assault and harassment. As campaign headquarters, UnstoppableNow.org prepares users to take the leap from outrage to action by building knowledge, agency and solidarity.

Highlights: We wanted to create a sense of discovery, momentum and action—the UNSTOPPABLE logotype behaves as both a lead message and a frame for the campaign’s key issues. Set in italics and staggered rhythm, it represents the voices of many coming together in collective purpose. Hover states provide users with a glimpse into the issues, and clicking in reveals and expands more detail. The layout allows each issue to come into focus without diminishing the others.

Challenges: Rationalizing the layout and structure of the homepage. We labored over how the layout would respond to both hover and opened states of each individual issue—image cropping and placements were tailored specifically to ensure that images and type worked harmoniously together in any state. We also had to make sure all the content is as readable as possible on any screen size within these skewed containers.

Favorite details: The homepage design and interactions reframe the conversation from individual battles to the larger war on women—it models intersectionality for an audience that may not yet be familiar with the concept, and helps users connect the dots between issues. There’s also something about how the duotone video loops underneath the knockout text, intertwining a strong statement with powerful footage, especially with the “Together, We Are Unstoppable” title on the Art page.

Technical features: The slanted layouts. The technique to achieve the slants was not groundbreaking by any means, but working with scrollable content created a new challenge. We created early prototypes as sketches in CodePen to figure out what was even possible. Together, our developer and designer played around with a few different ways for the content to scroll, or bleed, to make a cohesive, engaging and beautiful user experience.

unstoppablenow.org

Browse Projects

Click on an image to view more from each project
X

With a free Commarts account, you can enjoy 50% more free content
Create an Account
Get a subscription and have unlimited access
Subscribe
Already a subscriber or have a Commarts account?
Sign In
X

Get a subscription and have unlimited access
Subscribe
Already a subscriber?
Sign In