Gabriel Martini
UX designer
Made with

Motionr

Case Study: Improving mental wellness in office workers

Project Overview

Context:

We believe that the future of sustainable design lies in an approach that puts the health and wellbeing of individuals and ultimately, society, at its heart. The subject of wellbeing in the built environment is something we have been increasingly focused on. We spend around 90% of our lives in buildings and these environments significantly impact our health and wellbeing, and ultimately our productivity. 
As designers we are ultimately driven by a desire to improve the quality of the environment - with design as a catalyst to improve human interaction and experience. 
There’s also a financial impact to wellbeing: For companies there’s a real financial and people benefit. Ninety percent of a company’s operating costs go on staff, so if we can improve staff performance by improving staff wellbeing, even by a small amount we can improve a company’s fortunes significantly.

The problem:

Guided by the above assumptions we were tasked to help design and deliver a solution that would help residents of a building improve their health and wellbeing. After a long discovery phase and narrowing findings we discovered that a lot of our users had similar pain-points with regards to comfortability in their current office spaces. There was a huge issue surrounding environmental problems like temperature and noise levels and no way of streamlining these complaints and to quickly put change in action.

The Idea: 

In comes Motionr: An App for improving the work environment through the creation of motions (polls). It allows people to be on board or to quickly voice their opinion on:


  • Motions regarding physical changes at the office like light, temperature, noise.

  • Motions for more complex changes getting people on board for equipment changes

  • Quickly organising informal work events like birthdays, drinks, outings.

It aims at creating a more enjoyable environment for everyone as well as giving a sense of community feeling at work. 

My role:

It involved User Research, User Experience, Visual Design, Interaction design.
 In the initial stages of the project I worked as part of a team of UX designers to help understand our users, their pains and their needs. I conducted user interview alongside my team, created empathy and affinity maps, created personas and helped prioritise our top problems. We did brainstorming sessions to generate multiple solutions and once we had our top solution, each UX designers (Including myself) went on to develop their own separate version of the solution. From there I created everything from paper wireframes to high fidelity digital prototypes, all the visual styling and conducted user test on a segment of the user journey.


The Tools:

Sketch for wireframing, Invision and Invision Studio for prototyping and micro-animations. After Effects for some complex micro animations. Google Docs for collaborative writing and a lot of post its and pager (a lot.)

The Approach:

Motionr

From the start of the project we decided to opt for a structured approach to product design, thus adopting a sprint framework. This helped us break down each step of the process into digestible and workable bits, giving us a clear vision of the project goals upfront. This improved our efficiency, made us capable of solving complex problems very fast, and allowed us to achieve a usable prototype in a very short amount of time. 

Understand
Motionr

User Interviews

This phase was all about empathising and understanding who our users where. We needed to understand them and their pain points in order to discover what they needed. So we narrowed down our target audience by doing secondary (indirect) research online, and then agreed on which type of primary form of research we would be conducting.


Because this was a discovery phase we were in need of users opinions, so we decided to go with qualitative research as opposed to quantitative data. We conducted 1 hour face to face interviews with 12 users that fitted our target demographic helping us gain insight into their attitudes and relationship with wellbeing.
We then conducted 6 more 10-15 minute guerrilla style interviews by staking out a Costa and offering willing participants a cup of coffee in exchange for their time.

We divided the interview into two stages. The first stage was aimed at helping us fill in demographical and psychographical gaps. It was mostly about the person’s day to day activities and served to warm up the user. The second half was drilling into the user’s personal relationship with health and wellbeing, inside and outside the workplace. The questions were purposely neutral and vague as to not lead the users into a desired answer. 

Motionr

Empathy Maps, Affinity diagrams and findings

All interview notes where collated into individual empathy maps for each of the users that were interviewed. This helped us better digest all the information that was extracted from these sessions. The amount of insight was overwhelming so we used an affinity diagram to help us synthesis and find common themes in the answers. We started to see patterns in most participants

