Web app
February 2023 - March 2023
Collaborators: PM
ZOLEO DASHBOARD
The ZOLEO Dashboard is the place where all important information is displayed. When I joined ZOLEO there was no dashboard, the user would land on the settings page. With the redesign we wanted to provide the users a clear and clean overview of their devices, invoices and other key features ZOLEO offers. I was responsible for spearheading the critical aspects of the development, from researching to planning and brainstorming and designing the MVP. Throughout the process I consistently worked to enhance the functionality and user experience. ensuring its successful launch and subsequent evolution.
How did the dashboard work previously?
The current dashboard lands the user on the settings page and is currently only available on desktop web and does not natively support responsive design.
Challenges
Throughout the ideation, we were continuously experimenting with providing the user with just enough information to successfully use but more importantly understand the dashboard.
The biggest challenge we had to overcome was data overload. From the competitive analysis we realized that some dashboard provided the user with too much information and compared to now would lead to either equal or more customer support tickets, this was something we were aiming to minimize.
The other major hurdle we had to overcome was converting the dashboard and make it responsive to the device. ZOLEO currently only offers Desktop web interfacing for almost ALL of their products and the redesign’s goal is to make the product responsive. This tied in with JUST ENOUGH information.
The last challenge, is to create the dashboard with a short turnaround due to the fact the product was set to launch May.
Defining the problem
Experimenting with the new
There was no existing dashboard, we had created many new flows and sub-flows, and we needed to create a concise and simple dashboard. These flows ranged from making a payment, setting up the device or your contacts, management for all features just to name a few.
We wanted to provide the user with immediate actionable and informative data so started to experiment with the “above-the-fold” first. Key pain-points users currently experience is not know when and how to make a payment as the dashboard does not make it obvious. These pain-points make up 12% of existing support tickets.
So by re-using already designed and development elements we were able to create a uniform experience across all platforms.
Initial examples missed the mark
The initial iteration of the above the fold was well received by the stakeholders as well as internal users. However, after meeting with Customer Support it became clear that we need to continuously provide the user with information as some users are older of age or are trying to use the product in a rush.
So we introduced what is called a disclosure function from the design system. It lets the users show/hide informative content. We documented it so that upon loading the disclosure is closed by default to reduce real-estate for mobile users.
This iteration also introduced some key features the product offers. As an example we have family groups that like to share the device. So to future proof the design, we provided the user a data sharing function see the data used between the profiles stored on the device.
Design concepts
Initial iteration
The initial design was heavily inspired by Verizon’s Account dashboard as it provides the users the best overview of all the elements that are important
Paying
Devices linked to the account
High-level links to plans, contacts, and Billing information.
Definitive design and trade offs
The final design took development limitations into consideration, provided a large overview of recent activities, and showed a better overview of payments with saved cards.
The limitation for development was time. We could not get individual devices displayed with all the attached attributes under an account. It would have taken substantial time to develop it, despite it being the best solution for the user. To compromise for this we created an overview for
# of Active devices
# of Paused devices
And did the same under contacts and their corresponding notifications.
Furthermore, we created an expansive overview of recent billing activity. This has been a major pain-point for users as they currently cannot find a clear overview of when they paid or when an invoice is due/created.
The final design for mobile and web
