NavBar
Revamp
UI/UX Design
August 2019 (2 weeks)
Overview
Revamping of SocialPilot's navbar to provide more emphasis on the key features and better information categorisation for users.
SocialPilot is a SaaS social media management tool helping small businesses and digital agencies manage social effortlessly!
Problem
The broad categorization among features makes it difficult for the user to navigate across them, decreasing the reach.
Users
SocialPilot existing customers + website visitors (marketing agencies, business)
Goal
Categorization of similar features and making navigation easier and more friendly for the user. Increase footfall on various features pages.
Empathize
Few of the issues we observed:
1.Traffic on features link is very less since 70% of customers are interested only in scheduling feature. This led to non-discovery of other features.
2. Navbar's spread over the entire width made it difficult to categorise links from buttons (Log In, Start Your Free Trial)
3. Lack of negative space led to wrong link being clicked, hence increasing churn rates.
_pn.png)
Define
Content
I worked with project managers, content writers and CEO for the copy for navbar and group similar features for ease of navigation. After multiple meetings and iterations, we decided to have 3 dropdowns, and 3 action buttons.
.png)
Ideate
Based on the information categorisation, I worked on a few design solutions. The basis for different designs for the structuring of links at various levels.
Design 1
Design 2
Design 3
Design 4
Final Results
Post various usability testing, design 4 was selected as the final navbar layout design.
All the features are shown on a single hover, with column wise separation of similar features.
Icons were added with the redesigned SocialPilot logo to make the navbar look more dynamic and user friendly.
Impact
After this revamp, conversion rate increased by 4.68%. There was an increased visitor footfall on non-scheduling feature pages like collaboration, analytics, facebook ads by 33%.