This section covers the tools and capabilities Dreamweaver offers the multimedia developer. Before delving into the details of how multimedia works in Dreamweaver, however, you need a good understanding of what multimedia is and how it fits into web design. This chapter discusses what multimedia is, how it exists on and off the web, and what purposes it serves (and doesn't serve) as part of an onscreen presentation.
As its name indicates, multimedia means using multiple kinds of media text, graphics, animation, video, music, narration to communicate. However, it's more than that; after all, going to the movies can involve multiple media, but it's not a multimedia experience. Multimedia implies interactivity as well. Audiences become users. They click things, roll over things, make choices, move things around, ask and answer questions. The focus is on the experience, and the experience is nonlinear, directed by the user.
Seen from this perspective, all web sites partake of multimedia to some extent. Even the simplest web page usually has at least a few pictures and some text; users click links to navigate through information structures. Presentation becomes nonlinear, user-directed. Normally, of course, when reference is made to multimedia, you think of something fancier than this, with more complex interactivity and a broader range of media elements. Just don't forget that it's not an either/or situation "yes, I will use multimedia," or "no, I will not." It's a continuum, involving how complex you want your interactivity to be, and how many different media types you want to use.
Back before there was the World Wide Web, multimedia presentations were distributed on CD-ROMs, they were presented on kiosk computers, they were even delivered on floppy disks and shared across networks. Life was a lot simpler then, because presentations existed in much more controlled environments than they do today.
Because multimedia includes interactivity, a presentation in those days had to be created in an authoring environment, using a scripting or programming language to encode its instructions; the final presentation functioned like a piece of software, interpreting the coded instructions as the user interacted with it. The authoring environments were programs such as Director and Authorware, which had the capability to collect and control various media types, and which had their own internal scripting languages (Director's Lingo, for example) to create the interactivity. These programs generated presentations as standalone applications, also called projectors or players, which were then burned onto CDs or otherwise distributed to their audiences or installed onto public kiosk computers. The user didn't need any special software to run a multimedia presentation, because the presentation itself was the software. Just pop the CD in the drive, launch the executable or application file, and you're off to the races.
Figure 15.1 shows a flowchart of the development process for creating a multimedia presentation using authoring software such as Director. Resources are collected, interactivity is programmed in, and the final presentation, in the form of a projector, is produced.
With the advent of the web, everything changed. Instead of delivering entire mini-applications containing interactive presentations, the web relies on the user already having certain software (that is, a browser) on his computer. Web multimedia presentations consist of a collection of media files along with instructions for the browser to use in building the final, functional product.
The main problem with this scenario is that browsers were not intended for this purpose. Browsers are HTML interpreters, and HTML is a markup language, not a scripting language. Browsers can display images and text, but no other media types. Various solutions have developed to address this problem, including the following:
Note that you don't have to stick entirely with one particular technology, even within the same page. Your job is to choose the best tool for each individual task. Figure 15.3 shows a web site (www.macnabdesign.com) that mixes Shockwave, animated GIFs, DHTML, and even some Java to create its various elements. The cascading menus on main pages are created from DHTML. The logo and other artwork showcase sections are Shockwave. The magnetic poetry game is a Java applet.
It isn't enough to know how to put multimedia elements on your web pages. You also have to know why. What are all those bells and whistles doing there, and are they worth all the fuss? You have probably visited web sites where animations, background music, or fancy bits of interactivity were detrimental to the web experience, instead of being a constructive part of it. Because of this, some pundits consider multimedia the enemy, with no useful place in good web design. This isn't true. Multimedia isn't suitable for all web sites; however, if used wisely, it enables you to take full advantage of the possibilities of web communication. Your job, as a web designer, is to be clear about what purpose multimedia is serving in your web pages, so you can determine when to use it, how to maximize it, and when to leave it out.
Sometimes, you just need media. If the purpose of your web site is to sell music or advertise movies, obviously it's appropriate to have audio or video content (see Figure 15.4). It's also important to have enough interactivity that users can navigate through the content, can start and stop playback, and can maybe find and isolate favorite portions for playback.
The old writer's adage tells that it's better to show than to tell. Web authors also know that people don't like to read long chunks of text onscreen. Complex processes and structures can often be more clearly conveyed with a simple animation than with endless paragraphs, charts, or still pictures (see Figure 15.5). Virtual panoramas and 3D models can convey detailed product and location information much more quickly and efficiently than still pictures, text, or diagrams (see Figure 15.6). A narration is often less distracting as an explanatory accompaniment than yet another text block cluttering up the screen. All of this is subject to bandwidth considerations, of course. When it comes to showing, rather than telling, however, multimedia is often the most efficient means to the end.
For more examples of multimedia in action, visit the virtual chemistry lab at Oxford University (www.chem.ox.ac.uk/vrchemistry); take an armchair tour of Japan's castles (castle.ad-g.tv/); virtually climb Denali (www.pbs.org/wgbh/nova/denali); watch an animated explanation of cloning, or a 3D virtual-reality view of the space shuttle (www.cnn.con/interactive).
Things that are moving draw our eyes. Things that are making noise catch our attention. Anybody who's suffered through the annoyance of endlessly blinking, spinning, or throbbing ad banners at the tops and bottoms of commercial web pages knows this. Drawing attention doesn't have to be a bad thing, however. It's a well-established principle in graphic design that a layout should lead the reader's eye, drawing attention as needed to different elements on the page. The same is true in multimedia design. You can use movement and sound to help guide the user through a set of information the same way graphic designers use contrast, size, and placement (see Figure 15.7).
Leading eyeflow can be especially useful in linear instructional presentations, such as tutorials, where it's crucial that the viewer follow the activity as it unfolds (see Figure 15.8). The animation starts when the user clicks the "show me" button, when presumably his eye is focused on the button. (To view this movie, look in the chapter_15 folder on the CD, and browse ShowMe.html, which uses the embedded media file aftershock.dcr).
This is probably the most overused and least thought-out application of fancy stuff. However, it's still an important and valid use, in its place. The key decision you have to make before adding this kind of multimedia is, do your visitors want to be entertained? Give them plenty of opportunities not to be entertained, if they just want to head straight to the meatier parts of your web site.
This is the lowliest, and yet probably most widely applicable, use of multimedia. Feedback tells users what to expect from a presentation. It lets them know the presentation is interacting with them. Cursor changes and rollover effects draw attention to links and let the viewers know that these are links. If a button makes a "click" sound or changes color when a user clicks it, the user knows the computer has registered that mouse click and is processing the request. (This is especially important when slow connections or overloaded servers might take several seconds to process a user request.) A cascading, expanding, or drop-down menu can provide a graphic overview of a web site's complete navigation structure in one easy-to-read information screen.
Figure 15.9 shows various examples of this use of multimedia. Pictured here, the Yale University home page fits numerous menus and submenus into one clean interface, using cascading menus (www.yale.edu).
Before you can use multimedia wisely in a web site, you need to be clear about the purpose of the web site. Different kinds of sites, with different target audiences, call for different approaches. Following are some of the different web purposes that can benefit from rich multimedia, and suggestions on how the whole package fits together.
Obviously, if your web site is devoted to entertainment, if your emphasis is on providing a diverting experience, it's your job to entertain your visitors (see Figure 15.10). Whip out that video extravaganza; get your 3D toys out there. It's show time!
Some web sites serve the function of being online brochures, whose main purpose is presenting a corporate image. For these sites, setting a certain mood and engulfing the visitor in an immersive experience can be valid goals (see Figure 15.11). The entire Tiffany's web site is a subtle Flash presentation geared toward creating a mood of elegance, opulence, and comfort (www.tiffanys.com). For an entirely different mood, visit the Sheer Blonde site (www.sheerblonde.com), which uses animation, soundtrack, and sophisticated rollover effects for a high-energy, exciting mood.
Splash screens and opening animations can be good mood setters, which is why they're used so often. Games and activities also can be used to attract repeat visits to a web site. In Figure 15.12, sports teams can see their team jackets as they customize them, with Boathouse's Garment Generator (www.boathouse.com/garmentgen/garment_demo.asp).
New information can be overwhelming. Learning new things often involves overcoming mental blocks, which is inherently stressful. Many people learn better and are less intimidated if there are friendly animations or narrations rather than dry presentation through text and still pictures. People also learn better when they're engaged, through activities, games, self-quizzes, and such (see Figure 15.13).
The History Channel UK offers an in-depth learning site for high school students, complete with activities, self-quizzes, and reference resources (www.thehistorychannel.co.uk/ historystudystop). For more multimedia learning experiences, visit MOMA's Art Safari (www.moma.org/onlineprojects/artsafari); and National Geographic's World magazine (www.nationalgeographic.com/world).
Web multimedia is full of challenges, both technical and artistic. Just deciding how to get media and complex interactivity onto a web page requires strategizing and skill. Determining when and why to put multimedia elements on the page is an entirely different, no less important, challenge.