3D Flash Sprites

While Shockwave3D can bring a strong sense of realism to your next gaming project, I've found that a "cartoony" look works just as well and requires a lot less production overhead if you have any kind of skill with Flash.

Moreover, you can use Flash members to generate your textures for 3D without too much trouble or file size costs - an excellent solution for billboards and overlays. You can even animate these Flash-based images as "sprites" inside the game world as billboards. This article shows you how.

Using Flash for Textures

The first step is figuring out how to effectively use Flash members as a source for your 3D textures. Here's how it works:

• Create your graphic in Flash. As of this writing, the Flash 8 Xtra isn't ready for prime time yet, and certainly doesn't have a wide install base, so I prefer to use only features from Flash 5. That means no complex fills, blur effects, etc., but you can do the all-important alpha channeling.
• Feel free to have multiple frames in the movie. This is great for things like billboard character walk cycles, different status graphics, etc.
• For your document size, make sure it is a power of 2 in each direction so that you don't have to do any resizing when you grab the image.
• Choose a background color that meshes well with the outside of your object, typically black, especially if you have black character outlines. That way, when Shockwave3D interpolates color, you have the correct color "halo" around your character. White, in particular, looks bad in most cases.
• Open up the "Publish Settings" menu item, and set it to only publish a .swf file. Choose an appropriate location as desired. Click over to the .swf export settings tab, and set the .swf to be published down to Flash 5. This will ensure that most Shockwave players can render the image. (If you get a message that some features are not available in Flash 5, redo your gradients or other offending items so they are simpler, Flash 5 content.)
• Publish the .swf file and import it into your Director project.
• To create a texture with the .swf file as the source, simply: theTexture = theWorld.newTexture("name",#fromCastMember,member("the_swf")) (You could alternately use the #fromImageObject method and refer to member("the_swf").image.duplicate().)
• If you want something other than the first frame of the .swf, you need to set the posterFrame property of the .swf member, like so: member("the_swf").posterFrame = 4 Once you do this, you can either create a new texture with it or replace the image of an existing texture by doing this: theTexture.image = member("the_swf").image.duplicate()
• Depending on your graphic, you will probably want to set the texture to have smooth edges by setting the proper renderFormat: theTexture.renderFormat = #rgba8888

...and that's all there is to it! This allows for very efficient storage of your graphics, and an interesting look for your billboards and overlaid interface elements.

A Note about Memory

One thing that may come into play when you use Flash-based sprites is the fact that once you set their posterFrame property, they can no longer be unloaded from memory. This is because setting the posterFrame is essentially a destructive process (like setting the image property of a bitmap cast member), and so cannot be unloaded lest the changes you made to the member are lost.

For small projects, or for projects with only a few Flash objects, this is not a problem, but if you have many Flash members that are storing imagery, it will essentially act like a (finite) memory leak.

There is a way to circumvent this problem. You can duplicate() the Flash member, set the duplicate's posterframe to grab the image, and then erase() the duplicate. Here's the code:

-- Returns the image of a flash member without locking the flash member in memory on getFlashImage theMember, thePosterFrame -- We can accept either a literal member reference, a string, or a number. if (theMember.ilk = #member) then m = theMember else m = member(theMember) -- Duplicate the member, and set its posterframe theTempMember = member(m.duplicate(), m.castlibnum) theTempMember.posterframe = thePosterFrame -- Grab the image i = theTempMember.image.duplicate() -- Erase the temporary member theTempMember.erase() -- Unload the original member m.unload() -- Return the image return i end getFlashImage

The price you pay for being able to unload the member, however, is that you must be duplicating and erasing members in memory, which isn't so efficient. The above code will give you a general use solution, but is unnecessarily heavy if you're going to be grabbing many frames from a Flash member in succession. In that case, it's probably better to write your own loader using the above strategy for avoiding locking the Flash member into memory.

Creating Billboards

Now that you can use Flash members to create textures, you can now use them as overlays and textures on objects. One cool trick is to use Flash-drawn characters or other objects inside a 3D scene.

To accomplish this, we need to create a billboard, which is a simple plane with our Flash (or bitmapped) texture on it, and have it always face towards the camera.

Here's a sample parent script that creates a billboard and displays it:

-- Billboard property sID -- auto-incremented ID property pBillboard --- the billboard model property pCamera -- the camera to track -- Constructor. -- Pass in: -- theTexture: the Texture to place on the billboard -- theWorld: the World to put the billboard in -- theCamera: the camera to point at -- theWidth: the width of the billboard model -- theHeight: the size of the billboard model -- thePosition: where to put it -- theParent: (optional) a node to parent the billboard to -- Pass in the texture for the billboard, and the "world" to create it in. -- Optionally, pass in a parent node and a position. on new me, theTexture, theWorld, theCamera, theWidth, theHeight, thePosition, theParent -- Since models need unique names, we auto-increment an ID me.script.sID = me.script.sID + 1 sID = me.script.sID pCamera = theCamera if (voidp(theParent)) then theParent = theWorld.group("world") -- First, get the billboard resource. We only use one for all billboards. res = theWorld.modelResource("billboard.res") if (voidp(res)) then -- Resource not found. Create it. res = theWorld.newModelResource("billboard.res", #plane, #front) res.width = 1 res.height = 1 end if -- Create the billboard modelname = "billboard_" & sID pBillboard = theWorld.newModel(modelname, res) pBillboard.shader = theWorld.newShader(modelname & ".shd", #standard) pBillboard.shader.texture = theTexture pBillboard.parent = theParent pBillboard.transform.scale = vector(theWidth, theHeight, theHeight) pBillboard.transform.position = thePosition me.stepFrame() return me end new on stepFrame me -- Billboards should always face the camera pBillboard.pointAt(pCamera) end stepFrame

After you initialize this object, you can send it #stepFrame events to get it to constantly point at the camera - you can do this either by adding it to the actorList or by manually issuing the command every frame.

This is, of course, just the shell for a real 3D sprite object. You will probably want to add methods for moving the billboard around, changing its size, etc.

Also, depending on what you want, you may want to set the following settings in the Billboard code:

pBillboard.shader.emissive = rgb(255,255,255)

This will make your Flash texture look exactly like your Flash file, regardless of the current lighting situation. Good for interface elements.

pBillboard.shader.shininess = 0

You probably don't want a reflective sheen on your billboard.

pBillboard.shader.specular = rgb(0,0,0)

You probably don't want a reflective sheen on your billboard.