Avatar Configuration Tool

Pre-configured Avatars

We need 15 male and 15 female pre-configured avatars. Each of the 15 should have different body shapes and should have an equal distribution among the races available. For each of these 15 avatars, we need to select viable "outfits" - combinations of clothing, accessories, hair styles, facial hair and glasses with an appropriate range of colors for each. Randomizing the outfits will give us many more than 15 differentiable avatars.

Avatar Configuration Tool

Basic Configuration

NOTE: The "avatars" pictured in this mockup are photos of real people and are not indicative of what the actual Wonderland avatars will look like.

When a new user logs into Wonderland for the first time, they are presented with the Avatar Wizard. This wizard can be accessed any time in the future from a menu. For new users, the first screen of the wizard looks like this:

This screen selects one female and one male avatar from the set of pre-defined avatars. From this screen the user selects gender:

From here, the user can decide that the random avatar is fine and close the wizard by selecting "Done for Now." If the user wants more choices, they continue on to the next step by clicking the "More Choices" button. In this pane, the default avatar from the first page is selected and 5 additional choices are presented:

The user can click on the text "More pre-configured choices" to see another set of 5 avatars. Each time this screen is drawn, the clothing, hair styles and outfit components are randomly selected. In this scenario, the user selects one of the 5 choices:

The user can either decide that this choice is fine, or they can click "Customize" to configure their avatar. Here the user has opted to customize and has selected the "Shirts" item in the "Clothing" category:

Although all the shirt styles look identical in this illustration, imagine that each style was different. To increase variation in clothing, as many clothing patterns as possible should be two tone so that users can customize two colors rather than just a single color. Color can be changed by clicking on the color chips. This will bring up the standard Java color picker. The color is changed in all the shirt styles. For skin color and hair color, we will need to provide a palette of color chips to choose from. I suppose we can also let people choose any color if they're feeling like a pink hair day, but we should make it easy to select "normal" skin and hair colors.

The rest of the hierarchy looks like this:

• gender
• skin color chooser
• body shape (15 choices) plus height slider
• hair styles and hair color chooser
• facial hair styles and hair color chooser
• glasses and color chooser
• clothing and color chooser
  • shirts
  • pants
  • dresses (hide when gender is male?)
  • skirts (hide when gender is male?)
  • hats
  • shoes

Advanced Configuration

These controls modify the meshes, for example, changing weight, arm width, neck thickness, etc.

Reference Art

Clothing Ideas

Male

Female