A Guide for Creating Inclusive Digital Avatars

Motivations for Avatar Choices

Insights
People may desire avatars that accurately represent themselves, or may explore different physical representation, depending on the context or the digital platform.
People may also explore different physical representation through their avatars due to personal preferences or reasons.

A survey of 1000+ Metaverse users found that 24% of respondents wanted to create an alter ego in the Metaverse, and 54% wished to design an avatar that didn’t resemble themselves.2

A survey of 1000+ Metaverse users found that nearly 21% of respondents wished to create an identity that “match[ed] how they feel on the inside.”9

Deep Dive

An example of one individual leaning into different aspects of their identity for avatars on different platforms

In a study about disability representation in avatars,10 one participant shared the different avatars she created to highlight different parts of her identity. The Bitmoji avatar (left) highlights her identity as a person with Albinism, while the Animal Crossing avatar (right) highlights her racial identity as a South Asian.

Recommendations

  • 1. Avatars should not be limited to mirroring reality; users should be able to design the avatar to reflect their appearance or cater to their imagination, allowing for both realistic and fantastical creations (e.g., robots, animals, purple skin.)
  • 2. Allow individuals to create and switch between multiple avatars within the same platform.
Insights
While more customization options are necessary for inclusion, too many options can lead to decision fatigue, confusion, or disappointment.
There is no consensus across industry — or within the literature — on the appropriate number of presets, across dimensions.
Deep Dive

Examples showing how skin tone presets vary across platforms.

There is no consensus on the skin tone preset options provided for avatars.

Deep Dive

While some companies are striving to improve representation, they have different ranges and options for the hair types.

Also, there is no consensus about hair texture options, even beyond avatar platforms.

Deep Dive

Though there is no consensus, there are some
developed scales related to skin tones.

There are existing, research-based scales for representing diverse skin tones that have evolved over time. For instance, the Fitzpatrick scale, developed in 1975, has been widely used across industries, but has a more limited representation of darker shades compared to lighter ones. The Monk Skin Tone Scale was developed in response to this gap,17 and is considered more inclusive and representative.18 Other options have also emerged to fit the needs of specific populations, such as the PERLA Color Palette, which was designed to classify skin tones in Latin America.

Recommendations

  • 1. Provide a mix of a presets and sliders (where relevant) for physical features. Be aware of the trade-off: fine grained changes through sliders are not super helpful for someone with a visual impairment.16
  • 2. While some companies may choose to create their own skin tone scale, there are some publicly available and academically tested scales to start with: Monk Skin Tone Scale and PERLA Color Palette.
  • 3. The industry needs standards. There is an opportunity for organizations — particularly in tech — to align on the creation of standards around an appropriate number and organization of presets. This can be achieved through conferences, roundtable discussions, and other knowledge-sharing events and coalitions.

Capturing Nuances

Insights
Balanced representation is important, regardless of the number of options available.
When it comes to skin tone, avatars should capture a diverse, balanced range of colors, as well as undertones.
When certain physical traits are over-simplified, or not rendered correctly, it creates another point of disconnection for people trying to create representative avatars.
Accessories, body shapes, and physical features should not be inherently connected to a specific gender, as it is limiting and does not represent how people express themselves.
Deep Dive

A helpful resource for coding Black hairstyles

Code My Crown is a step-by-step guide on coding for Black hairstyles and textures for avatars. It was developed in partnership with Open Source Afro Hair Library and a team of Black 3D artists, animators, programmers.

Limiting gender presentation through avatars can lead to or exacerbate body dysmorphia, research suggests. For instance, one user found a game that did not allow for an avatar to be male with breasts “isolating, as it suggested that the only way to be male was to be male-presenting.”41

Recommendations

  • 1. Work with minoritized communities to ascertain which features are core to representing people’s identities, and ensure that they are not placed behind paywalls.
  • 2. Don’t minimize or bury accessories as a less important add-on.
  • 3. Provide a mix of a presets and sliders (where relevant) for physical features. Be aware of the trade-off: fine grained changes through sliders are not super helpful for someone with a visual impairment.
  • 4. The current variety in skin tone options highlights the need for a standard. The Monk Skin Tone Scale with sliders for undertones offers a strong foundation for inclusive customization.
  • 5. If you’re not able to mention undertones in the preset options, consider only showing users the “neutral” option for each skin tone, and allowing users to adjust undertones via the slider.
  • 6. Provide flexible and fluid gender settings.42 (e.g., not relying on a binary and making physical features and accessories accessible to all users regardless of gender).
  • 7. Be aware of the implications of how presets and sliders are organized. Depending on product and design capabilities, consider consciously flipping the order, or randomizing so attributes associated with more power and privilege are not always on the same side. Make sure to test these approaches with a diverse set of users.

