Loading...
Re-design the Navigation
the GPS of the Website
This is a fashion ecommerce company aiming at reducing the pollution and waste in fashion industry and extend the life of clothes by trading in pre-owned designer fashions and selling again.
Business Model

The original navigation of this site are separated with 4 parts:
Trade-In, Shop Pre-Owned, Shop New and Frontier

The first three correspond to three main businesses of Material World and Frontier is the blog section.

The old navigation
Problem Detection
  1. Based on the feedbacks from customer service team, for new users, it is not very clear to get a general idea of what businesses this company is doing at first sight of the website.
  2. There are also statistics coming from the sales and marketing department revealing that, Trade-In and Shop Pre-Owned contribute most to the business growth of the company, so the design of interface should reflect this business focuses, instead of equally juxtapose all items in the navigation.
  3. On the other hand, the nav item Frontier, which links to the blog of news and stories of the company, is not only confusing by its name, but also distractive sitting at the same level of the top nav with other businesses.
  4. The mobile site basically wrapped all items into the side nav drawer which made it a super long list. Larger categories are expandable and contain smaller ones. It is a bad way of interaction in mobile context because the user can easily get lost in endless scrolling, and it is hard for them to find what they want quickly.
Design Solutions
  1. Took out Frontier from top nav (with the approval of PM and co-founder).
  2. Put Shop Pre-Owned and Shop New together under a higher level group Shop, and then aligned it with Trade-In on the top nav. So now it is clear for the new user that this website is about trading in and shopping fashions
  3. In my new design, when the user hovers on Shop, it reveals the secondary navigation flyout where the Shop Pre-Owned's categories take larger space than Shop New's. In this way, the occupation of space suggests the emphasis of the business
  4. As an ecommerce website, the navigation is better to be informative enough to help customers to find the products they want quickly and easily. Based on this concept, I added the dynamic third level items to the flyout
Deciding which items to include in the navigation
New Navigation Design