Designing an MVP always poses challenges, as it seems full of compromises. Designing one with a real mission motivates despite all the limitations on the time frame and resources.

In January 2017 we had the opportunity to work on the Wattler Android app, which among its many visions aims to increase personal energy consumption monitoring.

Closely following gas and electricity usage not only shows the money spent but also raises awareness of the lifestyle we lead.

Prioritize sustainability; this vision drove the intensive month and a half we spent on working with the Wattler team.

Mobile ux design

Mobile UX Design 101: Finding personas

In a short time frame like this, we needed to think about the multiple functionalities of every basic exploration method.

A hypothetical persona workshop started us off, not just to introduce the client’s possible target audience but also to get familiar with the problem. Then came our clients’ perspective on a successful product.

We also got directions for the upcoming interviews and user tests which we could schedule in our time frame.

Does anyone actually monitor their energy consumption? This question actually challenged us not only from the perspective of recruiting interview subjects but also from that of future user acquisition.

From the four interviews we conducted, we got insights into:

  • Validating personas
  • Which consumption monitoring applications people use (competitors)
  • What motivates people to do so.

We discovered two kinds of personas: those who keep track of their consumption (yes, some conscientious people do!) and those who need awareness education.

Finding the right design

Brand persona workshop

This workshop provided even more domain knowledge indirectly and a view of our clients’ visual and stylistic preferences.

We used Aaron Walter’s template and could set up basic design principles that helped with the process and tone.

We defined the two most important values in building a product as:

  • Informative simplicity
  • Reliability

These general values also clarified that the MVP won’t involve just illustrations and funny empty states.

Considering the short time frame, we could have reasonably chosen to fully follow material design guidelines during the design process.

However, the fallback of creating an MVP app that looks exactly like everything else in the store would have deprived the product of memorability.

Instead of using Roboto, we chose Open Sans to give a special touch to the interface, which had inherited its purple main color from the company logo.

mobile ux design

Scope

The scope of Wattler requirements comprised the following:

  • Easy to scan and save meter with the least user effort
  • Store and visualize data
  • (+1) Filter data based on location

 

Scanning the meter with ease

As we ideated about the app’s different navigation possibilities, we tried to keep the two kind of personas in mind: the power user who visits the app daily to scan the meter and analyze the diagrams, and those who only record their meter monthly or because they need to report it anyway.

The dashboard had to reflect these two types of attitudes immediately.

mobile ux design

Therefore, we designed the scanning functionality to remain within reach, and of course we could easily implement the material fab icon as a solution.

mobile ux design

In our free e-book, called the Product Manager’s Guide to UX Designyou can learn about designing digital products.

 

Data visualization

Visualizing data makes up a separate profession by no accident, so the task was challenging, especially from a mobile UX perspective. We needed to keep things simple to make it comprehensible at first sight.

Aiming to open up toward those not used to analyzing graphs and diagrams, we went with the simple approach.

We took examples of well-known apps that also handle data so we could provide familiar looks and logic.

The touch points where we needed diagrams comprised the following:

mobile ux design

(a) Entering the dashboard, a graph of the general electricity and gas usage trend appears immediately;

(b) The two semi pie-charts on the top help predict the current month’s data based on consumption to date;

(c) It checks electricity and gas consumption for individual locations as well. For multiple properties, filter for each and easily change between months and time intervals

(d) It also checks daily averages.

Growth opportunities for the app

Wattler provides an intermediate solution between the status quo and a smart home. As a practical solution, it raises awareness about sustainability.

Data will allow it to improve in several directions.

From tendency analysis to providing weather and location based predictions about consumption, opportunities abound.

Then comes the potential value behind building a community and going sustainable together: gamifying the entire educative process (eg.: “You saved three trees” etc) and translating it into tangible achievements could become the vision of a movement.

But much need doing until then.

Download Wattler from the Google Play Store and start monitoring your electricity and gas consumption 🙂

 

Do you have any experience in mobile UX design? Have you ever worked on designing a mobile app? Let us know in the comments!

 

If you want to learn about mobile UX design beyond blog posts, surprise yourself for🎄with our Product Design book to dive in our case studies and learnings! We now offer free worldwide shipment.