Case study: UX for an android app without contact users

I had the request to design in less than a Month the Android APP of Mini Brew, a startup from The Netherlands that creates machines to brew beer at home through a mobile APP.

Context

Before this new design, Mini Brew works only for iOS. In the last year the company was growing faster and they decide to invest in an Android APP.

When i start seeing a few screenshots of the APP, I quickly recognize several problems in the UI.

In this case of study i will talk about the issues that i recognize in the iOS APP and how I solve them.

Constrains

• We had only one month’s budget for the new design
• I didn’t have access to users or any previous UX/UI deliverable to understand the current APP (No user journeys and flows, UI style guides, or user pain points found).
• I couldn’t install a test version of the APP in my phone.

Reviewing the app

With a screen recording of an iPhone I could review all the flows and styles of the APP.

Main Screens of the current iOS APP:

UI issues

Seeing the App I could quickly recognize several issues:

• The login has a strange order in its elements, the password input and the “forgot?” button weren’t grouped, and also “forgot?” wasn’t clear enough.
• The sign up link doesn’t have the importance that it needs.
• The account setup inputs haven’t the amount of contrast that needs to be legible.
• The yellow button over the white background represents a contrast problem too.

Yellow was the brand color, so the most difficult thing to improve was the Call To Action contrast. It wasn’t a good idea to change that, so I change the background color.

I created a dark UI improving the button contrast.

New sign up screens.

Understanding flows

In the APP the user has 4 Main tabs:

• Recipes
• Brew
• Profile
• Shop.

For this new design, users haven’t the chance to select a recipe and buy it through the app, they have to do it from the Mini Brew website.
So, I had to design only the “Brew” and “Profile” flows.

Brew flow

The APP approach was: first select the action you want to make, and then select the device to make that action.

So, if users want to start a new Brew, they have to click on “start new brew” and then they need to select a machine to brew it.

iOS old design. Showing that always need to select a device after choose an action.

I mapped the APP main flow to understand if this way of going have sense for the users journeys. I highlight the parts of the flow where the user needs to select a device.

Main action flow that highlighted the device selection.

In my opinion the flow has to be the other way around, first selecting a available device and then selecting the action to do.

So, I asked to my boss

• How many devices a user could have?
• Wich is the most common number of devices per user?

And the 90% of the users has only one device, and the other 10% not more than 3 o 4.

Once I understand that I redesign the Main flow of the app.

I based the new approach on users’ devices and on the actions they made on them.

This is the flow redesigned.

This is the new flow I made, to align the APP to the user’s journeys.

The APP becomes simple, more organized and easy to use.
I changed the approach and now, users see:

• A list of their devices.
• The status and in progress sessions of each device.
• They can enter to a device and set up it.
• If the device is brewing or fermenting, you will see the session in progress.

This new approach it seems to be more logical, actions like “Add a device” are more contextual now.

The new approach for the Brew flow.

Refinement

Then with a new and better approach, I needed to know the feasibility to develop the new design. So we refined my idea.

Developers said that would be the same because I was just grouping UI elements, but the features were equal.

So, I introduced a big improvement without compromising the development side.

In the month that I had, I redesigned the entire app, not just adapting the iOS APP to an Android version, I also:

• Improved the flows based on user activities.
• Solve UI issues based on best practices.
• Improve the APP usability regarding the current user flows.

One of the more significative screen of the iOS App was the “brewing session”
I simplify the screen, using a time line common pattern instead of the circles of the left.

In my opinion this new approach improves much more the legibility of the screen.

I also redesign the profile tab too.
I name it “settings” and create hierarchies for the actions in it.

Conclusion

Without time, access to users, or any documentation about the APP, (based on my previous experiences and good practices like Nielsen heuristics) I could redesign and improve several Usability and interface issues of the Mini Brew APP.

For sure, if the project scope was different, I could validate all this improvement hypothesis with user testing.

Now is the time to implement the new design, measure its performance, and collect user feedback to improve it.

Thank’s for your attention!