Felicity is an iOS app that brings guided relaxations in the form of Autogenic training to the smartphone.

Apart from the client, the team consisted of an iOS developer and me, the product designer. The client wanted to see whether an app might be helpful for her patients and act as a complementary tool to onsite sessions.

 
 

Research

 

For the primary and secondary research, we had access to end-users already familiar with Autogenic training. With the client also running Autogenic training sessions, we also had the required expert knowledge.

Since patients and end-users of the app can also face severe mental health conditions, every product decision needed to be made with that in mind.

 
 

We had regular calls to go through the questions around mental health benefits, the patients, the way Autogenic training helps, the most common issues patients face when starting with Autogenic training, etc.

In addition to that, we had a Trello board where I have posted new questions daily. The client provided answers to all of them. With that, I was able to get the required information about the problem the product should solve.

 
 

One exception I've made in the design process is to let the client talk about what she imagines a good solution should be. Usually, it's not advisable to focus on solutions during the research phase. In this case, however, since there wasn't much time available and the industry foreign to me, it helped clarify some of the client's mental models when thinking about the product.

 
 
Competition Research@2x.png

Reviewing competing products to get insights into how the sessions work, what kind of settings are available to people, and in general to get an experience of what an Autogenic session is all about.

 
 

We had a design direction in mind based on the primary and secondary research, user behavior and demographics, and client expectations. The product will have a focused feature set. Extensive testing is required to prevent any harmful consequences of using the product. In that sense, we didn't only decide on the design direction. We also established a design process.

 

Explorations

 

Working on my previous work on behavior change design products (for example, at Welltok Inc.), I had concerns about people moving from trying out the product to using it. Using an app is fundamentally different than having to go to an onsite appointment. It's much harder to form a habit of using the product without external commitments.

When starting with Autogenic training, the patients have a clear expectation of improving their wellbeing. We began to explore potential ways to implement that expectation into the product by using a path metaphor.

 
 

We had discussions on using the barefoot analogy. Walking barefoot is like unveiling the curtain from who you are. It's similar to being naked, but without the anxieties resulting in that.

It felt like a good direction, but we decided not to move ahead with it in the end due to implementation requirements and the time available.

 
 

I was aware that being constrained by time and resources, most suggested solutions to increase the probability of a person building a habit to use the product won't make it to the released version.

I've experimented with some concepts anyway. One such thing has been to, when suitable, show a call to action to measure your heart rate with the Apple Watch. Measuring the heart rate before and after a session would, in the best-case scenario, show the person that the heart rate is lower and visualize the short-term effect of a single session. That might induce the person's crucial rewarding feeling and help build a habit of using the product.

 
 

Another approach considered scheduling a fixed weekly or daily time slot to complete the sessions into the persons' calendar.

That accomplishes two things. First, the person needs to consider a time slot when a session can be completed. It requires the person to make an intentional decision. Secondly, it increases visibility. People often use calendars to view upcoming appointments and, with that, also notice the timeslot for the session.

 
 

Since the duration of sessions varies between around 10-30 minutes, the app could recommend shorter sessions during the commute or in the office and longer sessions while at home.

It reduces friction to start using the app by adjusting the sessions to the current environment of the person.

 
 

During the research, it became clear that dealing with mental health issues isn't affecting only the particular person. It also affects loved ones.

Both the person struggling with mental health and their loved ones want to improve the issues. Consequently, we were thinking about the ability of the loved ones to create some encouraging messages that would then, on some occasions, be displayed on app launches.

 
 

After a session, the person is asked for feedback. The question depends on the session. The purpose of it is educational. The question indicates what area a session can influence. In case a person reacts positively, the feedback also acts as a confirmation of the session having the required short-term effect.

 

Interaction Design

 

The pulling down of the UI component to start a session is a metaphor based on long-haul air travel. You are pulling down the window share to get better sleep, to have a sense of control of your environment.

 
 
Progress Indicator@2x.png

A vertical indicator visualizes the progress of the session. Once the top layer of the progress indicator fills the screen, the person completed the session.

 
 
Interaction with Checkbox@2x.png

One issue exposed by usability testing with one of the TestFlight builds has been using an icon similar to a checkbox. Despite the area where the person can tap to make the selection extending across the screen, using the checkbox made people unnecessary target the icon. It's a design issue, but we agreed on moving with it anyway.

 
 

We were able to integrate some micro-interactions within the product. That includes an animated transition between sessions when the person swipes horizontally.

Notice that the animation of the down arrow, affording the person to start a session, finishes the last and with that getting the needed attention.

 

Visual Design

 

The UI elements are placed on the screen to follow the hardware design with tall and narrow smartphones.

 
 

Each screen has a clear focal point, whether this is a setting or the screen when a session is in progress. We removed anything from each particular screen that is unnecessary for the specific task the person is on.

 
 

Deciding on the color for each of the available sessions has been difficult. There's plenty of research on the influence colors have on us, and while the color scheme we went with is ok, there are still many open questions.

 
 

While each session has its color, we haven't used more than two colors on each screen. There is less going on when a person looks at a screen. Less clutter also means less strain on a person when figuring out how to accomplish a specific task.

The same goes for the font library. The fonts vary in size, but just enough in font weight to create a hierarchy.