XXVII.2 March - April 2020
Page: 79
Digital Citation

Using illustration to create more inclusive user interfaces for older adults

Catarina Correia, Elsa Oliveira, Francisco Nunes

back to top 

Designing inclusive technologies should be a core value of the HCI community. In an era when we design technologies that deeply impact users' lives, we are also responsible for doing everything in our power to avoid discrimination and promote appropriate treatment for everyone. However, designing inclusive technologies is easier said than done.

back to top  Insights


First of all, there is an overall lack of practical examples of inclusive user interfaces for different contexts. As a result, when confronted with specific design problems, we may struggle to find good advice and inclusive user interfaces to follow, and thus find ourselves relying solely on previous experience and common sense as we approach designing for and with older adults.

In this article, we explore practical examples in which we used illustration to create more inclusive user interfaces for older adults. Our expectation is that these examples can inspire others to think about the representations of older people in user interfaces and can serve as examples to draw upon in their work.

back to top  Designing For Older Adults at AICOS

We are members of the human-centered design department of Fraunhofer Portugal AICOS, a research center that has designed technologies for older people for the past decade. The department is multidisciplinary and includes researchers with backgrounds in design (communication, multimedia, industrial, service), informatics, mechanical engineering, and nursing. Our projects have often focused on supporting healthcare and well-being, and have relied on smartphones, sensors, and wearables.

Over the years, our team has developed a strong relationship with older people from Colaborar, a user network we created and maintain, and whose participants regularly take part in our research activities. Developing longstanding relationships with these participants provided us with a better understanding of our potential users and made them comfortable in verbalizing their thoughts and experiences with the technologies we put in their hands.

Designing for (and with) older adults made us realize the potential of illustrations for this particular audience. Illustrations can help users understand interfaces and options, even if they have limited academic education and/or experience using technology. Moreover, rich illustrations can cultivate empathy with a technology and thus reduce attrition during users' first contacts. This means that having a button on an interface is much more effective with older adults if it is presented with an icon next to the label, and that a survey question is easier to understand if it is accompanied by an illustration.

We also understood the impact that illustrations had on our users. The feedback we received from users throughout the years commonly mentioned aspects of the illustrations, including the fitness, frailty, gender, or mood of the characters. The illustrations projected possible ways of interacting or being in the world, and we wanted to ensure that our work appropriately represented our users and promoted positive outlooks. Here we reflect on things that have worked well to realize this vision.

Depict diverse groups of older adults when representing characters. One way to create more inclusive interfaces for older adults is to ensure that all illustrations represent members of that particular age group. It is straightforward to understand that displaying a group of fit young adults in user interfaces is not very appropriate, but it can be challenging to skip stereotypes and represent a diverse group of older adults.

To help circumvent aging appearance stereotypes, we have often resorted to coloring techniques. For example, we have colored the hair of the characters with unnatural colors, such as light green, to avoid the stereotype that all older adults have white or gray hair (Figure 1). Moreover, by using colors that appear in other elements of illustrations, we let users imagine that the hair of the character could be tinted, or simply be the result of creative illustration coloring to distinguish the hair from the character's face.

ins02.gif Figure 1. Illustrations of older adult characters used in GoLive Phone, an Android skin for older adults. These particular examples illustrate questions in a questionnaire app where older adults report how they are currently feeling.

To avoid representing specific skin colors, we colored the face of characters with the same color as the illustration's background. Using simple line drawing, we distinguish the face from the background and, at the same time, avoid representing a specific skin color in each illustration (Figure 1).

Avoiding stereotypes of frailty is also important. While extremely common in illustrations, the bent old person walking with a cane does not represent a large percentage of older adults, so it is not the most appropriate representation to use. At the same time, characters should not look overly athletic, as it may be unrealistic for most older adults to achieve such a figure. As usual, balance is needed.

Use illustrations that shift traditional gender roles. Another challenge of illustrating user interfaces was related to the representation of activities that are traditionally connected with certain gender roles and how work is divided in our specific social and cultural context. For example, in Portugal, representing an older woman doing housework in an illustration helps perpetuate the traditional gender role of women being responsible for all housekeeping, rather than questioning it or suggesting a more balanced work division. In our design work, we have often tried to avoid the identification of users with characters doing activities that are traditionally connected to a certain gender. The solution was to focus illustrations on the human interaction or the activity, not on the person doing the activity. For example, illustrating cleaning materials and detergents conveys the action of cleaning without suggesting that a specific person (typically a woman) would be doing that task (Figure 2).

ins03.gif Figure 2. Illustrations used in GoLive Phone app. The illustrations were part of a questionnaire and were used to represent actions performed in their daily routine—to clean the house, to cook.

Another option could be representing all genders doing specific activities, suggesting that activities can be done collectively and that they are a shared responsibility. Moreover, we have also made illustrations where the work shifted from traditional gender roles—for example, having a woman gardening or a man doing the dishes—to avoid stereotyping activities.

Support identification and encourage positive outlooks. An alternative way to illustrate beyond stereotypes is to create nonhuman avatars, which, due to their nonhuman characteristics, can help avoid representing specific human characteristics, such as gender or ethnicity.

We have made use of animal avatars to represent users in different exergames (exertion games). Animal avatars can mimic some of the users' characteristics, such as movements in the game, while being distinctive from other aspects, such as physical characteristics or disabilities. Several animal species are visually unclear in terms of gender and age so they more easily fit people with a variety of profiles, all without compromising the identification of the user with the character (see Figure 3).

ins04.gif Figure 3. Penguin illustrations used in the FallSensing project, a research project that developed an exergame to practice exercises that could prevent falls. The penguin avatar was chosen because it could mimic older adult movements and promote a fun mood to the game.

Avatars can also promote a positive outlook that can be important for older adults, who often were raised to think that they should be serious. Using animal avatars enables us to communicate the message that playing and having fun are for all audiences.

back to top  Why is This Important?

Older adults are often associated with different stereotypes such as seriousness, disability, illness, or weakness. These stereotypes can also affect their experiences with technology, emphasizing negative aspects assigned to their age and not necessarily to their specific characteristics. Even so, if those conditions are in some way limited, a positive approach, which highlights the bright side of an experience, will more effectively enhance the common good.

We have seen that it is possible to create illustrations that represent people in their full diversity. Moreover, there are other areas of design that can benefit from this same mindset—from products to interactions, fashion, and environments. Fundamental areas like mobility, accessibility, housing, the built environment, and social networking should consider inclusive strategies with an aim: Empower people and the common well-being.

back to top  Authors

Catarina Correia is a design researcher at Fraunhofer Portugal AICOS. She works on user interface and user experience design of technologies for non-mainstream audiences, such as older people or people with disabilities. Her research interests are design and identity, design and emotion, social innovation, and inclusive design. [email protected]

Elsa Oliveira is a design researcher at Fraunhofer Portugal AICOS. She investigates how to create appropriate experiences and user interfaces for older adults and other non-mainstream audiences. Most recently, she has focused on mobile user interfaces and exergames. [email protected]

Francisco Nunes is a senior researcher at Fraunhofer Portugal AICOS. He studies how older people live with chronic conditions and how they use technology, to understand how to design for self-care and medical care. [email protected]

back to top 

Copyright held by authors. Publication rights licensed to ACM.

The Digital Library is published by the Association for Computing Machinery. Copyright © 2020 ACM, Inc.

Post Comment

No Comments Found