Re:Mind
Reminders for healthy habits
I worked in a team of 3 with our client, Re:Mind, in order to test/iterate the UX of the current app and designing a sync feature for the wearable device. I also worked alongside the client as the sole UI designer post-project.
My Role: UI Designer, UX Designer, Researcher
Tools: Figma, Sketch, Miro
Duration: 2 Weeks
Process: Double Diamond
The Challenge
Finding a way to enhance the experience on the Re:Mind app and make it more efficient for users.
The Problem
-
Test/iterate the UX of the current app
-
Consider what features would be most useful to the users
-
Design a way for the app to sync to the wearable device
Deliverables
-
Competitor analysis
-
User research findings (user interviews, user testing)
-
Persona
-
Experience map/User journeys
-
Information Architecture
-
User flows and screen flows
-
High fidelity mock-ups
-
Final presentation
Outcomes
-
Project completed on time
-
Additional features added to add value to users experience
-
Positive feedback from client on changes to the UX
-
Worked alongside client on solo UI reskin of their website
Overview
Re:Mind are a London based startup centred around encouraging its users to practise self care through the form of setting healthy habits. Users can achieve a state of mindfulness via Re:Minds’ vibrating smart bracelet and an accompanying habit setting app.
Usability testing revealed that users of the existing app encountered several issues surrounding the placement of information and the clarity of the app’s function. Carrying out competitive research, user interviews, created personas, a design studio and user testing on wireframes helped provide us with a solution. I also worked alongside client on solo UI reskin of their website .
Discover
What Else Is Out There?
We began by acquainting ourselves with 5 of the most popular direct and indirect competitors reminder/habit apps.
Feature analysis indicated that presenting users with sugestions for potential healthy habits in which they could implement was more an intuitive means of habit setting and would most likely result in users becoming more predisposed to setting new habits. We kicked around the idea of goal-tracking but our client was more interested in users focusing on the present moment, not on prior or future achievements.
Paying Attention To Design Patterns
The best habit/reminder apps shared these recurring design patterns:
Defining Our Users
My team and I recruited and filtered out our target audience through the means of screener surveys. As well as customary screener questions, we also questioned the participants current relationship with habit tracking apps which gave us a starting point for our interviews.
Survey results can be found here
Identifying and Prioritising Pain Points
We then moved onto more in-depth interviews to look at user behaviours and pain points.
We synthesised our findings using the process of affinity mapping.
After each interview, my team and I conducted a usability test with each participant.
Below, you can see some of the main issues encountered:
Define
Meet Eric!
In order to develop a more concentrated insight about the users, I created a user persona that were generated based on the prior the research we’d conducted.
We wanted a further insight into Eric’s specific pain points in context, we created an experience map in which we view Eric’s journey through a specific senario. Inspiration was drawn from experiences shared in user interviews.
Defining And Prioritising The Needs We Aim To Solve
To design a solution to these problems, we had to synthesize them in a way that would make it possible to implement them into the ideation phase of the project.
1. How might we make the process of choosing habits easier?
2. How might we make the process of setting reminders easier?
3. How might we provide users with a quick and simple way to find resources?
Develop
Step Into Our Design Studio
In the design studio, we ideated on possible solutions for our How Might We Statements. Under timed conditions, we each sketched out different ways in which our users needs could be met for each HMW statement. Once we had ideated on all 3 HMW statements, we uploaded or sketches to an online whiteboard and individually decided upon the features in which we each prefered through the means of a dot voting system.
Exploring Site Navigation
In order to delve into how Eric would interact with the features decided upon in the design studio, we prepared 3 user flows. These displayed the fixed for his pain points at different stages of his journey through the app.
After a fruitful design studio, we prioritised our core features using a MoSCoW analysis and devised a simple user flow to envision the smoothest navigation for the user and kickstart the wireframing process.
Deliver
We collated ideas we’d developed upon during the design studio and implemented them into wireframes, beginning at lofi, then onto midfi and lastly to hifi, testing with users at every stage in order to create the best product for Re:Mind’s audience. The changes we made can be seen below.
Left to right shows low to high fidelity wireframes. Iterate, iterate, iterate! After all, great design is the iteration of good design.
Feedback Loops
Each iteration of wireframes was based directly off feedback from usability testing. We made many minor tweaks to the design but the major pieces of feedback were:
#1
Problem:
Fix:
#2
Problem:
Fix:
Users cursors tended to go straight to the bottom right hand side of the screen when being asked to add reminder (button was at the top right)
Placed the button at the bottom right hand side of the screen which was more instinctive
Users cursors tended to go straight to the bottom right hand side of the screen when being asked to add reminder (button was at the top right)
Placed the button at the bottom right hand side of the screen which was more instinctive
#3
Problem:
Fix:
#4
Problem:
Fix:
Users weren’t particularly sure as to how to use the toggle function that was meant for turning habits on and off
Made it more apparent by replacing it with a simple swipe function which overtly explains to users that it allows for them to either delete or archive habits.
The means in which we used to filter articles was slightly too hidden away for the users
Replaced with a separate sub-categories page prior to the article selection page.
#5
Problem:
Fix:
Users were left feeling rather confused as to whether battery symbol on 'Sync Device' page was an indication of the battery life of their phone or their Re:Mind device.
We overlaid the the icon onto the image of the remind device and further away from where their phone’s battery life indication would be to avoid any confusion.
Final Prototype
User Flow 1: Eric sets a new reminder to ‘Breathe deeply’
User Flow 2: Eric syncs a reminder with his device to ‘call a friend’
User Flow 3: Eric searches for resources to combat lockdown induced-stress’
Meditations
This was an incredibly rewarding project, one that pushed me and my teammates to our creative and productive limits within a short time frame. As my first experience designing for a client, I learnt the sacred lessons of prioritising, compromising and most of all empathising — not just with the end-user but with the client too.
Thank you to Blessing & Max for all the hard work!
Since the project has ended, I’ve been working alongside the founders of Re:Mind to steer the UI towards being more of a jewellery brand, focusing mainly on the website. Below, you can see a few initial mock up’s I’ve made.
More updates to come..
