This page shows you the process for creating your own custom avatar in Being-There. It assumes you have experience with computer graphics tools such as
![]() Jasc Paint Shop Pro 6.01 (at Amazon.com) | or |
![]() Adobe Photoshop Limited Edition 5.0 (at Amazon.com) |
This page illustrates the use of Paint Shop Pro only. To create your own avatar, follow these steps:
Now Launch Winzip, and select menu "File -> Open Archive" to open your avatar file, When you get the Open Archive dialog, change the bottom field "Files of Type" from "Zip Files" to "All files (*.*)", Navigate to the "Avatars" directory and open your avatar file (my.avt or whatever you named it in the previous step). Now extract the single bitmap file (file ending in .BMP) contained in your default avatar, and save it in any convenient location, such as you desktop. You will be using this bitmap to get the correct palette for Being-there bitmap files.
Next, use your graphics file editor (Paint Shop Pro, in this example) to open the .BMP file you just extracted with WinZip. You should see the avatar with a black background.
When we build avatars, our background color should also be that same black color, but for now we want to change the background color to hot-pink, or some other color that is unlikely to be found in our custom bitmap graphics. First, select the menu: "Colors" -> "Edit Palette...".
| Your Being-there palette should look like the one on the left. Currently, all graphics in Being-there use this palette, In future versions, we plan to support 32-bit color, and your own optimized 8-bit palettes for each avatar and 3D texture graphic. Now, we are going to change the first color on the palette (circled here in red), on the top-left corner, from black to hot pink. Double-click on that color, and you will see the "Color" dialog box |
| In the "Color" dialog box, click on the hot-pink color, shown here in the red circle, and click the "OK" button. Next, click "OK" to the "Edit Palette" dialog. If you succeeded, the avatar should now have a hot-pink background. |
Next, use Paint Shop Pro to open your own graphic file that you want to use as the basis of your avatar. This can be in any of the wide range of bitmap file formats supported by Paint Shop Pro.
Now, to prevent yourself from damaging your original graphic file, use the menu "File" -> "Save As..." to save a copy of the graphics file. in the "Save As" dialog box, Navigate to the "Avatars" directory. Then change the field named "Save as type" from the current type, to "Windows or OS/2 Bitmap (*.BMP)". Give the file a new name such as my.bmp.
Now use menu "File" -> Save" to save the changes to my.bmp.
The graphics below shows the result of saving a graphic (jpg) (on the left) with the Being-there palette (on the right). In this case, we used "Nearest Color matching". As you can see, some distortion is unavoidable.
|
|
| Original graphic in .jpg format | Graphic adapted to the 8-bit Being-there palette |
|
Now we need to trim the graphic to remove extra background, and resize
the graphic to fit the Being-there 3D world.
To Trim the graphic, select the "Crop" tool Now, select menu "Image" -> "Crop", and your image should be trimmed of excess background material, as shown on the left. |
|
Next, we need to resize the image to fit the 3D world. Avatars
should be 256 pixels tall and either 128 or 256 pixels wide.
The smaller the better, and in most cases, we can use 128 pixels
wide. Select Menu "Image" -> "Resize" and you will get the "Resize"
dialog shown on the left.
We want to leave the avatar as large as it can possibly be, within the constraints above. In addition, we need to leave space at the top for the nickname label (approximately 36 pixels high). Therefore we are selecting 220 pixes high. |
| The resulting image, on the left, has lost much of the original detail. To some extent, this is unavoidable, though we could minimize this by creating an avatar with a larger resolution cut of the image, for example, from the head down to the waste. If we had artistic talent, we could also touch-up this image with the paint tools provided by our image editing software. |
|
Next, we need to increase the background canvas size (without changing our
image resolution) so that the entire
image is exactly 256 pixels high and 128 pixels wide. We also want to leave
enough empty space at the top of the image for our nickname label.
Use menu "Image" -> "Canvas Size...", and you will get the canvas size dialog shown on the left. Set the "New Width" to 128 (or 256), and set the "New Height" to 256. Select "Center Image Horizontally". Change the "Bottom" field to 0 (if you want the avatar standing on the ground), and the "Top" field will automatically adjust to whatever is left. |
| The resulting image should look something like the one on the left. The background color may be different,depending on the current background color setting on Paint Shop Pro. This doesn't matter, because it will be easy to paint this solid area of background to hot pink in the next step. |
Here, we can see that the nickname label does not cover the face, and that the users see the avatar at approximately the correct eye level. After you know that this is the right image, begin the next step of changing all the background pixels to hot-pink, and converting that hot-pink color to pure black required for transparent pixels in Being-There.
Next, we need to color the background hot-pink. There are three techniques that we have found to work at various times, namely "Paint Brush", "Color Replacer" and "Flood Fill". We will illustrate Paint Brush first, because it is the simplest and often the only technique that works.
,
and select "Hot Pink" for the foreground
color.
|
Don't use just any hot-pink, but use
the hot-pink that is palette color index 0 on our Being-there
palette. Click on the foreground color .
You should see
the Being-there color palette shown on the left. Verify that the top-left
color is hot pink, and that you have this color selected as your foreground
color.
|
|
Next you can use the tools available in Paint Shop Pro to paint all of
the background pink. The simplest and often most effective tool for
this is the Paint Brushes tool that we have selected. First use the
"Controls Tool"
to set the proper attributes for the paintbrush, as shown on the left.
In the "Tool Controls" tab (not shown), set the "Paper Texture" to none.
Then in the "Brush Tip" tab, set all of parameters as shown on the left.
In particular, be sure to set "Opacity" to 100, because it can be very
frustrating when you are trying to cover all pixels with one color, but
your paintbrush is behaving like an air brush. As you get closer to the
edge of your foreground avatar image, you may need to set the "Size"
parameter smaller, so you can paint one pixel at a time, if needed.
|
| Painting the background would be unbearably frustrating except for the fact that Paint Shop Pro has a neat feature for multiple brush-stroke level "undo's". You can undo and redo one paint stroke at a time, and go many levels back, as long as you haven't saved the file since your mistake. To activate this feature, use the menu "File" -> "Preferences" -> "General Program Preferences...", and set the parameters as shown on the left. In particular, check the box "Update undo buffers for each brush stroke". |
|
Next, simply (but tediously) paint the background hot-pink. Notice that as you get close
to the edges of the avatar image, you can use the Zoom Tool
to magnify
(left mouse-click) or demagnify (right mouse-click) the image.
When you are done, the image should look like the one on the left.
Then, simply redefine the palette color 0 from hot-pink to black (r,g,b
= 0,0,0). To do this, use Menu "Colors" -> "Edit Palette",
double-click on the top-left color, and set that color to pure black.
Then, the image should look like the image on the right.
|
|
Finally, save the image to a .BMP file (not a .gif file like this web page uses). The .BMP file format is necessary because, at this time, Being-there does not know how to load avatar images in .gif format. This is not a big problem, because after the file is compressed into the .avt archive file, the two image formats result in approximately the same size archive file.
The "Color Replacer" tool
works on the premise
that whenever it sees one color, it is going to replace that with another
color. It refines that technique in two important ways:
To use the Color Replacer tool, set the foreground to the "Hot Pink" color
as described above in the Paint Brush Technique. Then
set the (Paint Shop Pro) background color to the color outside the edge
of your avatar - in the background image. To do this, use the
"Dropper Tool"
and right-click on the background
pixels that you want to replace. Then click back to the Color Replacer
Tool and begin painting the edges of your image.
Note, that this technique does not work effectively where the color of the image is very close to the color of the background. In those cases, you sometimes must guess at where the edge of the image should be. It also does not work effectively where there is tremendous variability in the background colors. In either of these two cases, it is more efficient to use the "Paint Brush Technique" described above.
to fill all pixels in an area
that have the same or similar color with a different color. If you are lucky
enough to get a bitmap with a solid background color, then select the
Flood Fill tool and set the foreground
color to hot-pink, and simply click once anywhere
on the background color. You will
instantly change the entire background to hot-pink, with pixel-level
accuracy. The problem with this technique is that it is rarely of much use
if the background has varying colors. This can sometimes be overcome by
increasing the "Tolerance" for this tool, but more often it is of no value
in this situation.
First, re-open the avatar we made at the beginning, my.avt, with WinZip. If this was the default avatar file, you will see one *.bmp file, and another file named "avatar.ini".
Delete the old bitmap from the archive by selecting that file, and hitting the "delete" key or the menu item "Actions" -> "Delete..." When the Delete dialog appears, select "Selected Files" and hit "OK".
Now add the new .bmp file to the archive with the "Add" button.
Now double-click on the "avatar.ini" file in the archive. If this file is not associated with any program, associate it with "notepad.exe". In notepad, you will see a file something like this:
[General] autogen_angles=1 slab_thickness=20 back_color=16711680 nframes=1 nangles=8 [Bitmaps] bm1_1=oldfile.bmp bm2_1=bm2_1.bmp bm3_1=bm3_1.bmp bm4_1=bm4_1.bmp bm5_1=bm5_1.bmp bm6_1=bm6_1.bmp bm7_1=bm7_1.bmp bm8_1=bm8_1.bmp |
bm<angle#>_<frame#>
Where the "angle#" is from (1 to nangles) and and "frame#" is from
(1 to nframes). The file names should all be provided, even if those
files do not exist (as in our example, for all angles except one).
If the files don't exist, then those file names will be used when
the system automatically generates the bitmaps for the other angles.
Therefore, those file names should be unique for angles whose images
are to be unique.
However, it is not difficult to create an avatar that looks much more three dimensional. These avatars are composed of photographs or drawings from each of 8 angles (45 degrees apart). Look for avatars in your distribution with the digit "8" in the .avt file name, and you will see that these are composed of 8 discrete bitmaps.
To make your own avatar with 8 bitmaps, make a copy of one of these avatars, and give the copy your own file name, lets say my8.avt. Now open the file with WinZip, and you will see 8 *.BMP files and one avatar.ini file. The avatar.ini file will look something like this:
[General] autogen_angles=0 slab_thickness=5 back_color=50 nframes=1 nangles=8 [Bitmaps] bm1_1=oldfile.bmp bm2_1=bm2_1.bmp bm3_1=bm3_1.bmp bm4_1=bm4_1.bmp bm5_1=bm5_1.bmp bm6_1=bm6_1.bmp bm7_1=bm7_1.bmp bm8_1=bm8_1.bmp |
This vulnerability to avatar file errors is a much bigger problem if you are online. Each of the other people in the chat room will receive a copy of your avatar, and they could all crash!
Until we make the software more tolerant of avatar file errors, it is very important that you test your new avatar files offline, that is, before you hit the [Connect] button.
You can look at your new avatar by lauching "Being-there", and moving to the camera in the back of the room. The "camera" is a small prop that is supposed to look like a security camera near the ceiling. It has a small red dot on it, and a picture of a lense. Click on this camera, and you can see yourself from the camera's viewpoint. When you are done looking at your avatar, click on it, and you will go back to seeing the room from your own personal perspective.
Therefore, whenever you make any change to your avatar, no matter now small,
you must change the avatar name. It doesn't matter what name you choose,
though unusual names are more likely to be unused by other people's avatars.
This must be done with each revision that has been seen by other
people online.