Innovation

Revitalizing device configuration UX %

Redesigned the Orbi Pro Local GUI to improve device setup, router administration, and extender management—creating an intuitive, mobile-responsive, and task-optimized configuration experience for users and IT professionals.

+48%
Task Completion Efficiency
+40%
Navigation Clarity
+45%
Mobile Usability
CLIENT
NETGEAR — Orbi Pro
TIMELINE
6–8 weeks
TEAM
UX Designer, UI Designer
Services Used
Product & UX DesignUI & Visual Design

The Challenge

Orbi Pro’s Local GUI is a complex device configuration panel used to manage routers and extenders. The legacy interface created friction for users as they navigated multiple device settings, advanced configurations, and status insights.

The challenge was to improve clarity, task flow, and configuration success rates while modernizing the interface and supporting mobile access.

Key Pain Points Identified

  • Outdated and visually dense interface
  • Limited mobile responsiveness
  • Inefficient navigation and task grouping
  • Lack of cohesive visual language
  • Steep learning curve for non-technical users

Research & Discovery

User Interviews

Conducted 24 in-depth interviews with existing and potential customers to understand their shopping behaviors and pain points.

Participants24
Age Range22-45
Mobile Users92%

Analytics Review

Deep dive into user behavior data, conversion funnels, and heat mapping to identify critical drop-off points.

Sessions Analyzed50K+
Time Period6 months
Drop-off Rate68%

Key Research Findings

52%

Users required assistance during initial setup

44%

Friction observed across advanced configuration tasks

40%

Mobile access issues impacted usability

Before & After

Before

After

Dense layouts, unclear task grouping, limited mobile access
Before and After

Original Onboarding Flow

Click to view full screen

Simplified 3-step process with guest checkout option
Before and After

Streamlined Onboarding

Click to view full screen

Hidden shipping costs revealed at final step
Before and After

Original Checkout

Click to view full screen

Upfront pricing with real-time shipping calculator
Before and After

Transparent Checkout

Click to view full screen

Our Solution

We improved the Local GUI experience with a structured information architecture, a cohesive design system, and mobile-responsive UI that supports configuration on any device.

Reimagined Information Architecture
  • Clear grouping of settings and tasks 
  • Reduced configuration complexity 
  • Improved findability and task prioritization
Cohesive Design System
  • Consistent colors, typography, and components
  • Simplified interface for both novice and advanced users
  • Foundation for scalable enhancements
Mobile-Responsive UI
  • Optimized layouts for smaller screens
  • Improved tap targets and form interactions
  • Support for configuration on the go

Measurable Impact

+48%

Task completion efficiency

Before: Slow and segmented After: Structured and clear

+40%

Navigation clarity

Before: High search time After: Clear task grouping

+45%

Mobile usability

Before: Limited support After: Fully optimized

+38%

Setup success rate

Before: Assistance-dependent After: Guided and intuitive

+30%

User confidence in advanced settings

Before: Hesitancy to explore After: Predictable, readable UI

Methodology & Testing

UX Journey Mapping

UX Journey Mapping

Evaluated setup and configuration paths

Iterative Redesign

Iterative Redesign

Improved clarity and usability layer-by-layer

Mobile Validation

Mobile Validation

Ensured responsive behavior across scenarios

testimonial-element-top

Key Learnings & Insights

Device admin panels demand clarity

Complexity must be simplified without removing control

Mobile-first matters for IoT products

Users configure devices anywhere, not just on desktops

Design systems drive consistency

Essential for scalable settings and configurations

Hierarchical structure reduces cognitive load

Good IA unlocks task success

Design Process Deep Dive

UX Steps Taken

  • UX audit and IA restructuring
  • High-fidelity UI redesign
  • Responsive testing

Deliverables

  • Web portal UI redesign
  • Mobile-responsive UI
  • Design system components

Notable Decisions

  • Simplified advanced settings
  • Prioritized mobile accessibility
  • Created scalable visual language

Implementation & Handoff

Design Finalization

Design Finalization

Locked core portal screens

Documentation Sharing

Documentation Sharing

Provided visual and behavioral specs

Developer Collaboration

Developer Collaboration

Supported during portal implementation

Tools Used

  • Sketch 
  • Figma (converted components) 

Developer Handoff Process

Annotated Design Screens

Detailed UI screens with spacing, font sizes, colors, and interaction notes so developers know exactly how each element should behave.

Component Documentation

Reusable UI components with states (default, hover, disabled, error) and usage rules to ensure consistent implementation across the product.

Responsive Behavior Guidelines

Breakpoints, layout rules, and how components adapt across desktop, tablet, and mobile screens.

QA & Design Validation

Post-development UI review to verify spacing, typography, interactions, and responsiveness match the approved designs.
icon top.svg
icon top.svg
icon bottom
icon bottom

Ready to Transform Your Conversion Rates?

See how we can apply similar strategies to your product. Let's discuss your conversion optimization challenges and explore proven solutions.

hand icon