This was a collaborative project designed for the Introduction to User Experience, User
Interface and Interaction Design module at Maynooth University
The brief was to design a Mood Diary application for both patient and clinician. The patient side
design is for mobile devices and the clinician for desktop.
Our class (eleven students) had both individual and group tasks that were shared and discussed on each
meeting in order to everyone to collaborate and give suggestions on the iterative design. We usually
had pools with voting to decided on which solution to choose.
Different tools were used to design the project, such as Miro, Figma, Balsamiq, Xtensio, and
Illustrator.
The patient app proposal is an app that will be developed for users to track their mood daily, or even hourly in a simple and easy way and be able to keep track of what is affecting their mood either in a positive or negative way through statistics generated with the patient inputs.
The first step was understanding and empathizing with users in order to identify their needs and struggles. For that, research on the user profile was conducted and two key personas profiles were created:
Patient profile - Persona 1.
Patient profile - Persona 2
Homepage with calendar with feature for daily and hourly input of mood.
After selecting a date, the user sees the screen for mood input, then:
1) User chose a Mood scale from 1-10 ( 1 being the worst mood, 10 the best)
2) Describe what are you feeling:
3) Any thoughts in your mind?
4) Describe any physical symptoms:
5) What activity were you doing?
On the Statistics section, the user can select a specific period of time and click on the days below the charts graphics for more information.
Page with extra features: Alarm reminders - Settings - About - FAQs
After concluding this stage, the entire class gave feedback on each others' wireframes. Two
main improvements were pointed by my colleagues: One was the use of a plus (+) symbol for the extra
features page. This lead them to confusion thinking this was a button to create a new input. The solution
could be replacing the icon by a three dots one.
Another issue discussed was the use of colour to represent the feelings and its swifts. As colours can be
synonym of performance and red being associated to negativity it could be a big issue for a patient coping
with mental stress. This problem could be solved with an alternative method, like a word cloud, to measure
how often and which feelings are constant.
Using Miro, everyone collaborated to identify the different possible scenarios users encounter using the app and the results of its actions.
Following the same process of empathizing and identifying users and their needs, this time a profile were developed for the Clinician persona.
A low-fidelity interactive wireframe was designed using Balsamiq. Taking in considearation that the clinician would use this application on their office, the layout was devloped for desktop. The elements were arranged to make the most of the wide screen area. The features were chosen after thorough user scenario analisis.
With extensive interface design best practices research, the homepage was designed using calming colours that are often related to healthcare: blue and green .
The last step was to do a Cognitive Walkthrough with different possible scenarios to test the usability of the clincian app.