User-Centered Design of a Diabetes Self-Management Tool for Underserved Populations

Abstract

Background:

User-centered design (UCD) or user experience design (UXD) methods have gained recent popularity for the design of mobile health (mHealth) interventions. However, there is a gap in application of these methods for diabetes self-management. This study aims to document the UCD process for a self-management mobile application aimed for patients with diabetes in underserved communities.

Methods:

A UCD mixed-methods approach including interviews with patients and providers, a review of literature, and a technology landscape analysis were used to define the app functional information requirements that informed the user experience/user interface design process. Usability studies with the app designers and developers, intended users, and a focus group of nurse educators and dieticians were used to test and improve the design.

Results:

An mHealth app was developed with health-tracking features for stress, blood sugar, food, exercise, medications, weight, and blood pressure. We tackled a range of usability and user experience challenges, which encompassed addressing issues like low health literacy by employing a combination of user interface design principles, intuitive visualizations, customizable icons, seamless database integration, and automated data input features. Special attention was given to the design of educational content accounting for the intended users’ cultural background and literacy levels.

Conclusions:

User-centered design approach contributed to a better understanding of the intended users’ needs, limitations, mental models, and expectations, facilitating the design of a comprehensive mobile app for patients with diabetes in underserved communities that includes essential features for self-management while providing a strong educational component, addressing an important gap in the literature.

Introduction

The rapid rise in prevalence of diabetes in the United States since 1944 has been nothing short of an epidemic. ¹ According to the Pan American Health Organization, as of November 2022, approximately 62 million people in the United States were diagnosed with diabetes with projections suggesting that 109 million people will be diagnosed with diabetes by 2030. ² In 2021, the United States spent 966 billion dollars on health care for adults aged 20 to 79 years, tripled from the 232 billion dollars spent 14 years earlier in 2007. ³ To address the needs of the growing patient population, health care systems need to adopt alternative treatment approaches.

One such care pathway that has gained popularity, particularly after the COVID-19 pandemic, is to augment traditional care with self-management capabilities. The Centers for Disease Control and Prevention (CDC) has demonstrated that when patients with diabetes learn how to self-manage their condition, they achieve significant health improvements, including lower A1C levels, reduced medical expenses, and an enhanced quality of life.^4,5 Despite the demonstrated success, certain barriers impede the widespread adoption of self-management methods. For instance, as of 2021, the US Census Bureau reported that 37.9 million Americans are classified as low-income individuals ⁶ who have been associated with low health literacy. ⁷ In addition, cultural beliefs and lack of methods to manage their condition can also hinder effective self-management. ⁸ However, ongoing innovations aim at overcoming these obstacles and empowering individuals to better manage their condition.

One such innovation is mobile health (mHealth) which utilizes wireless technology to enhance the delivery and outcomes of self-care. ⁹ Although often considered effective in empowering patients and serving as a reliable platform for delivery of information, mHealth also has limitations such as wide-scale adoption, primarily associated with the remote nature of care and dependence on the user’s behavior. ⁹ Older patients, in particular, may encounter difficulties due to limited technological literacy, and the general usability of health apps presents a common barrier in implementing such systems. ¹⁰ Despite these barriers, mHealth has demonstrated effectiveness in managing cardiovascular diseases, facilitating prevention efforts, promoting lifestyle changes, and supporting diabetic care. ¹¹ However, gaps have been identified in mHealth studies such as a lack of research on the development of user-centered design (UCD) systems. User-centered design involves creating systems that prioritize the user’s needs ¹² and is often overlooked in the development of mHealth applications. This study aims to document the UCD process for GlucoseCoach, a self-management mobile application intended for patients with diabetes in underserved communities.

Methods

As depicted in Figure 1, a mixed-methods UCD approach was utilized to engage users and stakeholders to derive functional requirements for the design of an mHealth app for diabetes self-management. The Institutional Review Board at Texas A&M University approved the study protocols (IRB2018-0150, IRB2018-1503D, IRB2020-1130M). All participants provided written consent.

Figure 1.

Overview of UCD methods used.

Interviews With Patients and Health Care Providers

In our previously published work, ¹⁰ feedback from 97 patients and 11 health care providers in underserved communities of south Texas was elicited to inform the design of the mobile interface. An interview guide was designed to elicit responses that identify patients’ attitudes, behaviors, knowledge levels, and risk perceptions, along with acceptability and usability requirements with respect to the use of mHealth technologies for diabetes self-management. A second interview guide was designed for health care providers to capture perceptions and expectations of mHealth technologies for diabetes as well as barriers and opportunities for adoption and impact on their workflow.

Literature Review

A literature review was conducted to identify themes that could inform the mobile app design. Articles were reviewed on topics related to (1) diabetes management specific to underserved communities, (2) challenges and opportunities of mHealth for self-management of diabetes, (3) design and development of mHealth applications for self-management of diabetes, and (4) findings from usability studies.

