Member Sign In
Not a member?

A Wired.com user account lets you create, edit and comment on Webmonkey articles. You will also be able to contribute to the Wired How-To Wiki and comment on news stories at Wired.com.


It's fast and free.

Sign in with OpenID
Sign In
Webmonkey is a property of Wired Digital.
processing...
Join Webmonkey

Please send me occasional e-mail updates about new features and special offers from Wired/Webmonkey.
Yes No

Please send occasional e-mail offers from Wired/Webmonkey affiliated web sites and publications, and carefully selected companies.
Yes No

I understand and agree that registration on or use of this site constitutes agreement to Webmonkey's User Agreement and Privacy Policy.
Webmonkey is a property of Wired Digital.
processing...

Retrieve Sign In

Please enter your e-mail address or username below. Your username and password will be sent to the e-mail address you provided us.

or
Webmonkey is a property of Wired Digital.
processing...

Welcome to Webmonkey

A private profile page has been created for you.
As a member of Webmonkey, you can now:
  • edit articles
  • add to the code library
  • design and write a tutorial
  • comment on any Webmonkey article
Close
Webmonkey is a property of Wired Digital.

Sign In Information Sent

An e-mail has been sent to the e-mail address registered in this account.
If you cannot find it in your in-box, please check your bulk or junk folders.
Sign In
Webmonkey is a property of Wired Digital.

Flash Tutorial for Beginners - Lesson 1

/skill level/
/viewed/
0 Times

Getting Started

Let me guess - you want to add snappy interactivity and animations to your Web pages but you don't want to create huge "click here and go get a sandwich" files? Then Adobe's Flash may be for you. It doesn't require the scripting savvy of DHTML and Ajax which makes it easier for beginners.

The process of making a Flash movie is easy to learn, but mastering it takes time and sweat. Here, and in Lesson 2, I'll show you the basics of making one, and then I'll show you what you need to learn to become a Flash grandmaster.

The best way to create Flash content is with the Flash application, which was originally called FutureSplash. In 1997, Macromedia acquired the small company that developed FutureSplash as a way to complement Director, its flagship product. Director, which has since gone the way of the Dodo.

Toward the end of 1995, when Netscape Navigator 2 was the latest, greatest browser, Macromedia introduced Shockwave as a way to port Director movies to the Web. Users downloaded and installed a free plug-in, and the movies played right there in the browser.

As the web got more complex Director proved unwieldly, but here was still a need to provide an alternative to standard GIFs and JPEGs, which lack versatility and can result in big files.

The vector capabilities in Flash proved to be one possible anwer. Vector-graphics programs create graphics using instructions while bitmap programs map out images pixel by pixel.

Let's say you want to draw a circle. A vector graphic simply tells a display program to "draw a perfect circle exactly 100 pixels in diameter." A bitmap program maps out every pixel in that circle, which requires more information (and therefore a larger file size) often resulting in a poorly rendered circle. Also, a vector-based image can be scaled to virtually any size with no impact on file size or quality.

circle_bitmap.gif

circle_vector.jpg

Here's a simulation of the differences between bitmap and vector graphics. The left circle demonstrates how a bitmap image is defined by a finite set of pixels. Enlarge it, and the circle looks pretty rough. But if you increase the resolution to lose that "pixely" look, you'll run into major file-size issues. Meanwhile, the vector graphic on the right could be enlarged 10 times and still look just as sharp.

Because of bandwidth concerns on the Web, there has long been an urgent need for vector graphics. SVG is emerging as an official standard, but with Flash, the future is now.

Flash allows you to create animations, build interactivity, and add sound to your pages -- and even fairly complex games. You can make some dazzling graphics and interfaces for your Web pages that eat up an amazingly petite 5 to 50 KB. And the growth of the ActionScript programming language offers you the chance to take it much farther, if you want.

Another big advantage of Flash is that it's virtually independent of browsers. Since Flash files are only viewable with a plug-in, everyone with a version 3 browser or better can see the movies almost identically. The downside to this is the plug-in itself:Users need to download and install it before they can see anything. But this is becoming less of a hurdle since the latest browsers come with Flash already included.

So all in all, Flash is looking like quite the solution and is becoming more popular every day. But enough talk. Let's get our hands dirty.

==

What you'll need

1.jpeg

2.jpeg

3.jpeg

4.jpeg

Suggested readings

From the series

Flash Tutorial for Beginners
Flash Tutorial for Beginners - Lesson 1
Flash Tutorial for Beginners - Lesson 2

  • This page was last modified 11:59, 17 November 2009.
Edit this article
Reddit Digg
 

/related_articles/

See more related articles

Subscribe now

Special Offer For Webmonkey Users

WIRED magazine:
The first word on how technology is changing our world.

Subscribe for just $10 a year