Re: Dynamic Avatar
Posted: Wed Feb 01, 2012 7:13 am
I would assume it is probably done with some CSS techniques since it is probably not HTML5 Canvas. I particularly believe that considering that the avatar creation interface they show in the images is quite old looking, with buttons to move the clothing articles around rather than using drag-and-drop.
You may be able to find some tutorials online by looking up things like "web paperdoll", as that is basically what this is. You could also potentially build whatever avatar-building application you want as an HTML5 Canvas app, and then use the code I posted on how to turn the canvas state into a bitmap and send it back to the server to store as a file, which could then be used from the server-side on subsequent page views. Of course, to make the avatars editable, you would also have to store the state of the canvas, although that would not be too bad. But using canvas for the avatar app in the first place would probably simplify things since you can really do anything graphical you want in canvas without having to resort to strange CSS tricks.
You may be able to find some tutorials online by looking up things like "web paperdoll", as that is basically what this is. You could also potentially build whatever avatar-building application you want as an HTML5 Canvas app, and then use the code I posted on how to turn the canvas state into a bitmap and send it back to the server to store as a file, which could then be used from the server-side on subsequent page views. Of course, to make the avatars editable, you would also have to store the state of the canvas, although that would not be too bad. But using canvas for the avatar app in the first place would probably simplify things since you can really do anything graphical you want in canvas without having to resort to strange CSS tricks.