Mesh Router App Design
There're many mesh routers in the market for whole home Wi-Fi, but none of them are running OpenWrt and providing configurable security features for users. Compared to the first generation of the GL.iNet router app, this one will primarily focus on improving the usability of mesh network configurations with cloud options and the integration of third-party VPN service.
Cater to the Needs
Using cloud service usually is by default in many consumer WiFi router products, so that users can look up the network status with their mobile apps anywhere. The concern of cloud security is real and we want to keep the cloud options open for the users who enjoy open technologies.
We provide an option for users to blind the access with GL.iNet's device cloud, however, this feature we added in the first generation of the GL.iNet router app was too dominant. According to our user feedback, it’s difficult to navigate the important features of a router, such as network connection, VPN, WiFi connection, etc. Instead, it has too many hardware performance statistics displayed on the homepage. Most importantly, it has no way to tell users how to configure a mesh network on this app with the GL.iNet Velica (GL-B2200) routers.
The home page design of the first generation of GL.iNet router app
I designed the visual guide of router light indicators for engineers to follow.
Make User Interaction Easy
The main purpose of making this app is to make users pair the Velica routers in a mesh network and use the VPN features with clear and simple interfaces. With just a few steps, they can change the basic or security settings of the devices. As the product design lead, I supervised the entire product design process including the hardware and software design.
Compared to the Convexa-B (GL-B1300) mesh router that I designed, Velica (GL-B2200) has much better hardware for mesh networking, as a result, it brings more possibilities in human interaction design. For example, with BLE enabled, the communication between Velica router and the user’s mobile phone still works even when the Wi-Fi network is down. However, the hardware improvement also brings challenges to product design, such as the indicators of router lighting. Traditional router lights are straight-forward that tell the users the on-going network data transmission via constantly blinking, which can be disturbing. For the Velica router, we want it to be an aesthetic home decor as well as a reliable home network device. Velica only has two lights, but with color and frequency changes, it can tell more. I designed a set of the router lighting indication system for 17 types of network and system status for engineering diagnosis, and it can simplify to two status for general users that blue lights means something is not working while white lights means working well.
"Nice visual when your mesh isn’t performing properly. You can see the number of clients attached to master and slave nodes."
by limbot, a user's Velica B2200 mini review
We added a step-by-step visual guide that helps first-time users navigate the mesh network setup process. I also re-designed the home page of the app and added a mesh network diagram to illustrate the real time status of the whole home network.
Beef Up Cybersecurity
Our team redesigned the VPN experience on the new app, as VPN is the most wanted cybersecurity feature on GL networking devices. Unlike VPN client installation on end devices (e.g. phone, laptop, etc.), installing the third-party OpenVPN or WireGuard VPN service on GL routers can provide a secured network-wide covering of all the end devices. One of our recent user surveys shows that a fast VPN on the router is the most wanted feature when consumers consider our products.
The most challenging part in this design task is to integrate as many third-party VPN providers as possible on one app while still providing flexible configuration options to customers. Third-party VPN providers usually have countless VPN config files compressed in their installation packages, and most customers see this as a pain, especially when they run into hundreds of configuration files but only a few are needed. Another challenging thing is to navigate users with different technical backgrounds to customize their VPN needs. To achieve a more customizable product experience, more VPN settings are introduced, however, it also introduces more confusion and complexity.
The new app highlights cybersecurity features.
Keep Options Open
GL.iNet embraces open technologies and makes products for like-minded people. Therefore, we want to provide options for our users. We understand the user's privacy struggle and cybersecurity risk in cloud technologies. Unlike other network device developers, we let users decide whether to access their home network via cloud or not. For those users who want to use our cloud, we also optimize the interfaces to ease their worries on cloud usage.
Improvement in the Future
This new app has several development stages, and getting it to work with Velica mesh routers is the first step. Next, we need to make it work with other GL.iNet routers and eventually upgrade to SDK 4.0. To interact with different hardware, we might need to re-design the setup process for each model. Also, more customizable features will be added to the app, and all these future tasks definitely will be challenging for our team.
App store reviews show that UI has high acceptance but the users still want more features.
