A data visualization-based self-management tool for youth with chronic pain

UD Thesis!.jpg

Conceptual model of the myWeekInSight system


Team Member (January - April 2021)

Project Lead (May 2021 - September 2022)



Adobe Illustrator, Adobe XD, React.js, Balsamiq, Procreate, Adobe Premiere Pro, Miro, PowerBI, Tableau

January 2021 - Present (16+ months)


Devarsh Bhonde, Rubia Guerra, Katra Farrah, Haomiao Zhang

Dr. Katelynn Boerner, Dr. Tim Oberlander, Dr. Karon MacLean, Dr. Tamara Munzner, Haley Foladare 


Data Visualization, User Interviews, Affinity Diagramming, Literature Review, User-Centered Design, Prototyping, Requirement Gathering, Persona Building


myWeekInSight is a self-management tool targeted toward youth with chronic pain, that attempts to use data visualization to help youth reflect on and manage their symptoms holistically. It uses a combination of daily surveys and data visualizations to represent youths' daily lived experiences.

myWeekInSight began as a course project at UBC, for CPSC 554K (Designing for People Project) in January 2021. However, at the end of the course, I decided to continue the project as my Masters thesis, co-supervised by Drs. Tim Oberlander and Karon MacLean. 

As a project team member, my role was conducting and analyzing user interviews, and co-creating the low and medium fidelity prototypes. As the project lead for my thesis, my work has included designing and conducting user studies for feedback, collaborating with health tech firm CareTeam for deployment of the visualizations on their platform, and evaluating the application through interviews with youth with chronic pain.

Can I skip to the Results? Sure, click here!

So, what was the problem?

Chronic pain is a common pediatric condition that affects multiple aspects of patients lives, including their mental, physical and social well-being. Symptoms of chronic pain are often varied and personalized to each individual, which makes designing effective treatment plans difficult. 


Existing methods for self-management of pain include mobile applications and wearables, but most of them do not integrate clinician input or have not been tested with the target user group of patients. There are also very few apps specifically for a younger audience, and within that more specifically for chronic pain.


To try to combat this, Dr. Tim Oberlander and Dr. Katelynn Boerner, clinicians at BC Children’s Hospital, Vancouver, developed an EMA (Ecological Momentary Assessment) approach to gather timestamped data about patients’ daily lived experiences. This comprises a survey administered thrice a day that gathers data about the user’s mental, physical, and social experiences through a series of quantitative and qualitative questions. However, the representation of this data in a teen-friendly, readable format, back to the users was a challenge. 

Who was our target demographic?

For the purposes of this project, we chose to focus on youth in the age range of 12-18 years old, preferably from the patient network of the Complex Pain Service clinic at BC Children’s Hospital. However, this method could be applied to youth suffering from chronic pain anywhere, with some personalization based on their circumstances.

What was our plan?

The project consisted of three main phases:
- Context gathering and initial exploration (as part of the course project)
- Visualization design and prototype evaluation
- Clinical deployment and application evaluation

Context gathering and initial exploration:

The EMA survey for this project comprises of ~15 questions - a mix of qualitative and quantitative - administered thrice a day. Over a period of one week, that generates ~315 data points. This data is stored and accessed in the form of a spreadsheet, for clinician reference. However, for patients, viewing this data in its raw form is close to meaningless. 


Given the highly individual aspect of chronic pain experience,  we decided to use data visualization and personalization to represent the data.


We began by interviewing the clinicians to gain subject matter insights into chronic pain and our target demographic. Our interviews were semi-structured, with more open-ended questions, allowing the clinicians to share broader thoughts they felt would be relevant for us. 


Based on our interviews with the clinicians, we created personas of the target patient, their caregiver and clinician:

Abigail Watson.png

Persona of a young chronic pain patient, Abigail

Emily Watson.png

Abigail's mom and primary caregiver, Emily


Persona of Abigail's clinician, Alice

The personas helped us ensure we kept all three perspectives in mind while designing the visualizations - the patient, the caregiver, and the clinician view. They also helped us understand the diverse user requirements and how we could best integrate them into our prototypes.

