Navigation Redesign
The mobile nav was too bulky, distracting from content—especially on shopping pages. The goal: make it smaller, more intuitive, and task-focused (like bill pay and shopping).
My role
Lead UX/UI Designer
Company
C Spire
Team
Business Owner Data Analyst Usability Tester Developer QA Tester
The Challenge
The mobile navigation was taking up too much space — especially on shopping pages — making it harder for users to focus on content and complete key actions. We needed to shrink the nav’s footprint while keeping it functional and familiar.
Key Goals:
- Reduce visual weight of the nav
- Prioritize actions like shopping and bill pay
- Improve clarity without sacrificing usability
Research Highlights
Before jumping into design, we set a clear research plan to understand what worked — and what didn’t.
- Reviewed performance data of the existing nav
- Ran a competitive audit
- Applied usability insights from Baymard
Key Insight: A simplified, space-conscious nav could work — if icon clarity and menu structure stayed strong.

Design
I created high-fidelity mockups in Figma with these goals in mind:
- Cleaner, more modern visual style
- Streamlined structure for faster access
- Clearly labeled icons and simplified content hierarchy
Interactive prototypes brought the design to life for testing and dev handoff.
Iteration
Using feedback, we refined:
- Menu content prioritization
- Icon labeling for clarity
- Ensured shopping and billing remained front and center
We also removed sticky navigation — a bold move. Though initially debated, post-launch data confirmed: no negative impact and more screen space for users.


Testing
We ran mobile usability tests on the updated navigation. Key tasks included:
- Finding a device to purchase
- Accessing billing options
- Navigating to the homepage
Findings:
- Users knew what belonged in the nav — and what didn’t
- Icons were easily understood
- Navigation success rate: 100% for both shopping and bill pay
Results
- Cleaner UI with reduced nav height
- Faster access to shopping pages
- Fewer support tickets related to navigation confusion
This project proved that thoughtful reduction can elevate user experience. We gave users more space to engage with content, while keeping key actions just a tap away.
Sometimes less really is more — when it’s backed by data and tested with real users.