Technology Landscape Analysis App Review

A technology landscape analysis ¹¹ of diabetes self-management apps available in the market (Google Play and iOS Store) was conducted with the purpose of obtaining insights into existing apps, such as number and kind of features available. Four keywords were used in the search for apps: diabetes, diabetes management, diabetes tracker, and glucose. The review included only free apps in English, with a minimum four-star rating, intended for patient use, updated within the last two years from the review date, which downloaded and worked correctly, and included a basic feature to record blood glucose levels.

Functional Information Requirements

One of the notable challenges in digital health design is the bias in requirements toward certain platforms, functionality, and/or existing systems. The study employed the functional information requirements (FIRs) ¹² method. This method uses a hierarchical approach to decompose goals (eg, improve health awareness) into several high-level functions (eg, logging). Each of these functions is then further decomposed into more specific or low-level functions (eg, food logging) for which display or user input requirements (eg, meal type or portion) are defined (Figure 2). These platform-independent display requirements would then feed the initial design that includes wireframing and prototyping. Findings from the interviews, the literature review, and the technology landscape analysis app review were integrated toward the definition of FIRs to inform the design of patient-centered functions and interactive features of the mobile app.

Figure 2.

Example of the functional information requirements (FIRs) development for one high-level function (self-management).

User Experience/User Interface App Design

The FIRs were used to design a comprehensive set of wireframes. Wireframing is commonly used as the initial step in conceptual design of digital interfaces, serving as a guide to identify the location of the major navigation and content elements on each screen. The wireframes were then used for the high-fidelity visual prototyping of the mobile app interfaces, using a collaborative interface design tool called Figma. ¹³ The wireframing stage supported the development of low-fidelity prototypes to test alternatives; to organize the information layout; to test user flows; and to evaluate the steps, actions, and decisions the user has to make while navigating the mobile app. Once the overall information layout and flows were completed, a high-fidelity prototype was developed to add visual details such as colors, graphics, and animated features.

High-fidelity and interactive prototypes were first evaluated using internal formative usability testing of the prototype with designers, developers, and usability experts. This effort was followed by an external usability testing phase where a remote synchronous walkthrough method was used with nine patients with diabetes in underserved communities, where the participants interacted with the prototype to complete several tasks assessing the depth and breadth of various functionality provided as well as overall usability and experience. The participants had type 2 diabetes. There were four men and five women, with ages ranging from 39 to 62 years, and an average of 53 years. All participants were Hispanic. Only two out of the nine participants had previous experience interacting with mobile app for anything related to diabetes care management. A structured usability test moderator’s guide was developed including scripts, questionnaires, and task descriptions. The usability testing sessions were audio- and video-recorded for further analysis and identification of user preferences and usability problems. A focus group with six nurse educators and one dietician who provide services to patients with diabetes in underserved communities was also conducted. Focus group participants interacted with the prototype and provided their perspectives about the educational content, design, and functionality of the mobile app prototype. The focus group was only made up of diabetes educators; however, in the future, feedback from physicians will be requested.

Results

Interviews With Patients and Health Care Providers

Findings from our previous work (see Bonet Olivencia et al ¹⁰ for detailed documentation of findings from interviews) suggested that patients and providers consider logging and tracking blood glucose levels, physical activity, nutrition, medication intake, and insulin dosage as important features to support self-management of diabetes. Participants also emphasized the integration of reminders and educational content. Providers highlighted the need to consider patients’ linguistic abilities and health literacy levels in the design of the user interface (UI). Findings suggested that potential issues with information visualization, information recall, and data entry tasks could be mitigated using simplified interfaces, icons, nutritional databases, and autofill features.

Literature Review

Published literature suggests the importance of including rich but simple educational content, such as tips for blood sugar control, nutrition, and exercise. ¹⁴ To address issues related to ease of use, literature has suggested integrating clearly labeled buttons and using usability heuristics, which are widely used and accepted principles to improve user experience (eg, Nielsen’s heuristics),^15,16 while accounting for potential low literacy and numeracy. ¹⁷ Literature also highlights integrating accurate logging and tracking features that provide the users the ability to insert data and simple visualizations of their data. ¹⁸ Including a reminder feature for glucose testing, meals, and medication intake has also been highlighted. ¹⁹ To facilitate data entry and increase the likelihood of engagement and app usage, researchers have highlighted the importance of having a feature to connect and sync devices such as glucometers with the app. ⁹ A feature to allow patients to share their data with health care providers has also been highlighted. ¹⁹

Best-in-Business App Review

