top of page

Alida: mobile dashboard 

The Project: 

Alida is a SaaS product that creates marketing research studies and tracks their progress so companies can improve upon their product, service, and company image.

In the first 4 months at this company, I was assigned as the lead designer for the mobile application. My main goal upon arrival was to take their first iteration of the application visual charting components and improve upon them.

The Process: 

Upon analysis, I realized there was a lack of usability and accessibility as all of these components were taken from a third-party application called Looker and placed within Alida’s product as i-frames. 

 

After coming to the conclusion that Looker did not work for mobile, Alida was looking to redesign and update the charting components to a React plugin called Fusioncharts. 

 

With the opportunity to reimagine how these components worked, I worked closely with the senior engineer to ensure accessibility standards were met and readability was achieved in all UI elements. 

6_edited.jpg
Old
6_edited.jpg
New

The biggest hurdle to work around was the volume of data that most of these visuals were trying to represent. It is important to note that there is a desktop companion to the Alida application but unfortunately these dashboards were not designed in a mobile first approach. I was tasked with fitting lots of data in very little real estate.

The Solution: 

I simplified the way the data was displayed was to limit the amount of data shown to the most recent metrics. This was done with the knowledge of how our users interact with a mobile app; in an ad hoc fashion while on the go. If a more in-depth analysis is needed to be done, research showed that most users would do that on a desktop.  

The video here shows a scroll of all the components made. All charts have a maximum of 6 x-axis values to increase readability and allow for tooltips to emerge on tap. I also created a toggle present in all components that had 3 more y-axis values to aid readability. The toggle also serves the platform as it accommodates different mental models and allows details of recent metrics to all be surfaced at the same time in a table. 

bottom of page