My role:

User Research | Design | Illustration | Documentation | Design socialization | Cross-collaboration with Product Management, Support, Engineering, Industrial Design, ODM, and Marketing teams.

SITUATION:

The 2010 Linksys Smart Wi-Fi platform enabled a significant advancement in consumer home networking by integrating cloud-based management and mobile accessibility, but the software industry was moving on and our product team had to innovate again if we were going to continue to support our mainstream and expert users.

• All Linksys routers came with a CD for setup, but CD drives were becoming obsolete in laptop computers. This was a major problem, and we needed a way to set up routers without a CD setup option

• The previously released flagship Cisco home networking product (that I worked on too) named Cisco Connect, only showed network visibility and status at home, and users wanted to monitor their home networks when away from home.

• Both mainstream and expert users felt limited in functionality and wanted to choose their level of engagement with more advanced features.

• Product Management, Engineering and Design each faced difficulties with duplicate workstreams to manage two separate tailored experiences, one for mainstream and one for expert product experiences.

GOAL:

Innovate and streamline the setup workflow with a modern setup workflow. Create a single, easily accessible browser-based portal that supports both mainstream and expert demographics where users could securely login and choose their level of engagement in managing their home networks.

PROCESS:

• Cross-functionally workshopped 0-1 design product definition through multiple iterations with Product Management, Engineering and Marketing

• Partnered with User Research to test workflows and gain user-centered insights

• Partnered with Product Management to socialize user sentiment across our cross-functional Engineering, Support and QA team team to gain visibility and broad alignment

• By this time, our design team had grown. Now a team of three, we workshopped the design direction and product architecture with Engineering and Product Management and defined the holistic UX

• Our design team partnered with Cisco Marketing and Branding to define the overall color of the UI and finalize a product logo, which a designer on our team had created

• I designed the comprehensive look and feel of the UI, and co-managed the pattern library and style guide within our design team

UI components and pattern library

• I designed a number of the feature workflows, and worked cross-functionally with Product Management and Engineering through implementation.

• Create all device illustrations and wire diagram illustrations for device setup scenarios across all shipping devices

• Partnered with Product Management and Cisco and Linksys device manufacturers and continued personally designing all router setup software and in box setup documentation

RESULTS:

Created the Easy Router setup experience - install with a USB device, to be used for all Cisco and Linksys devices (routers, cameras, network extenders)

Created a cloud-based platform with browser-based / mobile remote access, Cisco Connect Cloud… (soon after renamed Linksys Smart Wi-Fi) - a browser-based network management tool. Link to an article with more details

• Providing six “Smart Wi-Fi Tools” mainstream network management features

  • Device list - a display of all connected devices

  • Guest access - ability to set up a guest network, without compromising the main network

  • Parental Controls - content filtering with the ability to block access to websites and set time-based scheduled access for specified devices.

  • Media Prioritization - Bandwidth allocation per device or application

  • Speed Test - provided the ability to test upload and download speeds

  • External Storage - through router USB ports, users could connect network storage devices and enable file sharing across the network

• Offering more advanced networking features within a “Router Settings” menu for more technical home network expert users

  • Connectivity - enabled router connections, configuration and network management

  • Troubleshooting - provided network diagnostic tools

  • Wireless - enabled control over the two available 2.4 GHZ and 5 GHz wireless bands

  • Security - Enabled control of Firewall, VPN, Access Restrictions, UPnP, Remote Management, Port Forwarding/Triggering, and Password Management

• Partnered with engineering to implement pixel-perfect designs

• Partnered with engineering to implement sprites for all setup software wire diagramming animations

• Designed end-to-end consistent visual language from Easy Connect router setup, through Linksys Smart Wi-Fi network management software.

• Paved the way for IoT home networking ecosystems by lowering the technical bar for everyday people and enabling cloud-based home network management with very little technical knowledge.

SITUATION:

Setting up a Linksys router required 7 to 12 steps and over 20 minutes, often leading to frustration and failure. User research indicated that customers found the process tiring and untrustworthy, with less-savvy users having a high rate of failure. Users felt lucky to get their wireless network setup, as the in-box documentation and setup guide provided little user education. Extra network management features were buried in the confusing router admin portal, requiring users to enter the router's IP address (for example 192.168.1.12) to be entered in a browser for access.

GOAL:

Simplify the setup process from 7-12 steps. Create networking management software that caters to both mainstream and expert users to users.

PROCESS:

• Cross-functionally workshopped 0-1 design product definition through multiple iterations with Product Management, Engineering, and Marketing design

• Partnered with User Research to test workflows and gain user-centered insights

• Socialized user sentiment across our team to gain visibility and alignment

• Partnered with engineering to implement sprites for all interactive components (buttons, transitions and workflow patterns)

• Partnered with engineering to create router setup wiring diagrams that were initially static and later became animated sprites as well.

• Partnered with engineering to implement 9-grid scalable images for various dialogs.

• Created all UI artwork

• Create all device illustrations

RESULTS:

• Easy Connect Setup, a three step CD-setup process to get connected to the internet with near 100% success rate.

• The router setup was coupled with Valet network management software for mainstream users and Cisco Connect software for expert users. The software experience provided tailored functionality and included informative networking language aligned with each demographic.

• Easy router setup and hassle-free Valet and Cisco Connect software network management experience, provided an approachable, educational, and empowering UI that were industry-first paradigms for consumer network management software focused on ease-of-use.

SITUATION:

Network Magic was designed to help less-technical users manage home networks by providing a secure, approachable software product that simplified network management. As advanced networking features were added, power users criticized the lack of a mature, professional-looking UI. By 2007, research, support, and user reviews revealed a lot of negative feedback, with the sentiment that the UI felt outdated and was likened to the 1996-era Windows 4 design. This undermined trust and impacted sales.

GOAL:

Redesign the product with a modern, professional UI, and include a more advanced network map to engage both technical and non-technical users, while simplifying networking tasks for both demographics.

PROCESS:

UX research / Design iteration, Design socialization, Cross-functional collaboration

RESULTS:

• Network Magic 5.5 product update included a number of feature enhancements.

• More robust notification and task discoverability system.

• Full re-skinning of the application that included an overhaul of all iconography.