Table of Contents i Designing WebWeb AnimationAnimation Nicola Brown Paul Van Eyk Peter Chen William E. Weinman David Miller New Riders Publishing, Indianapolis, Indiana ii Designing Web Animation Designing Web Animation Development Editor Suzanne Snyder By Nicola Brown, Peter Chen, David Miller, Paul Van Eyk, and William E. Weinman Project Editor Published by: Sarah Kearns New Riders Publishing Copy Editors Lillian Duggan 201 West 103rd Street Nancy Maragioglio Greg Pearson Indianapolis, IN 46290 USA Cliff Shubs All rights reserved. No part of this book may be reproduced or transmitted in any Technical Editor form or by any means, electronic or mechanical, including photocopying, recording, or Chris Stone by any information storage and retrieval system, without written permission from the publisher, except for the inclusion of brief quotations in a review. Associate Marketing Manager Tamara Apple Copyright 1996 by New Riders Publishing Acquisitions Coordinator Printed in the United States of America 1 2 3 4 5 6 7 8 9 0 Tracy Turgeson Library of Congress Cataloging-in-Publication Data Administrative Coordinator Karen Opal ***CIP data available upon request*** Cover Designers Barbara Kordesh Karen Ruggles Warning and Disclaimer Cover Illustration This book is designed to provide information about Web animation techniques. Every David Uhl effort has been made to make this book as complete and as accurate as possible, but Cover Production no warranty or fitness is implied. Aren Howell The information is provided on an “as is” basis. The authors and New Riders Book Designer Publishing shall have neither liability nor responsibility to any person or entity with Sandra Schroeder respect to any loss or damages arising from the information contained in this book or Production Manager from the use of the disks or programs that may accompany it. Kelly Dobbs Publisher Don Fowley Production Team Supervisor Laurie Casey Publishing Manager Julie Fairweather Graphics Image Specialists Marketing Manager Mary Foote Stephen Adams Debra Bolhuis Managing Editor Carla Hall Daniel Harris Clint Lahnen Laura Robbins Production Analysts Jason Hand Bobbi Satterfield Production Team Heather Butler Angela Calvert Daniel Caparo Terrie Deemer Tricia Flodder Beth Rago Megan Wade Christy Wagner Indexer Chris Cleveland Table of Contents iii About the Authors Center at Stanford University. He is a Web site administrator, designer, and programmer in the Nicola Brown’s career thus far has been, by San Francisco Bay area and teaches classes in necessity, rather short. She spent four years hard Instructional Technology and Web multimedia. labor completing a Bachelor of Science with Dave is finishing up his Ph.D. at Stanford. Honors in Computer Science at Monash Univer- sity in Melbourne, Australia before entering the Paul Van Eyk is 32 years old; he purchased his Big Bad World. first computer and laser printer at great cost, back Currently, Nicola is employed at Sausage Software in the days when the phrase “Desktop Publishing” as a Java programmer, although she started her was first coined and traditional typesetters refused term there as technical support, wearing her to worry about it. Paul started his career as an fingers to the bone answering all the e-mail sales “underground” cartoonist in Amsterdam, Holland, and support inquiries. In writing Egor (believed to and 16 years later finds himself working as a full- be the world’s first commercial Java applet), time “Nethead” in Melbourne, Australia. In Nicola somehow earned the title “JavaGirl.” between, he’s been a graphic designer, copywriter, editor, art director, and publisher. Peter Chen received his B.A. in Biochemistry and These days, Paul is the Webmaster at Sausage B.M. in Music Education from Oberlin College in Software, a very “coooool” software company that 1995. Currently, he works conjunctively for the makes serious yet fun Web Authoring/Design tools Stanford University Libraries and the Department like the HotDog Web Editor and Egor, the world’s of Biological Sciences as a consultant and devel- first commercial Java application. The company’s oper of technological applications for the academic products are developed in consultation with, and environment, including Web-based education. for, Web authoring professionals everywhere, and they’re marketed and distributed almost exclu- On a Macintosh clone, Peter uses BBEdit for sively via the Sausage Software Web site. HTML authoring, Photoshop and FreeHand for graphical editing, and Opcode’s Studio Vision for Thousands of people see Paul’s work everyday, but all his sound applications. On the receiving end, he most know him only as Webguru. That’s his uses the Real Audio Plug-In, LiveUpdate’s Cre- nickname—and it’s also his e-mail address and his scendo MIDI Plug-In, and Netscape Navigator 3.0 job title. Sausage Software is that kind of company, with its LiveAudio enhancement features. the staff are that kind of people, and the Web is that kind of place. Coooool. A classically trained musician, Peter has been composing and working with computer-based music and MIDI over the past 10 years, and William E. Weinman has earned his living as a maintains a studio at home using equipment by technologist-for-hire for about 20 years. He has Alesis, Emu, Korg, Lexicon, Opcode, Roland, designed software for many large and small Tascam, Yamaha, and Zeta. organizations, including IBM, Security Pacific Bank, KDD (the major long-distance company in Japan), and the Bank of New Zealand. Mr. David Miller is a Multimedia Application Weinman has also designed and constructed Developer and Instructional Technology Specialist electronic musical instruments for popular record- for the School of Education and New Media ing artists, fiber-optic systems for NASA and Bell iv Designing Web Animation Labs, and a broadcast ticker tape for a television From David Miller: station. He has been involved with online comput- ing since he got his first acoustically coupled I’d like to acknowledge all the talented, hard- modem in 1978. working people at New Riders, including Julie Fairweather, Suzanne Snyder, Tracy Turgeson, and You can often find Mr. Weinman playing with Sarah Kearns. Thanks to Darren and Dana at Jezebel, his Gibson L6-S guitar, in blues bars Terran Interactive, Charles Wiltgen and the around Texas; or studying Native-American helpful folks at Apple Computer for information shamanic medicine in Arizona; but it may be easier on beta software, and all the other companies to send e-mail to [email protected]. and individuals who provided software for the CD. Trademark I’d also like to thank Lois Brooks and the staff at Academic Technology Support Services at Acknowledgments Stanford University, Charles Kerns, New Media All terms mentioned in this book that are known to Center, Gary Ernst, Alan Garber, Mary Goldstein, be trademarks or service marks have been appro- Decker Walker, and my loving and supporting priately capitalized. New Riders Publishing cannot family. attest to the accuracy of this information. Use of a From Paul Van Eyk: term in this book should not be regarded as affecting the validity of any trademark or service I’d like to thank my wife and three children for mark. their support during the writing process, which has added many hours to my already heavy workload. I would also like to thank my associ- Dedication ates Tim Marsh and Ray Moon, for their invalu- From David Miller: able assistance; any mistakes made are mine, not theirs. To Mom and Dad, for their love and support. From New Riders: Acknowledgments New Riders wishes to acknowledge, thank, and put on a pedestal funky groovin’ guy Rich Evers From Nicola Brown: for his 11th-hour contribution to this project and for always making us laugh when we need it most. I’d like to thank Simone, Lee, and Peter: patient housemates in the face of adversity; all my friends and my family for encouraging me in everything; and lastly my cat, Sooty, for being so wonderfully furry. Table of Contents v Contents at a Glance 1 Principles of Animation in a Nutshell ................................... 3 2 Animation: Getting It All Together ..................................... 35 3 Java Animation: Technology Overview ............................... 51 4 Design Aspects of Java Animation for the Web ................... 81 5 Animated GIFs ................................................................. 117 6 Creating QuickTime Animations ...................................... 131 7 Animating with Shockwave for Director ........................... 179 8 Server-Push Animation...................................................... 225 9 Adding Sound and Special Effects to Animated Pages ....... 243 A What’s On the CD ............................................................ 275 B Additional Netscape-Compatible Animation Plug-Ins....... 291 Index ................................................................................ 299 vi Designing Web Animation Table of Contents Author Biography ........................................................... 2 1 Principles of Animation in a Nutshell ................... 3 Animation on the Web .......................................................... 5 Overcoming Obstacles.................................................... 5 Animation 101 ...................................................................... 8 Cel Animation ................................................................ 9 Flip-Book Animation ...................................................... 9 Sprite, Path, and