Thanks to

To view the 3-D graphics in this article, you will need to download the newest Shockwave player.

In the past year or so, you may have heard about a new technology that lets you manipulate 3-D images over the Internet. Many Web sites have been using this sort of software for a while, but it has mostly remained a niche market due to a lack of universal 3-D viewer programs. Macromedia, in conjunction with Intel, NxView and others, hopes to bring this technology to many more Web users with the newest versions of the Shockwave player and the Shockwave authoring program Director.
But what does all this mean? In this edition of HowStuffWorks, we'll find out exactly what Shockwave 3-D technology is and how it works. We'll also explore some applications of the new technology and check out some very cool 3-D images.


If you spend much time on the Web, you have probably encountered Shockwave, a graphics format for animation and interactive presentations. Shockwave files are created by a program called Director, which was originally developed for CD-ROM use. The format is very popular with webmasters because it allows them to create elaborate Web content that can be transmitted fairly quickly over the Internet. See the HowStuffWorks Animation Tour for lots of cool examples of work done in this format.


A typical 2-D animation that might be created with Shockwave
In previous editions of Shockwave and Director, Web artists could create only 2-D animation. Two-dimensional animation comes in two forms:

• Frame animation is something like classic cartoons -- you see movement as a series of 2-D still images shown in a set sequence. Your viewpoint is set by the movie's creator.
• Vector animation uses 2-D objects (circles, squares, lines) that move with respect to one another. Since it is based on simple geometric equations, vector animation allows artists to create complex movies that have very small file sizes.

Check out How Web Animation Works to learn about previous versions of Shockwave and its cousin, Flash.
The newest edition of Director incorporates Intel Internet 3-D technology developed by Intel Architecture Labs. The program allows Web artists to create interactive 3-D animations and post them on the Web. The newest version of the Shockwave player allows most Internet users, even ones with dial-up connections, to view these intricate animations.
With Shockwave 3-D technology, users can actually download and manipulate 3-D models themselves -- they can become the director and move the camera. There are two ways to think about this:

• You can download an object and rotate the object in front of the camera to see it from different perspectives.
• You can download an environment and move the camera through it. This is basically the same thing you do when you play a first-person video game. The program puts you in a virtual 3-D world, and you control a "camera" in that world by way of your movements. You tell your camera to move left or right, forward or backward, through the environment.

Based on your actions, the computer draws a new frame of the scene from your new, slightly different perspective.

The same object viewed from two different perspectives.

This is a pretty complex operation: 3-D software must receive input from the user, interpret this input and decide how to redraw the image to create the desired sense of motion. When you're playing a game, your computer or game console can handle this fairly easily, but things get a lot trickier when you're sending this information over the Internet. Additionally, standard Web browsers are not automatically equipped to handle these models, which means that not everybody can access 3-D content. Macromedia's newest Shockwave player is designed to get around both of these problems, allowing most Web users to access 3-D files easily. In the next section, we'll see how the format and player manage this feat.


Adding 3-D to Shockwave enables access to all sorts of new Web content. One of the most obvious applications is Web-based 3-D gaming. First-person adventure games and other games with fully realized 3-D worlds have dominated the PC and game-console market for almost a decade. The new Shockwave capabilities allow this sort of game to be played over the Web. Web-based 3-D gaming is getting a lot of attention, but it is only one market for the new technology. 3-D capability is perhaps better suited for advancing e-commerce. Web merchants can give their customers a much clearer idea of products in their catalog if the customers can see the product as a 3-D image. With 3-D models, online shopping is a little more like in-store shopping -- customers can rotate the item around, checking it out from every angle.

A 3-D model used to demonstrate a product on an e-commerce site

Customers can also modify 3-D models for their own particular needs. One of the most useful applications for this is clothes shopping. If an online shopper enters his or her measurements, the 3-D software can generate a model of that person's body, which can be "dressed" with 3-D models of particular clothes. This is a virtual version of the real-world dressing room.
This level of user interactivity is also a great addition to educational sites like HowStuffWorks. A 3-D model of an engine that you can turn around and interact with can offer a much clearer illustration of the mechanisms at work than a 2-D model -- it's more like actually handling and examining the engine yourself.



This 3-D model of a paintball gun makes it extremely easy to understand how paintball and BB guns work. Click on the image above to see the model. For example, if you want to understand how a paintball gun works, a 3-D model can be incredibly useful. You can see exactly how the mechanism fits together and fires. Click here to see a 3-D model. If you want to learn more about paintball guns after seeing the model, see How Paintball Works.