Prioritizing Certain Presets

Insights
The physical features that are most representative of one’s identity differ from person to person.
For some individuals, self-expression extends beyond physical features.
The order in which options are presented — through presets and sliders — impacts representation and inclusion.
Deep Dive

The impact of a “low-diversity” avatar environment

A study found that when presented with a “low-diversity” avatar environment, Black people were less willing to reveal their racial identity, and customized their avatars to be more white-coded.23 

Deep Dive

The organization of skin tone presets

While most companies across industries list realistic skin tone options from lightest to darkest, some have chosen to flip the script from darkest to lightest. 

Recommendations

  • Be aware of the implications of how presets and sliders are organized. Depending on product and design capabilities, consider consciously flipping the order, so attributes associated with more power and privilege are not always on the same side. Make sure to test these approaches with a diverse set of users.

Building "Starter" Avatars

Insights
Starter avatars may be seen as the normalized version of the social space’s user.
If they are limited, starter avatars may make people feel less welcome or unrepresented.
Deep Dive

Some tech companies are exploring the use of machine learning to create personalized starter avatars based on selfies from each user.

Recommendations

  • 1. Show multiple diverse starter avatar options upfront (ideally including at least one non-human option if those are available on the platform) and allow users to choose their own starter.
  • 2. If possible, given machine learning and design capabilities, offer users the option of submitting a selfie to get a personalized starter avatar that is based on their own features.
  • 3. Alternatively, randomize the starter avatar shown to users and provide a “generate random avatar” button for users to cycle through some options if they do not feel like the first one is representative of any of their identities.46
  • 4. For each starter avatar, have a different starting point on each physical feature slider. Do not always start at the middle or left of the slider, for example. No starter avatar should be in the middle or leftmost for all physical features — it should show a mix of slider settings. This avoids reinforcing default “norms.”

Inclusive Avatar Labels

Insights
The tone of labels should be polite and formal; and not too familiar, intimate or colloquial.
Descriptive words are better than numbers for conveying necessary information for user accessibility — especially when adding labels to sliders.
Labels should relay the type of information obtained from sight, and not be interpretive, make assumptions, or rely on jargon.
Consistency is key across all labels and attributes. 
Deep Dive

Most companies do not provide detailed descriptions of their avatar features for users with screen readers.52

In our landscape analysis, only a few platforms offer a descriptive approach to labels and there isn't consistency to labelling. 

In an interview, one low vision individual using a screen reader, whom we observed using the feature.

Deep Dive

Labels that correlate to only letters or
numbers are not useful

One platform’s labeling system uses numbers (“Skin 1”, “Skin 2”, etc.), which do not provide necessary and accessible information to people using screen readers.

Deep Dive

Descriptive labels can capture nuances clearly

One makeup company created functional and descriptive labels that include undertone descriptors that have the same number of light and dark colors (8 shades of each) and mostly medium colors (10 shades of medium) — some brands emphasize lighter shades options.

Recommendations

  • 1. Ensure that screen reader accessible labels are provided for every feature and new update.
  • 2. Use descriptive words — not numbers — where possible. 
  • 3. Consult with ERGs / affinity groups to identify precise, inclusive terminology for specific identities.
  • 4. Stay up-to-date on inclusive language guidelines. Revisit / update labels every five years.
  • 5. Keep each label short.
  • 6. Ensure that labels are literal and accurate.
  • 7. Ensure that labels relay the type of information obtained from sight.
  • 8. For sliders, for screen reader users who are inundated with detailed label information, consider using one term for an entire range, instead of confusing the user with percentages. For example, if providing an undertones slider, use labels “cool” for ranges such as 0-33%, “neutral”  34%-66%, and “warm” for 67%-100%, etc. Acknowledge the trade-off this creates between providing additional information and enhancing usability, and test your approach with a range of screen reader users. 

See Sources