Low-fidelity prototype:

This was followed by an initial round of prototyping - some pen-and-paper low-fidelity sketching:


Low-fidelity prototypes: (from left to right) Showing sleep over one week, pain symptoms on a human silhouette, what the user is worried about

The full low-fidelity prototypes can be seen here:

These were based on different visualization concepts and ideas from existing commercial health tracking apps, using traditional graph forms as well as more creative icons and silhouettes. The visualization concepts focused on four different categories: physical pain, sleep, emotional health, and peer interactions. We got initial feedback on our low-fidelity prototypes from two proxy users, through semi-structured interviews and a UEQ-based survey for each of the visualizations. 


Overall, the participants mentioned they found simple charts like bars and lines easier to understand compared to a human silhouette form. They also felt the graphs overall were understandable, and a good representation of the survey data.

Medium Fidelity Prototype:

Based on the feedback from this round of interviews, we created refined medium-fidelity prototypes. We filled the EMA surveys for a period of two weeks ourselves, to gather sample data as well as develop insight as to what the EMA experience would be like for patients. We used this data to create the visualizations in PowerBI and Tableau.


Medium-fidelity prototypes: (above) in Tableau, showing the human silhouette chart, emotions through horizontal bars and the worries icon chart

(below) in PowerBI, showing the emotions through a ribbon chart, sleep through horizontal bars, worry though an area chart and sleep quality through a pie chart

We also created an application prototype integrating the visualizations:


Prototype of the application, showing (from left to right) the daily screen, detailed summary per day, weekly summary, sleep chart and emotion data

To review the medium-fidelity prototypes of the visualizations and app, we interviewed 5 proxy users, who were either young adults, or people with previous chronic pain experience. Participants found the visualizations useful, and would want to continue using such an application in their daily lives. This concluded the course project, post which I took up working on this project for my thesis.

Visualization design and prototype evaluation:

We delved deeper into the visualization design process by beginning with a Data and Task Abstraction process to ascertain which user tasks we wanted our visualizations to enable.

UD Thesis! (1).jpg

Data and Task Abstraction results showing our patient-centered tasks, prioritized, and tagged with clinical relevance

We then iteratively designed the visualizations, moving from low-fidelity hand-drawn sketches to medium-fidelity in Balsamiq, to high-fidelity mockups in React.js. Below, we show the final visualizations in React.js:

UD Thesis! (2).jpg

Visualizations showing sleep (top-left), physical symptoms (bottom left), emotions (top center), worries (bottom center), expectations and reality (top right), and social interactions (bottom right)

These visualizations use familiar encodings like bar and line charts, are colour-coded by category, and are vertically aligned in a weekly format, to allow for easy cross-comparisons. They were designed in collaboration with HCI and visualization experts, and took input from clinicians and patient partners, for a patient-centered engaging application. The vertically aligned version can be seen here:


We evaluated the design of these visualizations with 10 youth with chronic pain, through semi-structured interviews. Youth found the visualizations useful, although specific aspects were relevant to specific audiences. Some liked tracking their physical symptoms, whereas for others mental health and emotions were more important. Participants did note how there was a slight learning curve for the visualizations, but overall this was an application they could see themselves using in the long run. 

Clinical deployment and application evaluation:

We then collaborated with healthtech firm CareTeam, to implement our visualizations on their platform. The CareTeam deployed version of the visualizations can be seen here. In order to assess the long-term impact of the visualizations as an intervention, we ran a three-week long clinical study, where 50 youth with chronic pain used the survey+visualization application. Post the three weeks, we conducted semi-structured interviews with a subset of 10 youth, to gather detailed feedback on their experience, aspects they liked, and what we could improve.

These interviews were transcribed and qualitatively analyzed through affinity diagramming between 2 researchers. We saw 4 broad themes emerge, namely Potential Utility, Visualization Design, Continued Use and Personalization of the application. We show the affinity diagram below:


Potential Utility: Youth mentioned how looking and reflecting on their data encouraged them to change aspects of their daily lives. For some, the visualizations showed insights they otherwise would have missed. For many, the visualizations were useful in understanding their pain.

