On The Importance of Avatars
I review my thoughts on avatars
- avatars and identity
- on privacy
- low vs high fidelity
- keeping avatars gender neutral
- choice, change and emotional connection
- animated vs static
- the use of color
- the effect of shape
- curated vs computer generated vs user generated
- the first batch
Choose Me!
I have noticed with my children that they are highly attached to their avatars. Netflix has a feature that lets families associate avatars to each person. The avatars are meant to visually communicate the account currently logged in. Since my kids are still learnign to read, these small square pictures serve their purpose well.
I have observed passionate battles over which icon is chosen. The avatar and associated list of ratings sets the tone for whatever they will watch next. This often gives my daughter a huge advantage because she tends to win these challenges.
Seeing how passionate they were about their avatars gave me the idea that I should include avatars as part of my app. If I could get kids intensely passionate about the books they read as they are about the videos they watch, then I think that'd be a major win for the world.
On Privacy
It is important to immediately address privacy concerns. When building an application or service that children will be using any and all information that can submitted by a user MUST be scrutinized before being distrubed.
The way a service implements avatars is a strong indicator of both the expected usage of the avaatars and the level of privacy that the service implicitly provides. When you see a service that uses user submitted photos (Facebook) you can correctly assume that those photos serve a social mechanism. When you see a service that uses computer generated avatars (Wordpress comments) you can assume that the service is either less social or not a social product.
Image Uploads
Image uploads are often my biggest concerns when designing a product. If a offensive photo were to make it into the system it would completely undermine and ruin the credibility of the product!
Solutions to this sort of challenge require manually reviewing each image that is uploaded. Properly reviewing every single image can be a huge but necessary burden. In my app's case I simply do not allow ANY image uploads. For identifying users I utilize curated and computer generated avatars.
Text Messaging and Commenting
Messaging between users is a place where offensive behavior can also occur. Some services will implment a limited set of curated messages.
Commenting is hard to manage. However, by segregating anonymous users from users that parents have approved of it can help to mitigate and limit unwanted interaction with strangers.
Low vs High Fidelity
There are generally two types of avatars: low and high fidelity.
Low fidelity avatars are generally abstract in design, low in information, and utilize geometric or organic shapes. These are often used when the user has not been identified, or as a way to visually differentiate between multiple users. Abstract avatars are often used to speed up an account signup process by randomly selecting an avatar thereby not requiring the user to select or upload a higher fidelity image.
Low fidelity avatars also move the onus of a web service away from the "person" and on to their activity/comments in the system. This shift is important for things like commenting systems where too much identifiable information provided (like a high resolution photo, and even a username) can influence the perception of the user. Extra information introduces biases quickly and can often distract from a products purpose.
High fidelity avatars are often cropped photos, or fine line drawings. This type of avatar is most useful for users that want to maintain a particular brand or identity across services.
High fidelity user generated or user submitted avatars allow for the most literal sense of identity.
The target audience of my application is currently parents and children aged 0.5 - 7y. This wide age range and lack of user sophisitication is a strong vote for using lower fidelity avatars.
Gender Neutral Avatars
The digital game company TocaBoca is one of my favorite product companies. Each of their products feature avatars that are purposefully designed to be gender neutral. In their game "Toca Tailor," there are two human avatars and two animal avatars. This allows flexibility when choosing a character that doesn't fit within the normal gender roles. I personally like the sloth character a lot.
In the game, you can dress up your character in dresses, blouses, pants, skirts, shorts, an shirts. All characters have access to each type of clothing. In addition, there are several different patterns and colors available for creating clothing. The mixture of different clothing types and different patterns makes for very creative designs.
I have observed other patterns across their products. In products that feature humans, they usually include one male, one female, and two ambiguous gender typed characters. In products that do not feature humans, they use different shapes, colors, and animation mannerisms (like method of locomotion, or gait) to skirt the entire gender question entirely.
Suffice it to say that I plan on providing a mixture of gender normalized types as well as ambiguous gender types.
Choice, Ease of Change, and Emotional Connection
Giving children the ability to choose their avatar identity introuces interesting behavior. For one, the avatar becomes her method for expressing her current emotion. For the other, it is distinctly his identiy.
One issue with allowing easy avatar changes is that the child who changes her avatar frequently pays more attention to the location of the avatar relative to the others when determining which one is "hers". I have considered adding more information like a first initial.
There is some evidence that supports having less options (The paradox of choice). I may cull back the list to a standardized selection. I am not sure yet and will keep monitoring the frequency of changes and the distribution of avatars across the entire userbase.
Static vs Dynamic Avatars
A static avatar is easy to create. Static avatars are usually an arrangment of several shapes.
Dynamic avatars (animated) are more complex. They require either pre-rendering the animations into gifs or movies.
The thing that interests me most about Dynamic avatars is the wider range of emotion that can be displayed. When a reader loves something it can for instnce be animated to smile. Lots of other fun concepts become possible as dynamic avatars are incorporated into an application.
For me, I plan on releasing at least one animated avatar to see if kids find it useful and engaging. However, the added complexity makes this a future feature that will have to wait a week or two after release.
The Use of Color
Color in an avatar is very important. Because color can be affected by a persons preference, inconsistencies in color reproduction across multiple devices, and a persons mood it is important to provide avatars for the entire range of color and, by extension, mood.
My original character design motif started with two-tone color palette. I used one dark color and one light color. Unlike a full color palette a two-toned color palette provides extra constraints because of the importance of negative space.
The line of reasoning I had was that a lower color count paired with an abstract character may provide more illustrative ambiguity but hopefully more emotional engagement.
After designing several of these two-toned characters, I did not observe a major change in level of emotional engagement across my two readers. However, I did find was that color preference and variety matters most for the reader that likes changing their avatar frequently and less for the type that has self identified with a particular avatar.
The Effect of Shape
Shape plays a critical role in how we perceive avatars. There are two common shapes for avatars: square and circle.
The square avatar has been commonly used for over a decade. Facebook, Twitter, and almost all social networks utilize the square pattern.
In 2012 there was a design trope that used a circle mask to cut out a person's face. This is still in use today and is helpful for driving attention to the face. The obsuring of the background drives a user to want to click on and see where the person was located when the picture was taken.
When you introduce character avatars into a system those characters are often merged into other graphics, background scenes, print collateral, and launch screens. These scenes provide a way for the characters to live outside of their bounding box. Square or circular bounded avatars then function as a reference for the user.
I am still unsure if embedding characters throughout the designs increases emotional connection. However, for the observant user they may find joy knowing that their character can be seen hidden at the edge of a design.
Curated vs Customized
Ideally you would believe that if an avatar provides user engagement and emotional connection, then a feature offering customized avatars would provide the most. One great example for highly customized avatars is the Nintendo Wii Mii. These Miis are generated on the Nintendo Wii console. They were also allowed to be "transported" and brought to a friends house so you could both play against each other. The success of the Mii is a strong vote of confidence that Customized avatars provide the most emotional engagement.
I recently found a font called The Face by Rory Harnden that provides an entire avat system within a single font. The designer used ligatures to make placement of each element. The elements start off simple, but as they are combined they become complex and very expressive and detailed.
If there is enough time for developing this sort of feature, then providing a customizable avatar can provide an extreme level of emotional engagement. However, in a pinch a selection of simple curated avatars is still a valid way to provide engagement.
The biggest challenge for an independent developer is the limitation on time and resources. For this reason I am providing only a curated list of avatars. However, in the future I plan on expanding and offerring more customization.
The First Batch
I drew a dozen and a half avatars using Sketch 3. Most are doodles, simplified designs of iconic characters, animals, and other creatures. My hope is to add more as time goes by maybe even releasing them seasonally.
Here are 3 based on the ones provided by Netflix.
