UX & UI design project for Airofit

UX & UI design project for Airofit

 
 
Airofit_main.png
 
 

AIROFIT IS A DANISH startup THAT HAS RECENTLY LAUNCHED THEIR BREATHING TRAINING DEVICE TO THE MARKET. IT WAS OBSERVED THAT THE SYSTEM STRUGGLES TO KEEP THE USERS ENGAGED FOR A LONGER PERIOD OF TIME. MY MAIN TASK WAS TO FIND REASONS THAT COUSE USERS TO DISENGAGE AND PROPOSE CHANGES IN UX AND UI THAT WOULD FIX THOSE ISSUES.

 
I approached the topic by research pervious academic work that focuses on user experience and engagement.

I approached the topic by research pervious academic work that focuses on user experience and engagement.

Part of the interview structure that was created based on the research.

Part of the interview structure that was created based on the research.

I approached the topic by research previous academic work that focuses on user experience and engagement.

Part of the interview structure that was created based on the research.

As the task had mainly to do with user engagement, I initially approached it by researching academic papers measuring user experience and engagement methods. I have stumbled upon the work of two researchers - O’Brien and Toms. Their engagement framework was also used in my bachelor thesis, so I proceeded with their analyses. My focus was mainly on the disengagement stage in the overall framework. This one seemed to cause issues with the usage of Airofit over time. Inside the actual engagement, I researched 2 attributes that build it: perceived usability and aesthetics.

From my research analysis and talks with employees at the company, I was able to formulate the questions that were later asked during the interviews with the clients.

 
 
 

The data analysis has shown what users want and need and what has to be changed to keep them engaged. Implementation of several new features and designs started. It was decided that the focus has to be put on a better activity and user data analysis presentation. Users also did not feel engaged because the was a lack of direction, guidance and goal when training with the app.

I introduced some solutions to these problems. Moreover, I started re-designing different parts of the UI as they needed to be updated for several reasons:

  • Easing the navigation.

  • Modernising the design.

  • Including more relevant information for the user while keeping the interface clean and organised at the same time.

The Home page, Activity tab, Session screen and other smaller things were re-designed. As always I started with sketching on the paper. Throughout many review and feedback sessions, I did wireframe designs and then full designs. For each app screen that I had to re-design, I have created numerous design alternatives and re-designs.

Design alternatives for the home page.

Design alternatives for the home page.

 
Different designs for the lung test pop-up.

Different designs for the lung test pop-up.

 
New design propositions of the in-app navigation bar.

New design propositions of the in-app navigation bar.

Alternative designs for the activity and user data tab.

Alternative designs for the activity and user data tab.

 
Sketches and ideas that were later translated into changes on the home page.

Sketches and ideas that were later translated into changes on the home page.

 
Airofit website that I was working on UX-wise with applied changes.

Airofit website that I was working on UX-wise with applied changes.

Besides the main UX task, I was working on some small side-projects during my time at Airofit. One of them was to re-think and re-design the landing page of the company’s website. The focus here was on how users perceive the information presented to him and how the different home page elements affect them. Furthermore, I developed small 2D icon animations to visually present its value propositions on the home page. The animations can be viewed in the “Designs” section on the home page.