For my university's introductory Human-Computer Interaction course, I conceptualised and designed a mental health tracking mobile application called Psych in a team of four students. All the team members were assigned the role of UI and UX designers.

We chose the theme 'Mental Health' because not only is it an important contemporary issue which requires urgent attention from all communities, but also because insufficient study and background research goes into designing and developing mental health applications, which renders them inefficient and unsuitable for users.

Since this project was designed for a HCI course, the focus was on learning HCI processes instead of working towards a business challenge. The project was carried out in three iterations.

The first iteration focused on the contextual enquiry, laying out a conceptual design, generating paper prototypes and carrying out initial evaluations on the product.

The second iteration focused on the UX of the product, developing a medium-fidelity prototype from the paper prototype, and carrying out rigorous empirical evaluations on the same. The third iteration consisted of developing a high fidelity prototype and improving the application from the previous two iterations.

The overall design process of this project is derived from the Interaction Design Lifecycle Model which consists of four primary steps and can be summarised as follows: Establishing Requirements, Design, Prototype and Evaluation. The first step, Establishing User Needs and Requirements, aimed to create an initial set of requirements for the product. To acquire convincible data for our initial interaction design, the team conducted varied activities such as interviews, online surveys, observations and researching similar products. I was responsible for the online survey and for product research.

The data received was split into two categories: quantitative and qualitative. Quantitative data included results from sources such as surveys and TAM questionnaires, whereas qualitative data included affinity diagrams on the basis of the survey results. I made three User Personas on the basis of this initial data collection. The personas in turn were used to generate Interaction Scenarios by my team members.

A user flow is a series of steps that lays out all of the possible decisions that the user can make while interacting with the system. Drawing a user flow diagram aided visualisation of the entire system and helped the team identify pain points which were to be improved in subsequent iterations.

All the features designed by the team have been discussed below. Things of significance, such as interface metaphors, affordances and UX considerations have also been discussed along with each feature. The prototype was designed in Adobe XD. Please note the length of some screens are longer than others due to scrollability, and hence the appropriately fit them into the screen, their size have been decreased which has rendered them thinner in comparison to the non-scrollable screens.

Once logged in, the user is taken to the dashboard which presents various features to the user in a card-based layout. Card-based metaphors have been popularly used in modern applications, and also are intuitive, minimalist, neat and mobile-responsive.

Each card displays a separate feature, which link to subpages within the application. The top-most card is reserved for the Self-Care Tracker; the Journal, Therapy and Meditation features are provided underneath as separate cards.

The user starts out on a Login Screen which asks for a Username and Password. If the user does not have an account yet, a sign-up option is provided at the bottom of the screen. Clicking the text takes the user to the sign-up screen, where they can enter their name, email, username and password which will be used to log in. Once logged in, the user is taken to the main dashboard of the application.

The self-care tracker is the one of the first features that the user notices on the dashboard. It displays a simple graph of data points plotted against days of the week vs. numbers on a scale of 1-7, which are the ratings for three things: Mood, Diet, and Sleep, one being the lowest rating and seven being the highest rating. The settings can be altered to view the data for a day, a week and a month.

Upon clicking the journal card, the user is taken to the main screen of the journaling interface.

The most important step of the iterative design process is the evaluation of prototypes and how the user interacts with the conceptual models which have been developed. Observing these interactions allows for the design team to understand where the conceptual model falls short in terms of the implementation. My responsibilities included conducting surveys, interviews and time-on-task testing, along with helping my team members with quantitative user testing using TAM and SUS testing.

For the first iteration, the team tested the paper prototype with the help of Technology Acceptance Model (TAM). To test the paper prototype, the team went out and got interviewees to act out a scenario where the application is implemented to be used and observed. The interviewee was then questioned using the TAM process, and results recorded.

TAM questions were put to the interviewees after they had used the application and given their feedback. These questions are designed to give definitive (yes or no) feedback using a 1- 4 system.

Once the medium-fidelity prototype was developed in the second iteration, the team conducted a System Usability Scale (SUS).

The System Usability Scale (SUS) is a reliable tool for usability measuring, that basically contains 10 questions with 5 options, from strongly disagree to strongly agree. It is used to evaluate perceptions of usability for various products, services and come up reliable results.

However, for people who do not use technical devices much, there is still a difficulty to adapt the interface, which leads to a long time taken as a result. Furthermore, some descriptions, such as mindfulness and therapeutic, are slightly unnecessarily complex.

A Time on Task evaluation was also conducted during the second iteration.

The time on task evaluation is used to identify usability problems within a user interface. This evaluation measures three events:

The interviewees were given the medium fidelity prototype on a laptop along with the scenario to act out with the end goal of completing the task as quickly as possible. Their scenario was timed, and any errors that were made were recorded at the time they happened along with a brief description of what happened.

The results were then plotted in the form of a Box and Whiskers Plot.

The third iteration consisted of a heuristic evaluation, qualitative surveys and interview testing with users.

The self-care tracker is the one of the first features that the user notices on the dashboard. It displays a simple graph of data points plotted against days of the week vs. numbers on a scale of 1-7, which are the ratings for three things: Mood, Diet, and Sleep, one being the lowest rating and seven being the highest rating. The settings can be altered to view the data for a day, a week and a month.

Upon clicking the ‘Add Activity’ button, a pop-up is shown which blurs the current background. This pop-up displays an interface for bars that be toggled to change the values for the Mood, Diet and Sleep metrics. A help button, acting as another design affordance, has also been added to the interface to succinctly provide quick information about how to the use the interface and what the number scale means. At this stage of the prototype however, it has not been implemented.

Once all the values are added, the user could click on the ‘Add Activity’ button, and the three data points would be reflected in the graph. The purpose of the self-care tracker is to provide the user with a general trend of three things that account for mental health the most: Mood, Diet and Sleep. These are quantified into a visualisation which can be quickly glanced at by the user, thus providing them with condensed information over time.