Tong Lo
← Home
AI for Wellbeing
2024
Timeline: 5 months
Role: UX Designer/ Researcher
Team: Designer, Developer, Creative Technologist
-> UI/UX Design
-> Product strategy
-> Image recognition
Timeline: 5 months
Role: UX Designer/ Researcher
Team: Designer, Developer, Creative Technologist
-> UI/UX Design
-> Product strategy
-> Image recognition
How AI can help visualise employees’ risk of back pain in the workplace - The goal was to transform subtle, often invisible behaviours into actionable insights.
The brief
Back pain can appear without any warning, and the causes are often subtle and happen over an extended period. The challenge was: How might we visualise these intangible behaviours and contextualise the factors that may contribute to back pain, so prevention becomes actionable?

Overview
This project showcases a web app design I did at the Royal College of Art, Helen Hamlyn centre for design.
The platform caters to two main moments in a user’s experience
1. Preventive check-ins: For when users are not experiencing pain, who needs quick, glanceable suggestions to maintain healthy habits.
2. Active engagement: For when users are experiencing pain, who need deeper insights to help identify potential contributing factors.
-> see AI X Design Lab for a detailed research study of back pain at work.
The platform caters to two main moments in a user’s experience
1. Preventive check-ins: For when users are not experiencing pain, who needs quick, glanceable suggestions to maintain healthy habits.
2. Active engagement: For when users are experiencing pain, who need deeper insights to help identify potential contributing factors.
-> see AI X Design Lab for a detailed research study of back pain at work.
Delivering flexible health insights
The dashboard adapts to two types of users’ needs:
-
‘Everywhere’: A concise summary screen for quick understanding.
-
‘Specific places’: A comprehensive analytics page showing correlations between workplace factors and back pain for in-depth information.
From research, we learnt that people are in different phases of their back health journey. In most cases, pain is the biggest trigger prompting people to be more engaged with healthy work habits. Pre-back pain, there is less intuition to actively engage in changing habits or tracking health data. During back pain, often people don’t know what might have been the causes - because pain accumulates and develops over time. The paradox is - to have any meaningful insights in the moment of pain, we need consistent data before pain occurs.
This is why the ‘Everywhere’ and ‘Specific places’ structure supports both ongoing awareness Pre-back pain, and in-depth investigation for During back pain. Users can switch between these two modes depending on their immediate needs.

User flow and wireframe ↓


Visualising data
From research, we concluded that the biggest contributors to back pain at the workplace are Posture, Movement, Environment, and (psychological) Stress. These factors do not influence back pain in isolation, so the challenge was to design an experience that reflects how factors causing back pain interact in real life. For example,
- Psychological stress can lead to unconscious slouching
- A restrictive work environment can limit movement
- Limited movement can negatively impact posture
The two requirements for this visualisation is to achieve the following:
- Communicating the four factors
- Communicating how much each factor contributes to one’s back pain
- Communicating the interdependence between these factors.
I landed on the colour-coded Venn diagram for two reasons:
-
Venn diagrams are commonly understood as a way to represent relationships between categories. This familiarity means people can quickly interpret the the four factors, reducing cognitive load.
-
Overlapping areas communicate interdependence, helping users explore combined factors contributing to pain.
Web UI ↓



Capturing data
(1) Data capture
The web app is designed to remain open throughout the workday, while the user’s laptop camera captures image data in the background. This interation is designed to be minimal and automatic.
From user research, we learnt that people are willing to have their data captured, but prefer a ‘apple watch-like’ experience, where data input is automatic and ambient.
During first-time registration, users are guided through a short onboarding flow to enable camera and calendar access. Users can check their dashboard at any time to view insights.
The interaction has been tested through an earlier data collection exercise -> See Data Collection Tool .
(2) Processing and insight
Collected data is anonymised and locally translated into posture, movement, environment and stress data with an Image recognition script. The output are scored, and translated into both visual (Venn diagram and graphical analytics) and text-based insights.
There are two ways text-based insights are presented in the app:
The web app is designed to remain open throughout the workday, while the user’s laptop camera captures image data in the background. This interation is designed to be minimal and automatic.
From user research, we learnt that people are willing to have their data captured, but prefer a ‘apple watch-like’ experience, where data input is automatic and ambient.
During first-time registration, users are guided through a short onboarding flow to enable camera and calendar access. Users can check their dashboard at any time to view insights.
The interaction has been tested through an earlier data collection exercise -> See Data Collection Tool .
(2) Processing and insight
Collected data is anonymised and locally translated into posture, movement, environment and stress data with an Image recognition script. The output are scored, and translated into both visual (Venn diagram and graphical analytics) and text-based insights.
There are two ways text-based insights are presented in the app:
- Summary of Insights
Short, clear sentences with highlighted keywords matching visualisation colours. This view is designed to be general and glanceable.
- Detailed Insights
A deeper analytical view combining graphs and text. Insights are structured around individual factors (e.g. Stress) and their overlaps (e.g. Stress + Posture). This view is designed for moments of pain, when users want to understand potential causes.

Data collection and processing flow ↓

Mobile: Insights on-the-go
The mobile version complements the web platform by providing accessible, glanceable summaries. Unlike the web app, it doesn’t capture new data. Because this is a work-specific app, data collection should occur only during work hours, and using the mobile devices would be too intrusive.
Instead, this version focuses on convenience for users who want insights while away from their desks. Having two ways for people to check in increases the opportunity for users to actively engage with their health.

Mobile version UI ↓