A total of 1000 apps resulted from the search in Google Play Store, with 99 apps complying with the inclusion criteria for review. Search of the iOS Store yielded 665 apps of which 70 met the inclusion criteria. From the main features identified in the interviews and the literature review, namely, (1) education, (2) notifications/reminder, (3) graphs and charts, (4) social support, (5) incentives/motivation, (6) food tracking, (7) carb tracking, and (8) data sharing with provider, only 11 of the apps reviewed from Google Play Store included 5 or more of the mentioned features, while only 7 iOS apps included 5 or more of the mentioned features (Table 1). Education was the least represented feature in the reviewed apps (only 13% of apps in Play Store and 10% in iOS Store). In addition, less than 20% of apps reviewed permitted carb tracking.

Table 1.

Reviewed Apps That Included Five or More of the Mentioned Features.

App store	App name	Number of features
Google Play	mySugr	6
	forDiabetes: diabetes self-management app	6
	Life in Control DIabetes Coach	6
	GlucoCare- A Diabetes Management App	6
	One Drop Diabetes Management	5
	DIABNEXT	5
	Diaguard: Diabetes Diary	5
	SocialDiabetes	5
	Glycemic Index & Load: low- carb and diet & fIber	5
	ManageAm App	5
	Noom	6
iOS	mySugr	6
	Noom	6
	One Drop Diabetes Management	5
	SocialDiabetes	5
	Ellie Healthcare	5
	Mumoactive Diabetes	5
	Virta Health	5

Functional Information Requirements

Informed by the interviews, literature review, and app review, several goals were defined for GlucoseCoach: (1) improve access to useful self-care information, (2) provide user support when required, (3) maintain the user’s awareness of their condition, (4) enable user to manage their diabetes, (5) allow the user to share information with their provider, (6) allow the user to keep track of their clinical information, and (7) change user’s lifestyle/behavior. The FIR analysis was conducted to decompose high-level app functions into mid-level and low-level functions; the interface elements required for those functions; the type of input required; and the feedback to be provided to the user for these goals (Figure 2).

User Experience/User Interface App Design

To enhance users’ interaction with the app and facilitate information processing, the use of textual information was reduced by the integration of simple visualizations such as images, graphs, and videos. The main app display (Home page) included dashboard-style widgets with summarized data to simplify access to user data and improve tracking user progress using intuitive graphs and visualization (Figure 3).

Figure 3.

Example of the widgets with summarized data.

To enhance user interaction, redundancy in design features was integrated to provide alternative navigation paths. For example, the data input task for any of the categories could be completed either in the home screen of the app or by interacting with data entry features in the Data section tab (Figure 4). Similarly, the data visualization screens could be accessed either through the Widgets or the Data section tab. Consistency in UI design was considered by keeping the use of language, icons, symbolisms, and other recurring elements consistent throughout the screen design. To facilitate the learning process on how to use the app, high similarity was kept among the data input and data visualization tasks across categories. Given the recognized burden that data entry tasks imply, a syncing feature was added to facilitate the connectivity of the app with platforms and devices, such as glucometers. As a result, a comprehensive list of devices that patients with diabetes use and their potential to connect to the mobile app for diabetes management was created. In addition, several publicly available databases for food and medication were identified to support autofilling and facilitate data entry tasks.

Figure 4.

Redundancy in the design of data input tasks.

Developing educational content was a major focus during the design process. The research team compiled a comprehensive list of educational resources (ie, digital flyers, and videos) from reliable sources such as the American Diabetes Association and the CDC. A literature review was conducted to inform the development of a set of guidelines for the generation of educational materials for underserved populations with low literacy, low health literacy, and age-related challenges. One of these guidelines was the simplified linguistic and word use,^20-23 which involves the simplification of the text reading level, length, and complexity; the use of an active natural tone; and minimizing technical jargon. Another important consideration is typography^20-23 to improve readability of text and maximize message identification through the careful selection of font style, size, highlighting (eg, bolding or underlining), and the incorporation of white space. Another important consideration was using simple and cultural-sensitive visualizations^20,21,^23-26 to amplify the efficacy of the intended message. The last guideline identified intuitive structure,^20-23 which aimed at proper use of color, sequencing, and information chunking to form the layout of the material. These guidelines, in conjunction with the educational content identified from reliable resources, were used to develop short educational scripts to be integrated in multiple sections of the app and to create multimedia content. The multimedia content was divided into topic modules, consisting of multiple animated and voiced-over short videos, with a maximum duration of three to five minutes. In addition, a disclaimer has been included in the application to inform users that the educational content does not replace medical advice.

Usability Testing

