The UX of Virtual Identity Systems
uxdesign.cc – User Experience Design — Medium | Gabriel Valdivia
5 Lessons learned from studying avatar creation flows
I’ve been creating virtual versions of myself ever since I can remember. Growing up as a gamer, I get excited every time I am presented with a “Create New Character” prompt.
With the rise of X Reality, I am tempted to re-examine the systems we’ve established to craft our online personas. There’s a lot of prior work on issues of identity in virtual environments by much more qualified folks than I; here’s one of Jong-Eun Roselyn Lee’s earlier papers on a similar topic, coauthored by a couple other people worth reading.
The following are some examples of patterns we can consider as we dive into the next generation of virtual representations of ourselves.
1. Context is King
Some of the best avatar creation flows place the process of creating your avatar within the flow of the story. This is an opportunity for the game to showcase their tone and inform the decisions you make as you create your avatar.
In Grand Theft Auto V Online, avatars are posing to get their mugshot taken, which is a cheeky way to introduce players to the sensibilities of the game. Players can also choose the avatar’s parents and how much they resemble the avatar, which is an interesting way to automate an otherwise complex problem —how should your upbringing influence your appearance?
Fallout 4 lets player edit the facial features of a male and female character, even though only one of them will be playable. The couple stands in front of a bathroom mirror as the player alters their hair and facial features. This incentivizes the player to think about a character in the context of a relationship — how should your partner’s appearance influence yours and vice versa?
Metal Gear Solid V: The Phantom Pain places the avatar creation process in the midst of facial reconstructive surgery. The main character needs to conceal their identity as he wakes up from a coma and is being chased by his enemy — how should your new identity relate to your old one?
2. More is More
Successfully representing a diverse set of avatars is what makes or breaks an avatar customization system and thus an online community. Nearly every facial feature and body type is filled with hundreds of combinations that make an avatar resemble the infinite complexities that make you you. The design challenge is how to represent a large set of options in a way that is easy to grok. Balancing simplicity with depth in optionality is one of game design’s dark arts that only a few manage to get just right.
Organizing concepts like eye shape, tattoos, wrinkles, and standby expression can be a master class in information architecture. Not many games get this right; there doesn’t seem to be a standardized way to organize this information and players often have to learn a new system for every game.
Unfortunately, many avatar creation systems retain a rigid definition of fluid terms like race and gender, especially when providing templates for their characters. The games that are able to avoid these shortcuts and provide a flexible, user friendly interface for customizing an avatar stand out from the bunch and tend to impact the community of players.
This research paper explores the question around diversity in virtual worlds and how it impacts players’ willingness to express their offline racial identity in avatar customization systems.
3. Non-Binary Options
Not unlike your real identity, a good virtual identity is defined by nuance; avoiding binary terms and hard lines between body features is a must.
The Sims 4 does a great job giving players a starting point for their avatar, then providing ways to adjust the properties within a spectrum. The user interface is often depicted as a set of sliders or by directly manipulating different body parts with the player’s cursor.
4. Highlight Editable Zones
Directly manipulating or selecting different facial features is a common practice among avatar customization systems.
In Fallout 4, as the player pointer hovers over the avatar’s face, different facial features glow to indicate what is editable. Tapping a section opens up different editable properties like sculpt, type, and color.
Games like Black Desert Online separate the face into distinct sections that can be manipulated directly by dragging them. This level of finesse affords a great feeling of control for the player.
5. Use Abstractions to Emphasize Differences
It is not uncommon to provide the player with a set of options to choose from to select elements like the face shape. Cycling through many seemingly indistinguishable options can be overwhelming.
The Mii Maker expertly uses iconography to highlight the differences in face shape, which makes each decision feel intentional and removes ambiguity between options.
Destiny does a good job providing clearly distinct choices for hair styles and colors that fit in within the aesthetic of the game. The simplified art style of the icons on the right removes unnecessary decorations and makes them instantly recognizable.
I am very excited for the future of virtual identity systems. Patterns are starting to form and there is clearly a big opportunity for experimentation and improvement.
Also, I went on a binge and created a Youtube playlist with as many avatar customization UIs I could find. Let me know if I missed any gems!
Finally, if you enjoyed this read, I wrote about how virtual and augmented realities can help us use identity itself as another canvas for self expression, devoid of what’s “socially acceptable” since we can theoretically form new societies (of sorts) and along with it, new norms.
If you’d like to chat more about this, I’m @gabrielvaldivia on Twitter.
Gabriel wrote this story to share knowledge and to help nurture the design community. All articles published on uxdesign.cc follow that same philosophy.