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

Skip to the recommendations.

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.”⁴¹

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.⁴² (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

Skip to the recommendations.

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

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

Skip to the recommendations.

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

Skip to the recommendations.

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

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.