Health own
For this assignment we have been tasked to design part of an app for HealthsOwn. This is an app that will help users to set goals for their day, register information about their mood, as well keeping track of their overall feeling.
The requirements from the client was:
-
A user signs up for the app to create a private account (they can sign up with an email address and password, or by using Google).
-
Daily check-in: The user is asked to check in and rate their day (good, okay, bad) so the app can track how their overall day went for the whole month period.
-
Mood check-in: To track their fluctuating mood throughout the day, the user is asked which emotions they're feeling (this can be viewed later).
-
Health habits: The user has a list of health habits they can check off a list. The user has access to free workout and meditation exercises to relax and de-stress.
We had a lot of information about what the clients envisioned for this app. This meant that our features were already decided, and greatly reduced the amount of research we needed to do.
Therefor we started by trying to understand our users and the competition we are up against. While one of our team members created a primary persona, the other two members spent our time on competitive research.
When this was completed we felt confident in doing the final preparation before sketching. This meant for us to create information architecture and user flow.
The final high fidelity wireframes
Summary of this case study:
In this project we learned a variety of new areas to keep in mind when designing for mobile. We reflected a lot on to use components and varieties to created different states of one instance. This was very beneficial when creating the different buttons and input fields/text area. By creating different states, we were able to show case how an action will look like in active and pressed mode, as well as when an error occurs. Secondly how to use empty stages (Welcome screen) to communicate with users. After the user have either successfully log in or created an account we decide to have an empathy screen which we decide to call Welcome screen. This screen were design to inform that user they had successfully logged in and will only be visible for 3 seconds before the user will be redirected to home screen of the app where they can track their mood, daily feelings and habits.
Our focus was on accessibility and how to use a contrast checker to ensure that our design meet the WCAG AA requirements level. The different ways to create and organize information architecture depending on the product and our preferences. We discovered that almost every version of this was different, and that there is a lot of possible options to choose from. There are some common practices, but unlike user flow we could not find a set system for shapes and the amount of material to include. In the process of working with the assignment, we as a team have been able to play on each others strengths. To be able to bounce ideas of each other and add our own takes on the task made it a lot more manageable. In addition to this, it has been easier to prioritize time where it is most needed because we have had more workforce than if we would have solved it by ourselves. The total experience has therefor taught us a lot, and made each of us grow as designers.