Seattle Weekly

A concept project, this responsive redesign of the Seattle Weekly website includes a simplified navigation and streamlined site architecture, providing a more practical and pleasant reader experience. The redesign also includes a brand refresh, which strengthens the brand overall, resulting in a reader experience that is cohesive and memorable across all brand expressions in web and print.

my role — UX/UI, User Testing, Front-End Dev, Content Strategy, Branding
my tools — Wordpress, html, CSS, Photoshop
the team — Hannah Mintek

Seattle Weekly redesign website mocked up on three tablet devices

highlights of the redesign

Users: Our goal was not to redefine who the SW readers are or should be, but to better serve their existing readers.

Task: We identified a common task that many different users would find useful.

Search: Early research indicated that many users prefer to access SW's online content via organic search. This informed the nav and page design.

Navigation: We reconceptualized how content was organized and delivered on the site, by simplifying and dividing into two main categories; Stories and Events.

Visual Design: We took inspiration from the print edition, which strengthened the overall brand identity.

Business: We improved existing ad placement and developed new online business strategies such as sponsored articles, (contextually relevant) native ads, social media sharing, and giveaways.

reader research

Early research indicated that the majority of SW readers include residents of Seattle metro and eastside suburbs and potential visitors to the city. The readership skews male (1.44:1), single (1.41:1), and approximately 85% of the readers have at least one college degree and 90% of them make more than 50k annually. Of the 1,704,016 monthly website views, Seattle Weekly reaches 633,146 unique visitors, with an average viewing rate of 2.59 pages per visit. Their principal competitor is The Stranger (more on them later).

website audit

In the initial website audit we discovered many potential challenges for SW readers. Overall, the page hierarchy was not clearly defined, the site navigation was inconsistent, the content listing was very lengthy, and the style choices were inconsistent with their print edition.

Seattle Weekly website audit markup

user personas

When answering the question of who we were designing for, we looked to define two potential users that share a common task — to search for and find an activity to do in Fremont on a Thursday night.

portrait of Seattle Weekly user Chris

Chris

Basics: Lives in Bellevue / Single / Male / Age 34

Occupation: Software Engineer / $105,000

Activities: Plays on an adult men’s soccer league / Regularly attends weekly Pub Quiz at Rock Bottom Brewery

SW Objective: Chris recently started online dating. He has a date scheduled for next Thursday night and wants to make a good impression. He is checking SW online to find an event they could attend in Fremont, near where he’s taking his date for dinner.

portrait of Seattle Weekly user Mary

Mary

Basics: Lives in Kalamazoo, MI / Female / Married / Age 46 / 1 child

Occupation: Nurse / $68,000

Activities: Volunteers with the local food bank / She and her partner take an annual trip to a new destination (this year to Seattle).

SW Objective: Mary and her partner Clark are vacationing in Seattle for a week. While in town they hope to catch some local attractions and live music. Their airBnB host in Fremont suggests they check SW’s events calendar on the website.

user testing

To inform how the site architecture and navigation could be refreshed and improved, we organized a card sort exercise and later asked a pool of users to perform our primary task on Seattle Weekly’s active site. We found that many of our users were not able to complete their task due to complications in navigating the site.

We also found that most users began their task by searching google. Given this understanding, we designed each page of the Seattle Weekly site under the assumption that our readers might bypass the front page. Thus, we ensured that clear navigation and site content were accessible to users regardless of what page of the website they visited.

Seattle Weekly card sorting in action on tabletop
card sorting activity

architecture + nav

As we moved forward with design, we found that all of the content could easily be streamlined into the categories of journalism and current events. We built our sitemap around these two categories and introduced a two-fold navigation; Stories and Events.

Of interesting note, shortly after building out the Seattle Weekly redesign we discovered that The Stranger had redesigned their site to include a two-fold navigation; things to read and things to do. We consider that a successful proof of concept!

wires

Building from our simplified site architecture, and informed by our user interviews and relevant data, we began wireframing the site using a mobile-first approach. Early paper prototypes allowed us to walk through our primary task and better understand our user's motivations, movements, and stumbling points. These conversations further informed our design approach and the visual hierarchy as we began building out the redesign.

low-fidelity wireframes for Seattle Weekly redesign concept

style tile

Our style tile drew inspiration from Seattle Weekly’s print edition and includes web fonts that match the Seattle Weekly print typefaces, simple graphic elements that are quick to load on page load, and a responsive logo.

refreshed Seattle Weekly workmark
Seattle Weekly typography style tile
Seattle Weekly graphics style tile
Seattle Weekly style tile article example
Seattle Weekly redesign mocked up on multiple devices

the live site

Our goal was to provide Seattle Weekly online readers a place for engaging stories and current events. We wanted the experience to be on-brand, memorable, and free of any hiccups in navigation. The live site was coded and built by hand, but has since been retired.