UI/UX design case study on the WEAVE app
ui/ux design, Branding
Year:
2022
Technology:
figma, zeplin, XD
Categories:
ui/ux design, Branding
WEAVE is a mobile app that allows users to manage and monitor their Wi-Fi access points and mesh deployments from "IO by HFCL", a leading technology company that offers innovative home mesh routers. The app aims to provide users with a simple, convenient, and secure way to set up, configure, and troubleshoot their Wi-Fi networks, as well as to access detailed analytics and reports on their network performance and usage.
The objective of this case study is to analyze the design process of the WEAVE app, the challenges it faced, and the strategies it adopted to overcome them. The case study will also provide some recommendations for the future improvement and enhancement of the WEAVE app.
Background
WEAVE app is the main interface between the users and the IO by HFCL products, and hence, it plays a crucial role in providing a smooth and satisfying user experience. However, the WEAVE app has faced some common problems, such as:
Complexity: The WEAVE app has too many features and functions that often overwhelm and confuse the users. The app also has inconsistent and complex user flows that make managing and monitoring the Wi-Fi networks harder and slower.
Lack of customization: The WEAVE app has a fixed and rigid layout and design that does not allow the users to customize and personalize the app according to their needs and preferences. The app also does not provide the users with the option to create and save their own views and reports.
Lack of interactivity: The WEAVE app has a static and passive presentation of the data and information that does not engage and motivate the users. The app also does not provide the users with the option to explore and manipulate the data, such as zooming, panning, filtering, sorting, and exporting.
Analysis
WEAVE app has undergone a major redesign in 2021, with the aim of simplifying and improving the user experience. The redesign process involved the following steps:
User research:* The WEAVE app team conducted user research to understand the pain points, needs, and expectations of the users. The team used various methods, such as interviews, surveys, observations, and analytics, to gather user feedback and insights. The team also conducted a competitive analysis to benchmark the WEAVE app against its rivals and identify the best practices and gaps in the market.
Ideation: The WEAVE app team generated and evaluated various ideas and concepts for the redesign of the app. The team used various techniques, such as brainstorming, sketching, wireframing, and prototyping, to visualize and test the ideas and concepts. The team also involved the users and the stakeholders in the ideation process to get their inputs and suggestions.
Implementation: The WEAVE app team implemented the redesign of the app by developing and deploying the new features and functionalities. The team used agile and iterative methods to ensure the quality and efficiency of the development and deployment process. The team also conducted usability testing and user acceptance testing to ensure the usability and satisfaction of the users and the stakeholders.
*Simplified user flow: The WEAVE app simplified the user flow for managing and monitoring the Wi-Fi networks by reducing the number of steps and options. The app also improved the consistency and clarity of the user flow by using intuitive and familiar icons, labels, and gestures. The app also added a bottom navigation bar and a side menu bar to provide easy and quick access to the different sections and features of the app.
Customized layout and design: The WEAVE app customized the layout and design of the app by allowing the users to adjust and rearrange the size and position of the charts and graphs according to their needs and preferences. The app also provided the users with the option to create and save their own views and reports, as well as to share and export them to other formats, such as PDF, Excel, and PowerPoint.
Interactive data presentation:* The WEAVE app interactive the data presentation of the app by adding animations and transitions to the charts and graphs to make them more engaging and appealing. The app also provided the users with the option to explore and manipulate the data, such as zooming, panning, filtering, sorting, and exporting, as well as to drill down and see the details of the data, such as the network status, speed, and usage.
Discussion
WEAVE app has demonstrated a remarkable improvement and enhancement in the user experience, by leveraging its strengths and overcoming its challenges. WEAVE app has adopted various strategies to sustain and enhance its competitive advantage, such as:
Focus on user-centric design:WEAVE app has focused on user-centric design, by involving the users and the stakeholders in the design process, and by understanding and addressing their pain points, needs, and expectations. WEAVE app has also focused on user feedback and reviews, and by constantly testing and iterating the design solutions.
Revamp of business model:WEAVE app has revamped its business model, by adopting a platform model, instead of a service model, for its app. WEAVE app has also partnered with various stakeholders, such as IO by HFCL, ISPs, TSPs, and home automation providers, to offer more value and benefits to the users and the network providers.
Leverage of technology:WEAVE app has leveraged the latest technologies, such as artificial intelligence, machine learning, and cloud computing, to enhance its functionality and performance. WEAVE app has used these technologies to offer more personalized and customized options, to optimize the network configuration and performance, and to ensure the security and reliability of the network.
Design Screens
The following are some of the design screens of the app:
Screen: The home screen of the app allowed users to view and manage their Wi-Fi networks, such as the network name, password, mode, and status. Users could also access the menu, profile, and settings from the home screen.
Network Screen: The network screen of the app allowed users to monitor and analyze their network performance and usage, such as the network speed, bandwidth, devices, and traffic. Users could also see the live location and status of their access points and mesh deployments, and troubleshoot any issues.
Parental Control Screen: The parental control screen of the app allowed users to set and manage the parental control settings for their network, such as the time limit, content filter, and device restriction. Users could also view and manage the profiles and activities of their children or guests.