A round of formative usability testing with design experts was used to evaluate the design in terms of placement of features and flows and to test whether the entire experience was intuitive. A second round of usability testing focused on the aesthetics, functionality, and usability issues of the modified app. Several issues related to affordances ²⁷ (or how the visual appearance of an element may not imply proper usage [eg, a feature that looks like a button may invite pushing]), mode confusion ²⁸ (or not clearly stating the mode in which the information is provided [eg, not clearly stating the transition from a page that allows data entry to a page that only displays information]), and the competition of primary goals versus secondary goals were identified while attempting to input data or access recorded data. To address this issue, the data entry and the data visualization screens were connected through buttons and icons the user can interact with to facilitate the process of switching between the screens for both functionalities (Figure 5). Participants also expressed their expectation to see tips, suggestions, and personalized recommendations based on their data. Pop-up notifications have been integrated to redirect the user attention to important information such as blood sugar values outside the healthy range, tips, suggestions, and recommendations based on their data. Changes in the vocabulary used throughout the app design were made to adjust to user expectations.

Figure 5.

Connection of data entry and the data visualization screens using buttons and icons.

The focus group with nurse educators and the dietician highlighted the importance of keeping the food-related content simple, using images, lists, and simple vocabulary. While the focus group participants complimented the food-tracking feature design, they advised to be careful with the selection of food-related images to be used in the app, as users may misinterpret them as representations of “recommended” or “acceptable” portions. Suggestions about topics to include in the education section of the app included survival skills; courses of action on what to do in case of hyperglycemia or hypoglycemia; symptom recognition; and guidelines for action, medication, and nutrition. The focus group recommended the integration of the blood pressure and stress management features in the app, as they were not initially included yet are essential aspects often neglected when it comes to diabetes management. In addition, the focus group recommended functionality to track A1C and blood sugar level values.

Discussion

The evidence of benefits of mHealth has been emerging in recent literature. ²⁹ While UCD has been widely used in the design of medical devices, its application for the design of mHealth tools, particularly for self-management of diabetes, remains understudied. User-centered design approach which involves relevant stakeholders at different stages of the app design provided rich data to inform key app features and functionalities as well as the iterative design of GlucoseCoach. A key aspect of UCD is the elicitation of requirements to ensure the resulting app meets the intended users’ needs and expectations. This article documents various methods used for UCD of a diabetes self-management app which resulted in various essential features, some of which are in line with published guidelines on mHealth apps in general such as monitoring capability for blood sugar, food, exercise, medications, and weight^30-32 as well as several requirements specific to underserved communities such as intuitive visualizations and simplified educational content to address low health literacy. Furthermore, the research informed the integration of features to monitor other essential aspects for diabetes management such as stress and blood pressure,^33,34 which are often overlooked when it comes to self-management.

Our review of apps suggested a noticeable underrepresentation of educational features in available apps. However, design of intuitive, authoritative, and effective educational content was highlighted in various stages of this research. Therefore, considerable effort was given to the development of educational modules while accounting for known limitations of underserved population such as low literacy, low health literacy, and age-related challenges. In addition, elements of UI design such as good redundancy, consistency, similarity, and simple visualizations were applied throughout the app screens to overcome the limitations. While initial usability testing showed promise, more work is needed to evaluate the long-term engagement and usage of GlucoseCoach.

An essential element of UCD is participatory and iterative nature of design and development. In our application of UCD, relevant stakeholders were involved in all stages of the design process and their feedback has led to a more intuitive and usable app (see Figure 6). One of the limitations of this work is that the design requirements and evaluations were conducted with intended users from various representative underserved communities in South Texas and the result may not generalize to all underserved populations. In addition, only one round of usability testing was conducted with a relatively small sample of representative users and nurse educators. Future work should include several rounds of formative usability testing with other stakeholders including health care providers to understand their perspectives and inform potential changes to improve the app design.

Figure 6.

An example of iterative design improvement as a result of user feedback. Users mentioned the importance of having a comparison point or a goal for their daily steps as well as lack of summary of daily and weekly values. These changes were made to the revised interfaces (two screens on the right).

Conclusion

This article highlights the utility of applying a mixed-methods UCD approach to design a diabetes self-management mobile app for patients in underserved communities. This immersive experience accounting for the intended users’ mental models and expectations facilitated the design of a comprehensive mobile app with essential features and a strong educational component, covering an important gap in the available apps in the market. Limitations in intended users’ literacy, health literacy, and previous experience with technology were addressed using elements of UI design, simplified interfaces, adjustable icons, databases, and autofill features to simplify information visualization, information recall, and data entry tasks. Multiple types of simple visualizations facilitated interpretation of diabetes data. Usability studies with intended users evaluated the design and informed changes to improve the match between the users’ mental models and app design. Design guidelines were compiled and applied to develop education material sensitive to intended users’ socioeconomic limitations and cultural backgrounds to promote a healthy attitude toward diabetes care. The findings from usability evaluations show an overwhelmingly positive perceptions which we believe are attributed to the UCD process.