top of page


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


Proposed app design, showing daily, detailed, weekly views from left to right, with detailed chart for Sleep data on the extreme right


Team Member (January - April 2021)

Project Lead (May 2021 - March 2023)


January 2021 - March 2023 (27 months)


Devarsh Bhonde, Rubia Guerra, Katra Farrah, Haomiao Zhang

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


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


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


myWeekInSight is a self-management web application for youth with chronic pain, that uses 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.

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 Masters thesis), my work included designing and evaluating the high-fidelity visualization prototypes, 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 and costly condition, with personalized and varied symptoms affecting each patient. Especially in youth, this is further exacerbated by additional factors like learning to navigate through social dynamics, school, and emotion regulation. This makes designing treatment plans for them complicated and hard to evaluate.

Clinicians also rely on patient records or accounts of their experiences to treat them, which can be biased, or altered due to time passed since the event. Lack of accurate records and tracking methods thus further complicates treatment.


We hypothesized that engaging youth in self-reflection of their collected personal health data would enable them to self-manage their symptoms, creating accurate records as well as reducing their dependency on clinical care.

Who was our target demographic?

This project focused on young chronic pain patients aged 12-18 years old, preferably from the patient network of the Complex Pain Service clinic at BC Children’s Hospital (due to access through our clinical collaborators). However, this method can be applied to youth suffering from chronic pain anywhere, with some personalization based on their circumstances.

What was our plan?

The project consisted of five main phases shown in our process diagram below:
- Data and Task Abstraction

- Visualization Design

- Design Evaluation
- CareTeam Implementation

- Impact Evaluation

Process diagram showing the five stages of development of the myWeekInSight application

Data and Task Abstraction:


We began by interviewing our clinician collaborators (Drs. Tim Oberlander and Katelynn Boerner) to gain 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. 

Clinicians highlighted the need for:

  • Accurately recording the patient's lived experiences

  • Storing the data securely and confidentially

  • Reflecting the data back to the patient in an easily understandable format

  • Enabling the patients to draw insights from their own data


Based on our interviews, we created personas of the target patient, their caregiver and clinician (click to zoom in):

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

We scoped down to focus on the user's persona as they would be the main users of our application. 

The main goals for this persona would be understanding how their pain impacted other aspects of their life, like their sleep, mental health, emotions and social interactions. They would also want something that would be minimally invasive in their daily routine, and would allow them to share their information whenever and however they wanted. 

Data Abstraction:

We would be collecting data in 6 categories (which we termed Facets) from the users 3x a day through surveys. Below, we show the Facets on the left and the data collected for each of them on the right. This helped us see the types of data we had to visualize and how we could group them.

Diagrams - Frame 21.jpg

Facets on the left, data collected for them on the right

Task Abstraction:

We then generated an exhaustive list of tasks that users would aim to perform, and sorted them into three main categories:

1. Discovering insights within a Facet, e.g. Discovering what worried them the most

2. Comparing attributes across Facets, e.g. Correlating their sleep and the intensity of their symptoms

3. Progression over time in a Facet, e.g. Sleep pattern over time

Below we show the complete list of tasks, sorted into the categories, with clinically-important tasks tagged in blue.

Diagrams (1).jpg

Task Abstraction showing the three categories and types of tasks in each of them

Visualization Design, Design Evaluation & CareTeam Implementation:

Once we had completed the data and task abstraction, we began designing the visualizations iteratively, moving from low-fidelity hand-drawn sketches to medium-fidelity in Balsamiq, to high-fidelity mockups in React.js, and finally implementing them on the CareTeam platform. They were designed in collaboration with HCI and visualization experts, and took input from clinicians and patient partners, for a patient-centered engaging application. Below, we show the evolution for some of the visualizations:

Diagrams - Frame 15 (1).jpg

Visualization design evolution for (top to bottom) Sleep, Symptoms and Intensity of Worries. Showing (from left to right) low fidelity hand-drawn sketches, medium fidelity Balsamiq, high fidelity mockup in React.js, and final implemented version of the visualizations. (click to zoom)

We then collaborated with healthtech firm CareTeam, to implement our visualizations on their platform. Below, we show the final implemented version for all of the visualizations, shown through one scrollable dashboard on the CareTeam web application, split here in two parts for compactness:


Visualizations by facet (from left top to bottom): sleep (green), physical symptoms (red), emotions (multicolor). (From right top to bottom): worries (blue),  and social interactions (purple)

These visualizations use familiar encodings like bar and line charts, are colour-coded by Facet, and are vertically aligned in a weekly format, to allow for easy cross-comparisons. Detailed design descriptions for each of the visualizations can be found here.


MIRO board showing affinity diagram for qualitative analysis of design evaluation interviews, color-coded by participant (click to zoom)

We evaluated the design of these visualizations with 10 youth with chronic pain, through semi-structured interviews. These interviews were transcribed and qualitatively analyzed through affinity diagramming between 2 researchers.


We found:

  • Youth found the visualizations useful, and thought it would help them in tracking their pain.

  • 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.

  • Overall, this was an application they could see themselves using in the long run. 

Impact Evaluation:

In order to assess the long-term impact of the application, we ran a three-week long clinical study, where 50 youth with chronic pain used the myWeekInSight 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:


MIRO board showing affinity diagram for qualitative analysis of impact evaluation interviews, color-coded by insight (click to zoom)

We broadly summarize the findings from our interviews:

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. 

Visualization Design: Different visualizations were relevant to different people. 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. 

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. 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. 

How did that turn out?

We were able to broadly confirm the feasibility of the myWeekInSight application through the clinical study. Results looked promising, with majority of the participants willing to use the application long-term, confirming the application's utility. In the future, we would like to do a larger and longer study with an improved version of the application, taking into account the feedback we received through the studies.

Our demo video below explains this project up to 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)!

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, and a visualization-focused publication is underway!

Challenges we faced

Challenges in industry-research collaborations: Our partnership with CareTeam for a real-world deployment showcased the challenges that arise in industry-research collaborations like timeline and scope mismatch, which are often the reason why many research projects do not get deployed in the real world. However, this partnership was crucial in deploying the application 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, and second, they were pain patients - thus requiring additional ethical considerations. Such populations are often not easy to access, and most design projects involving vulnerable populations are often not evaluated due to these very reasons. However, getting feedback from the target demographic is crucial for an accurate assessment of designs, so this highlighted the need for inter-disciplinary collaborations in such design projects.

What did we learn?

Designing from a youth-centered perspective: Through our design process and interactions with youth, 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 

bottom of page