Wellness project: Creating a journaling/moodtracker App
Let me introduce you to our App called “Keep or Let Go”, an App created for the wellness project of Ironhacks UX/UI Design Bootcamp. In this case study I will guide you through the process and explain why and how decisions were made and how we got to the final outcome.
The Brief
In this project, June Audirac Kushida and I had to work for the Daily Health Conference — a non-profit organization dedicated to promoting health and wellness through impactful public talks, participatory workshops, and professional training all over the world. The main task we had to tackle was to rethink how people can adopt and commit to a health-improving routine.
The app could address any aspect of personal well-being, including (but not limited to): medicine, fitness, nutrition, meditation, time management, and so on. It should monitor the users’ progress and encourage them to adopt a healthier lifestyle while having also control over their personal data. Last but not least, the user interface should reflect a new, fresh, updated image aligned with the Daily Health Conference values.
Important to mention at this point is that the Daily Health Conference is an existing organization, but the project and missing were fictional.
First Steps
First of all, we decided to begin with an open concept for our project, which was about “journaling” and “mood tracking”. We sat down and did a mind map of all the terms that came to our minds, when we thought about wellness and journaling.
We worked along the Design Thinking Process and started with the empathizing phase. We wanted to explore and dig deep into people’s minds and their understanding of the terms “(mental) health” and “emotional consciousness, as well as their attitude towards journaling.
We interviewed four people and came up with some really interesting insights:
- Self-awareness plays an important role in the everyday life
- There are different ways to keep yourself mentally healthy (meditation (body scan techniques), yoga, talking to people and writing thoughts down -> Journaling!
- Journaling was also mentioned as a way to process emotions -> it helps to get rid of bothering thoughts and leads to clarity in the head
- The motivation of writing (and looking back to it) is caused by the wish to analyze when and why mistakes were made — and also to avoid making the same mistakes again
- There is a tendency to write things down, when there is a feeling of emotional distress
As a part of the first phase we did a competitor analysis. We realized that there is a vast amount of journaling and mood tracking mediums out there. Some of them are fully analog, as in books, some are a combination (as a book, supported by a website for further information) and fully digital (apps).
- Daylio (Micro-diary App to track mood and activities)
- Moodfit (App to track mood, activities and giving additional exercises and personal reports)
- Punktkariert (Bullet Journal with creative part (drawings/mandalas) with a website for the community)
- 6 minutes diary from Ur best self (Book with scientific explanations and personal diary)
- And many more
Define Phase
After collecting all the information from the interviews, competitor analysis and secondary research, we needed to synthesize the data. For this, we created an affinity diagram and combined all the insights we got to that point. To decide on which design opportunity we want to focus, we formulated a bunch of “How might we’s” that followed a dot voting exercise. In order to make the best decision, we created a user persona. Let me introduce you to Aimee:
Taking Aimee’s goals, frustrations, fears and thoughts into perspective, we focused on one design opportunity. Our final decision can be expressed like in the following:
How might we help people organize and process their thoughts and emotions?
In a survey we wanted to confirm our assumptions about Aimee. The results were pretty clear and supported our user persona — they also gave more confidence in our decision making process:
- Around 50% say that they process their emotions only fairly
- 86,5% generally analyze their former past emotions or actions
- Around 93% say it is important to them to know where their emotions come from
- Almost 70% agree or strongly agree that a tool to process thoughts and emotions would be useful
(n=52)
Next phase: Ideation
This is definitely one of my most favorite parts of the Design Thinking Process, because here you can get very creative and let your thoughts and ideas run free — but in combination with seeking for solutions. To come up with as many ideas as possible to solve our HMW, crazy 8s seemed the right technique. I think, especially due to the time pressure of 1 minute per idea, you might surprise yourself during the process and come up with lots of possibilities. Subsequently we took the best idea of the process and decided to each draw a concept. As we discussed and liked both concepts very much, we went for a concept test to see which one to focus on.
The feedback was not very distinct, as people liked certain aspects of both concepts — so we decided to try to combine both. Usually you would be happy to get a clear result, but when it comes to dealing with thoughts and emotions, people have different ways and approaches to do so. This is why we didn’t want to focus only on one concept.
Prototyping
Time for low-fidelity prototyping! We started drawing and went for further testing.
The lo-fi testing gave us a lot of very useful insights and uncovered some flaws, which needed to be solved. One main problem in the first test round was, that we went too much on “low-fidelity”, in the sense of no colors. People didn’t understand in general, that if they choose a color in the first screen, it would have an impact on the following process. After understanding that, we worked with different colored dots to make it more easy for the user to understand how to use the prototype.
A big positive feedback was the animation part — even though it wasn’t that exciting in the black and white, people got the idea of it and were amazing of the idea to just let go of something. They were also quite surprised that their entries would be group in different ways, but to do that in the sense of colors (which were representing their emotions at that point) felt for them very innovative and interesting. This is why we decided to keep the two user flows:
First User Flow
You will be asked on the first screen to write down your thoughts and/or choose a color for your current feeling. You will then be asked if you want to keep or let go of your entry. If you let it go, balloons will fly away to symbolize the action of letting go of your feeling and/or thought.
Second User Flow
You will start as in the first flow, but you decide to keep your entry and you can personalize it by adding music, pictures, drawings, categories and hashtags. In a next step it will be saved and you get to the main dashboard, where your entries will be grouped in clouds which have the same color/emotion. End of Flow! From there you can also let all your entries be displayed in the structure of a timeline or grouped in categories (e.g. everything that got the category “happiness”).
Time to get more concrete. June and I worked on the content and created a sitemap. During this process, we also uncovered one major problem, which was about naming different content. We gave the option to the user to add hashtags and categories to their entry, but they were actually describing the same thing. In the sitemap we saw this by drawing it on post it’s and ordering content to each site.
Straight from that we created the mid-fidelity prototype. After a lot of testing rounds, this was an easy and quick one, because we had gathered so much feedback. And again….
Testing. This time we did usability testing of our mid-fidelity. In the creation process of the moodboard and brand attributes, we came up with the following:
KEEP AND LET GO is …
- flexible
- personal
- playful
But never…
- mandatory
- overwhelming
Prototype round 3: Give some juice to it. For the high-fidelity we added everything we came up with for our brand and came to the final result:
In our testings we got one feedback which made us change the structure of our screens. Describing emotions with colors is something which differs from person to person. For one person “happiness” is connected to blue, for another person it is connected to purple. To give the user the option to personalize this color pallet, we added “adjust”, which was not very clear in the testing. We then decided to give a little introduction and context, where people can type emotions and then, in a very playful way of dragging over the screen which is changing color by doing so, they could select a color which is “for them” connected to that particular feeling.
Please check out our prototype here:
All together this was a very insightful and interesting project. We learned a lot through prototyping and testing and doing this over and over again. We could get very creative and had a lot of fun during the whole process. For the future I will try to work a bit on colors and typography, to make this app look a bit more mature, as we went very playful in this very first version.
Many thanks to June Audirac Kushida for being such a lovely project partner!
Hope you enjoyed reading this case study and feel free to leave a comment:)