Key findings included the following pain points:

  • Temperature in the office was too warm or too cold 
    (12 of 18 users)

  • Not having the correct equipment to do their job
    (10 of 18)
  • Environmental noise, including music and voices
    (14 of 18)
  • 
Lack of motivation to improve because of environment
    (10 of 18)
  • Office space is uninspiring or lacked featured
    (15 of 18)
  • Troubles socialising at work
    (9 of 18)

Motionr

Creation of Personas

Based on the interviews, and with help of the empathy and affinity maps, we created two personas: Kate and Martin.
During one of our ideation workshops we understood that our empathy maps already gave us information on user goals, pain points and health habits so the personas where very easy to develop once we started grouping our individual empathy maps.

These two personas mark the distinct separation between immediate physical changes in the building like light and temperature, and long and more complex ones like the lack of tools and equipment.

Diverge and Decide
Motionr

Creative Stimulus Workshops

During the Diverge Phase of the project we believed that unique ideas come from new perspective and new connections. Thus we used creative stimulus workshops to help us approach the problem with outside-the-box thinking. The exercised done where aimed at helping us find alternative ways of describing the problem and then finding other areas and environments where similar issues where seen. We had 3 different creative workshops and from there we ended up with a multitude of ideas and themes we could explore. 

One of the storyboards made by me

One of the storyboards made by me

Idea selection and storyboarding

The Decide Phase was more about converging all the ideas and grounding them closer to our problem. We had a final workshop where we reviewed all of the ideas generated from the creative exercises. We adapted and combined them, and ended up with 2 distinct concepts:

  • Concept 1 aimed at solving the issue through a a peer-to-peer recognition app for increasing employee happiness and motivation by creating a platform for giving and receiving validation from/to peers.
  • Concept 2 aimed at solving the issue through an app for voicing and voting on short or longterm changes in the workspace.

After reflecting on both concept the team decided to pursue the second concept. We ended this phase by storyboarding different ways on how the selected concept would work in the office space. 

Prototype
Motionr

Sketches

I usually start my design process with very low fidelity paper wireframes This is the way I iterate through many design options quickly.

Sketching helped me generate  and explore different ideas and allowed me to later create fast paper prototypes that i then use to test my own assumptions without having to spend time building digital prototypes. 

Motionr

Wireframes & Prototyping

I then created digital wireframes from the paper sketches, from rough low fidelity ones where I was still playing around with the elements, to more hi-fidelity ones as the design progressed and usability mistakes were corrected.

The achieved design revolved around a main screen that serves as a hub for the creation of different types of motions.

Designs where made in sketch and the design principle was based in simplicity, and aimed at at modern and look with highlights of colour.

After testing 3 different colours with four (4) users, the coral colours to be preferred by users. They said it “looked less boring” and was “more eye-catching”.

Validate
Motionr

Usability Testing

I used usability testing to observe how well participants were able to complete the main task of the app, which is the creation of a motion. I acted as facilitator in all 4 interviews. 1 was done remotely via Skype and the remaining 3 were face-to-face. 

All issues encountered in each session were documented and rated using a 4 level usability rating system (positive, low, medium & high). The objective of this is to clearly understand the magnitude of the issues encounter.

You can read on the right the result of one of these interviews. 

Iterate

Next steps

Next steps will be to go back and amend the wireframes with the issues highlighted in testing and then go through several more rounds of testing. As testing continues, additional insights will surface and I will then continue iterating. I will need to the go through testing of other parts of the app in order to fully address all usability issues. Personally I would like to explore the social aspect in this project a bit more, and maybe create room for people to interact more inside this app.

Learnings

Creating the first outlines of a wellness app was interesting, and taking the project from research to testing helped me get experience in areas of product design I hadn’t explore much before. All the insights gain through interviews, maps and workshops really helped me handle the issues encountered during wire-framing. In the future i would probably spend more time consolidating and planning out the MVP as to eliminate any additional features that would have been great to have but would not be necessary for a first version of the product. 
Motionr