ASUS ROUTER REDESIGN
UX, Instructions, Brand & Identity
Artefact + WWU
Working with Artefact as our client, the WWU UX capstone project includes researching, prototyping, and developing a solution to improve the current ASUS dualband gigabit router. This project emphasizes working within a short timeline while creating a realistic project scope. While maintaining positive aspects of the product, the project is focused on optimizing the holistic user experience.
11 Week Timeline
UX Capstone Project
Emma Nestvold - Industrial and User Experience Designer
Marina Semez - Graphic and User Experience Designer
Project Proposal / User Research / Concepting / Usability Testing / User Flow & Scenarios / Prototyping / Brand & Identity / Interface Design / User Experience
Project Strategy & Phases
Our team created a detailed schedule for interfacing with our client over the 11 week timeline. The proposal helped to achieve transparent communication with Artefact and coordination of our timeline with intermittent internal and external reviews. View the project proposal here.
Problem Area Identification
In the beginning design stages, the project started by evaluating the current product from the purchasing experience (online and in store), unboxing, setup, and connecting online. Our main goal was to understand the user from every angle and design for their needs.
Setting the Product Tone
The unboxing experience sets the tone for the product and brand. Without careful curation, the user may doubt their own ability to use the product. Setting up a router is already an intimidating process for many users. How can we instill a sense of calm and confidence during the unboxing?
Performing Clear Communication
At its core, the setup process is the connection of two cords and turning the router and modem off and back on. This basic task is intimidating because many users are unfamiliar with the process or may have had a bad experience in the past. How can we increase user confidence during setup?
Easing Platform Transition
The connecting process has an inherent awkwardness from the transition of media. The user goes from connecting physical hardware to configuring their network names, passwords, and other information on a digital device. How can we smooth the transition from physical to digital?
User Knowledge Divide
Evaluating amazon reviews revealed a deep divide in customer satisfaction. Customers with in-depth knowledge of routers applauded the router performance and comprehensive customization features. However, negative reviews came from users with little or no background knowledge, especially with initial setup. How can the product experience support both high-tech and low-tech users?
After initial research, the project scope was narrowed down to the areas in most dire need of an update that could be resolved within our timeline: the packaging instructions and the router website. These aspects were chosen because they are the most essential to setting up a router.
Defining Design Direction
Ideally with a website of this complexity, user data would be used to help determine which features are kept. In this case, an in-depth analysis of all 60 current features was done to determine what features were creating unnecessary clutter.
High-tech User Feedback
To help supplement the lack of user data, feedback was necessary to avoid getting rid of useful features. Questions were presented to individuals interested in hardware and software. Using the sub-reddit r/hardware, feedback was given about what features advanced users want and use. This confirmed advanced users are specifically interested in port forwarding, static IPS, firmware updates, changing the network channel, controlling the QoS, traffic and bandwidth management, parental controls, open WRT, guest networks, and file sharing or file storage.
With research findings in mind, concepts of user flows were created to solve these problems. Many of the concepts address the disconnect between the high tech and low tech users, both currently using this product. How can you help the low tech users understand setup and basic features without overwhelming them while also providing advanced features to the high tech users?
Instructions & Website
After general brainstorming, 3 concepts were chosen to create a complete user flow and test. These concepts addressed our key issues with different solutions.
1. Complete Directions with Icons
2. Abbreviated Directions with Icons
3. Complete Photo Directions
1. High-tech & Low-tech Interface
2. Choose Custom Features
3. No Customization
Instructions & Setup Usability
Using low fidelity paper prototyping, user flows of each concept were tested. Users were asked to connect the router by following our instructional prototypes as well as complete setup to the website.
CURRENT ASUS BRANDING
ASUS Brand Update
To investigate the future branding application, we wanted to find out: do high tech users like the "hacker look" aesthetic? Different interpretations of high tech looks were assembled into mood boards and tested on computer science majors (identifying with our high-tech user group). They were asked the following word association questions: which mood board looks the most powerful, dependable, high tech, inviting, like the ASUS brand, and which interface would you would most want to use? The association results are shown below each board, scaled proportionally.
Based on our findings, the proposed look for updating the ASUS website should be a combination of "Darker Tech" and "Minimal Tech". Between the two of these, the word association testing covers what the ASUS brand represents and moves the branding forward.
PROPOSED LOOK POWERFUL / DEPENDABLE / HIGH TECH / ASUS / WANT TO USE
Study in Sketch
A high-fidelity mockup was made in Sketch of the website homepage and instructions to show how these styles could be applied to the ASUS brand. At the same time, we want to uphold the integrity of the current ASUS brand.
Iterations and Final
After testing the extended instructions, it was clear that users found these instructions overwhelming and the web setup steps were unnecessary. There was room to condense the instructions and add a better hierarchy as seen in the following version.
After exploring different concepts with varying levels of customization, user testing showed that people want a hands-off approach: the website should not require any customization. This concept allows the homepage to give quick information about the most-used features. In addition, parental controls and the guest network can be turned on and off with the click of one button. For high-tech users, advanced settings can be found under the advanced tab or by searching at the top.
RESPONSIVE WEB DESIGN
Multiple platforms were considered for the design of the setup and website. Below demonstrates how the design would scale based on the screen size.
Project in progress, please return soon!