Visualization Design: Different visualizations were relevant to different people. For some, symptoms and sleep were the most important aspects to track, whereas for others mental health and emotions were more important. Participants were also able to cross-compare and relate aspects of their lives, for instance noticing the impact of sleep on pain or vice-versa. Overall, the majority of the youth interviewed agreed that the visualizations were an accurate representation of their experiences.

Continued Use: The majority of our participants agreed they would want to continue using the application on a daily basis, but with some changes to the survey questions and frequency to make it more relevant for them. They also mentioned how the amount of time spent was appropriate and spoke of different data-sharing strategies - some mentioned wanting to share it with their clinicians whereas others said they preferred private self-reflection.

Personalization: Youth mentioned survey preferences they would have liked, as well as additional survey questions and features we could add. For instance, one participant mentioned wanting to track diet and physical activity, another mentioned tracking their menstrual cycle. There were many such instances of personal preferences that indicate the need for personalization of the application.

How did that turn out?

We were able to broadly assess the impact of these visualizations as an intervention through the clinical study. In the future, we would like to do a larger and longer study with an improved version of the application, taking into account hte feedack we recieved through the studies.

Our demo video below explains this project upto the clinical deployment:


Who else knows?

We presented our project at the Designing for People Showcase 2021, and the video can found here

A later version of the project was presented at the International Symposium for Pediatric Pain 2022, as well as the Designing for People Showcase 2022 (where it won Best Demo)!. The video presentation for that can be found below:

A clinical publication for the feasibility study has been published by our clinical collaborators, and can be found here.

The entire project has also been documented in my thesis.

Challenges we faced

Challenges in industry-research collaborations: Our partnership with CareTeam for a real-world deployment of our visualizations showcased the challenges that arise in industry-research collaborations, which are often the reason why many research projects do not get deployed in the real world. Industry timelines are often too slow and rigid to accommodate iterative research design, which meant our research team at UBC needed to adjust our timelines and scope. Working with an already existing platform also meant additional testing and compromises on features that couldn't be implemented in time. However, this partnership was crucial in deploying the application in a manner that could be integrated into our target users' daily lives to assess long-term impact, thus showing the importance of such collaborations, even if they may be challenging.

Evaluating with restricted populations: This project involved accessing a population that was vulnerable in two ways - first, they were minors, thus requiring additional care and consent during evaluations, and second, they were pain patients, requiring additional ethical considerations. Such populations are often not easy to access, and our access was guided heavily by our clinical collaborators. Most design projects involving vulnerable populations are often not evaluated due to these very reasons - a lack of clinical access, and a short timeline that cannot accommodate additional ethical considerations. However, getting feedback from the target demographic is crucial for an accurate assessment of the design, in our case, of the visualizations as an intervention, so this highlighted the need for inter-disciplinary collaborations in such design projects.

What did we learn?

Overall, this project consisted of visualization design from a youth-centered perspective, validated through a clinical feasibility study. We completed this project in several phases, and apart from the learnings discussed above, our main takeaways were:

Designing from a youth-centered perspective: Through our visualization design process and interactions with youth during evaluations, we were able to highlight unique constraints in designing from a youth-centered perspective. Factors like graph literacy and the adolescent context, which are not applicable when designing for more general audiences, play pivotal roles here. Our designs thus had to be carefully thought out and evaluated.

The uniqueness of personal data: Our interactions with youth highlighted the diversity in their experiences - from varying lifestyles, to different physical symptoms and clinical experiences, different graph literacies to varying opinions on which charts they liked the most - each participant in our interviews had strong, unique opinions. This highlights the difficulty in creating a general application that can work for everyone, and the potential for smaller customizations that can help each user refine the application to make it more relevant to their life.

What’s gonna happen next?

We're keen to share this research with others in the field, particularly those working at similar intersections of healthcare and design.

An industry-research partnership focused publication is under review, and a visualization design paper is currently in progress! Stay tuned!

Ok, now let’s talk about