CHALLENGE

This redesign was prompted by a complex Drupal upgrade that involved a redesign, Constituent Relationship Management (CRM) integration and migration, and a complete overhaul of the subscription management and membership program. That said, we quickly decided that the site designed in 2007 needed fresh visuals and a responsive design to propel us into our 20th year. 

Bitch is in the process of expanding their advocacy work, and the site overhaul was needed to propel the organization forward and showcase existing great content.

Although Bitch often presents complex takes on tough issues, we focus on pop culture because we love it. We wanted to make it simple and FUN to look around the site.

Our budget necessitated doing the user experience and front-end design in house, which ended up making the final site more usable for our staff and more integrated with the rest of our identity. I consulted with several outside design colleagues on the visual system and UX, worked with our editors, staff and board to create user stories, and ultimately created the design to feel like a vibrant magazine with a nod to the "pop" in pop culture.

SOLUTION

Reader experience is improved. Through color, typeface, size, and white space, we’ve made it more readable on screen, and with responsive design. We removed unused features and menu options to better highlight our contributors and offerings like the Podcasts and Bitch on Campus program. We adjusted spacing at every size, made bigger type and bigger images—and streamlined again.

Content is organized, contextualized, and styled for exploration. The home page is designed to give you many ways to dig in, starting with a menu organized by clearly-titled subject. A secondary menu of “hot topics” below the main menu (on larger screens) showcases articles that editors want to highlight at any moment. Short article teasers, bite-sized images, and quotes are mixed to make content "snacky". Latest posts are further down the page.

Within each article, readers can click through to recommended reads, related topics, or articles by the same author. Magazine articles, original online content, and audio (like mixtapes and podcasts) are mixed, organized by interest instead of medium or format.

It looks and feels like Bitch. Typefaces were chosen to match what we use in the print magazine, with a little twist to be more readable on screen instead of paper. Content is splashier, with bigger images, infographics, and comics. The work of our writers and visual contributors is featured more prominently, which is an integral part of our mission and values.

Programming by Congruity Works, design and UX assistance from Laura Jones Martinez, and many significant contributions from the team at Bitch Media.