thredUP.com Navigation Overhaul

About thredUP:

thredUP is Goldman-Sachs backed fashion resale website for consumers to buy and sell secondhand clothing online. At any given time, the site can have 1 million unique items for sale, which creates a unique challenge for shoppers to find items they like.

thredup-up-header-e1517948982398.png

Role:

Team Manager and Product Designer

Overview:

Redesign of thredUP.com in order to improve navigation, mobile web usability, and introduce SEO

Results:

  • Average product detail page views increased from 5 to 6

  • Increase in search engine rankings

  • Faster page load times

  • Improved mobile web usability

 Final Designs

Problems with the former navigation

  • Not optimized for SEO content

  • Mobile web navigation was challenging to users

  • Too many clicks/taps to drill down to popular categories

  • Breadcrumbs displayed internal jargon that wasn't customer-friendly

  • Too many filters showing that weren't what users expected or wanted to see

  • Fonts were not accessible

  • Users had a hard time locating where to find information on selling clothes

 

 Old navigation circa early 2016

Old navigation circa early 2016

Process

Tree Testing, Wireframing, Prototyping, Visual Design, and In-person Usability Testing

  • The team consisted of a PM, Visual Designer, User Researcher, Acquisition Marketing Manager, Creative Director, Art Director, VP of Merchandizing, and me as design lead.

  • The information architecture (IA) was re-organized by myself and key stakeholders in order to optimize for product findability and SEO keywords.

  • We tested the new IA with several rounds of tree tests before designing in order to uncover any issues with findability of our top products.

  • I created wireframes in Sketch and created an interactive prototype in Marvel to use during in-person user testing and stakeholder buy-in.

  • A visual designer completed the designs to pixel-perfect perfection. They were passed off to engineers using Zeplin.

Results

The results were a fully responsive web experience than transitioned seamlessly to mobile web. SEO keywords were put in places tactfully so as not to impede user experience. This meant that a lot of keywords were hidden for mobile web in order to optimize for speed and to keep the content on the smaller screens more directive. 

mobile web navigation.gif
  • A hamburger was introduced in order to teach the user where the primary navigation resides. 

  • Breadcrumbs were displayed on mobile web so users could rely on recognition rather than recall to know where they are at all times.

  • When a user returned to the hamburger menu, their current place in the navigation would be highlighted so they would remember where they were and go back up a level with ease.

  • Navigation was designed to go down to the tertiary level in order to allow the users to drill down even further through the hundreds of thousands of unique items.

  • Global banners on the homepage were added in order to be flexible enough to accommodate different use cases provided by marketing.

 SEO terms specific to each category placed in left side navigation.

SEO terms specific to each category placed in left side navigation.

  • SEO content on the left navigation, hidden content in the titles (a nice compromise between UX and marketing teams), and the bottom of the page.

  • Breadcrumbs were redefined with more user-friendly terms

I’ve hit rock bottom.

Take me to the top.