As a demonstration of the new Shockwave 3-D technology, NxView has created this 3-D model of a four-speed manual transmission.

In all of these applications, the most significant benefit of 3-D is greater user involvement. You can decide what you want to look at instead of just viewing a pre-set movie. The difference is comparable to the difference between watching television and playing a video game.
To see more examples of Shockwave models, check out:

• NxView's 3-D gallery
• Intel's 3-D gallery

In the last section, we saw that Shockwave's new player is a new format for creating and viewing interactive 3-D content on the Web. The idea of posting this sort of content on the Web is nothing new, but technology companies and Web sites haven't had much luck in bringing 3-D to a lot of viewers. There are two main reasons for this:

• It takes a long time to transmit 3-D "movement" over low-bandwidth connections.
• You often have to download a new plug-in every time you want to view another site's 3-D content.

The new Shockwave player specifically addresses these obstacles, so it could finally make 3-D content a significant component of the Web. The majority of Web users already have the Shockwave player installed and would only need to download the most recent update to add 3-D capabilities. Macromedia has set up partnerships with many Web companies in order to get people using its technology. Previously, Macromedia has had a lot of success with both Shockwave and Flash formats because they work well with all of the main browsers and are easy to install and update. Intel, NxView and other companies partnered with Macromedia because the company has a good track record with disseminating its player technology.
The new format is specially designed to work well with all bandwidth connections, even connection speeds as low as 28.8 kilobytes per second (KBps). It does this in a couple of ways.
When you view 2-D animation on the Web, the Web site sends each successive frame to your computer. In this way, everything in the animation must be transmitted over the Internet individually. In Shockwave 3-D technology, the Web site sends you a complete image only once. Then, when you want to move the image, the site only sends the bare-bones information necessary to make the desired move. It tells your computer how the outer wire frame should be adjusted, and your computer does the rest of the work to fill in the polygons and textures.
Most personal computers made in the past five years have processors designed to handle the complex 3-D worlds of advanced video games, so they are well-equipped for the job. By relying mostly on the power built into the client machine (your PC), there is much less information that needs to be transmitted from the server machine (the computer storing the Web site). The only hefty download occurs when you bring up the initial image. After that, the site only has to transmit mathematical adjustments, which don't require extensive bandwidth.
But what about this big initial download? Shockwave's new player addresses this problem with something called adaptive 3-D geometry. Adaptive 3-D geometry is a collection of complex algorithms that automatically scales a 3-D model for a particular Internet connection. If you have a slower connection, the Web site transmits an image with simplified textures and fewer polygons. If you have a faster connection, you receive a more complex image.

A simpler 3-D model has fewer polygons. This hand is composed of only 862 polygons.

To create a more detailed model, you have to add more polygons. This hand is composed of 3,444 polygons.

With these elements, you should be able to access 3-D content no matter kind of Internet connection you use. But how does somebody make Shockwave 3-D content themselves? In the next section, we'll find out what goes into producing a Shockwave 3-D animation and see how webmasters can put 3-D content on their site.

Check This Out! As a demonstration of the new Shockwave 3-D technology, NxView has created this 3-D model of a four-speed manual transmission.

We had the opportunity to speak with Miriam Geller, Macromedia's senior product manager for Director and the Shockwave player. To create a 3-D object like the automotive transmission in the example shown above, you use three different tools:

1. You use a standard 3-D modeling package to create the 3-D object. For example, you might use 3D Studio Max or Maya. With these tools, you create the wireframe image and specify the polygons that cover the wireframe (see How 3D Graphics Work for details). You export from the 3-D modeling package using a new .W3D file format.
2. You load the .W3D file into the Macromedia application called Director Shockwave Studio. This application helps you prepare the 3-D object for distribution on the Web. For example, you can:
   
   • Apply different techniques, such as a multi-resolution mesh or subdivision surfaces, to limit the amount of bandwidth or processing power needed by the 3-D object on the user's machine.
   • Add user-interactivity features. For example, you can make different parts of the 3-D object move in response to user requests.
   • Add effects, such as fog or rain, to the object.
   You export a normal .DCR file from Director Shockwave Studio and place it on the Web server.
3. The user then downloads and views the .DCR file using his or her browser and the Shockwave player (version 8.5 or higher). [See, for example, this example of a .DCR file, which shows a 3D model of a paintball gun.]

This is not a trivial process, but for someone already familiar with 3-D modeling using a program like 3D Studio Max, it's a straightforward extension.