Drop down navigation

DROP DOWN NAVIGATION

Challenge: We needed a way for a user to be able discover and purchase SOL REPUBLIC products with the least amount of clicks. The biggest obstacle was that the store was on one platform (Magento) and the content website was on another.

Before:

Previously, a user would have to click on "Shop" in the navigation tab to reach the store or click the "Buy Now" button on our product landing pages that were created on the content website. This let to content duplication and drop-off in the funnel. Additionally, once you reached the store a user was introduced to separate navigation. This created a disjointed experience and requiring the user to be accustomed to a new navigation interface. The biggest issue was that 2.5 clicks to reach a product page.

After:

1. Through rigorous UX research we worked with our design and development teams to build a unified navigation across both platforms. The end goal was for the user to not know they were switching platforms.

2. We chose to employ a drop-down drawer on desktop which, in essence allow for users to window shop our product suite. As you hover over the text in the right hand side you can see an image of the product, the price and color options. Now a user can see all the available items to purchase and with one click from any page on either platform go to the product page to purchase the item.

Clicking on any nav opens drawer. Hovering over a product in the headphones sections display image, price and color options in the right hand side.

Clicking on Speakers would open drawer to view speakers options

3. On mobile and tablet we designed a hamburger menu drawer that slides in from the left and allows users to quickly access the product category.

First click opens drawer

Click on any tab to see secondary categories. Clicking outside the box will collapse the drawer

Search

Search drop down and users can search for items without having to go to another page

Click on search bar expands drawer to type in search result.

Autopopulates results based on search. Window can collapse to return to page

Results

We saw 200% increase in visits to the shop and improvement in sales and conversion rates that was further improved with changes to the product pages. We were able to remove the redundant landing pages and improved overall SEO to product pages by not having to split it across landing page pages and product pages.