Super B creates robust, safe, and easy-to-use lithium batteries for people and companies to use wherever they are. Their technology is being used in RV's, marine, and even industrial applications. Some of their batteries have wireless capabilities for greater control and data analysis. They came to me with the need for a completely new mobile app — one that would replace their old app and helps the user control their batteries, easily understand complex data, and provide a user experience that is in line with their brand guidelines. I was responsible for the UX design, visual design, and prototyping.
This project started with many ideas of what the app could do and how to translate complex data into simple instructions for the user to follow. As this is a total redesign of their old app, we worked with stakeholders to define what the MVP of this new version of the app should be. We did research on the user and how they would use the battery in combination with the app. We came to the conclusion that there are different types of users. I decided to layer information and label it as 'basic', and the more complex controls and data as 'advanced'. This gives users the flexibility to understand the basics of it, as well as do more with the product and the data it provides when they become more experienced
The user can add multiple batteries. Adding new batteries is part of the onboarding flow and should be very easy for the user to complete. Because there are different types of batteries, the onboarding flow will be slightly different based on what Bluetooth signal the app is receiving. Sometimes it is necessary for the user to confirm a connection by pressing a button, while other times a QR code scan is required. The app will always show the user what to do.
I designed every single onboarding flow and its requirements to create a clear overview of all the different paths.
Controlling the battery is very easy. When you're connected, just press the one you want to control and you'll land on what I like to call "the dashboard". Here you will find a nice overview of the current status, percentage, operating mode and even the amount of current and voltage floating through the battery.
Naturally, the design must be in line with Super B branding guidelines. But there was also room for visual experimentation. There I tried to simplify data into visually appealing elements that draw the user's attention to the ones that matter most. For example, the battery percentage is displayed as what I call "battery fluid." The color will indicate the status of the battery. Things like "almost empty", "fully charged", but also "sleep mode" and "no connection". This will make it very easy for a user to understand what state the battery is in.