Flash: Difference between revisions

The educational technology and digital learning wiki
Jump to navigation Jump to search
 
(62 intermediate revisions by 4 users not shown)
Line 1: Line 1:
{{Incomplete}}
{{Incomplete}}{{Flash tutorial|CS4 (CS5)|beginner|}}
<pageby nominor="false" comments="false"/>
<!-- <pageby nominor="false" comments="false"/> -->
 
This page needs to be updated for Flash CS6, but principles remain the same ...


== Definition ==
== Definition ==


Adobe Flash, or simply Flash, refers to both the Adobe Flash Player,
{{quotation|Adobe Flash (previously called Macromedia Flash) is a multimedia platform originally acquired by Macromedia and currently developed and distributed by Adobe Systems. Since its introduction in 1996, Flash has become a popular method for adding animation and interactivity to web pages. Flash is commonly used to create animation, advertisements, and various web page components, to integrate video into web pages, and more recently, to develop rich Internet applications.
and to the Adobe Flash Professional multimedia authoring program. The player features support for vector and raster graphics, a scripting language called ActionScript and bi-directional streaming of audio and video.
Flash can manipulate vector and raster graphics and supports bidirectional streaming of audio and video. It contains a scripting language called ActionScript. Several software products, systems, and devices are able to create or display Flash content, including Adobe Flash Player, which is available free for most common web browsers, some mobile phones and for other electronic devices (using Flash Lite).}}
(Wikipedia, retrieved 12 July 2007).
(Wikipedia, retrieved May 23 2009).
 
In addition, Flash is used as a format for desktop applications under the name of "Adobe Integrated Runtime" ([[Adobe AIR]]).
 
We could distinguish four kinds of Flash authors: (a) People who use simple offline or online tools to generate applications like slide shows. (b) Multi-media authors who create good looking Flash movies. (c) Multi-media / light-weight programmers who create interactive Flash applications and (d) "Real programmers" who write so-called [[rich internet application]]s. Today, many tools can produce runnable Flash contents. However, only Adobe's commercial Flash authoring tools allow non-programmers to exploit the full capabilities of this format. Programmers, on the other hand, may use Adobe's free [[Adobe Flex|Flex]] software development kit instead of the commercial Flex builder.
 
{{Hide in print|This page contains an overview of Flash-related articles in [[Main_Page|EduTechWiki]], some general definitions, as well as links to software. References to tutorials, documentation and other websites are available on [[#Extra_Resources|different pages]].}}
 
See also:
* [[Animate CC]]
 
== Flash tutorials and articles in EduTech wiki ==
 
EduTech Wiki includes introductory Flash and ActionScript 3 (AS3) tutorials for Flash version 11 using mostly Adobe Flash CS6 Professional and for Flash version 9 using CS3, plus some CS4/CS5 tutorials that introduced new features not in CS3).


This page contains some general definitions, as well as links and references to tutorials, software and other websites.
We used these in [[Help:COAP-2110|COAP 2110]] (Fall 1 2007, Fall 2008, Spring 2010, Sprint 2013, Webster University), [[STIC:STIC_III|STIC III]] (Fall 2007, fall 2008, Geneva university), and [[:fr:STIC:STIC_IV|STIC IV]] (spring 2010, in french, Geneva university) courses. Some tutorials better than others and none is top quality so far, but most can serve as lecture notes and for some self-study.


== Flash articles in EduTech wiki ==
Most tutorials have been upgraded to CS6 in winter 2013. CS4 and CS5 users can read CS6 tutorials, but should take files from tutorials developed for CS3 and CS4. The interface changes between CS3 and CS4/CS5/CS6 are substantial but not major. The differences between CS4, CS5 and CS6 are rather minor.


=== Flash tutorials in EduTech Wiki ===
We produced three families of tutorials with some overlaps:
* [[Flash tutorials]] (Flash CS6 plus ActionScript 3 for non-programmers, and links to deprecated CS3/4/5 versions)
* [[Actionscript 3]] (Beginner's tutorials for "pure" AS3, i.e. tool independent coding, these should be further expanded, but are not so far ...)
* [[Flex tutorials]] (very few)


EduTech Wiki contains a few introductory Flash tutorials for Flash version 9 (aka Flash CS3). I used them in my [[Help:COAP-2110|COAP 2110]] (Fall 1 2007) and [[STIC:STIC_III|STIC III]] (Fall 2007, in french) courses. So far, we have this [[Help:List_of_Flash_tutorials|list]] of flash tutorials. Some are better than others and none is top quality so far, but most can serve as lecture notes. ([[User:Daniel K. Schneider|Daniel K. Schneider]] 30 August 2007).
All materials (*.fla, *.swf, etc.) are available at http://tecfa.unige.ch/guides/flash/ under a
[[EduTech Wiki:Copyrights|CC BY-NC-SA licence]].


; Setting up Flash and understanding the environment
{{Hide in print|
# [[Adobe Creative Suite 3 Design Premium installation]]
; Other Flash articles in EduTech Wiki (e.g. overviews and cheat-sheets):
# [[Flash CS3 desktop tutorial]]
 
# [[Flash CS3 keyboard shortcuts]]
# [[Flash ActionScript 3 overview]] -- a conceptual little overview of AS3
# [[Flash formats and objects overview]] (not ActionScript objects !)
# [[Flash - being organized]] (some advice for beginning Flash CS3 designers)
# [[Actionscript 3]] -- a complete programming language. An entry page for AS3 tutorials
# [[Flash 3D]] -- overview page of of Flash 3D tools and AS3 libraries
}}


; Basic drawing
== The Flash framework ==
# [[Flash drawing tutorial]]
# [[Flash layers tutorial]]


; Basic animation
In the past, Flash was just a web animation/interactive multimedia technology. Today (2008) Flash is a serious contender for one-stop [[rich internet application]] technology as the following picture shows:
# [[Flash frame-by-frame animation tutorial]]
# [[Flash motion tweening tutorial]]
# [[Flash shape tweening tutorial]]
# [[Flash animation summary]]
# [[Flash special effects tutorial]]


; Use of external media
[[image:atp_ria_guide_ria_picture.jpg|none|thumb|800px|Adobe Flash Platform for RIAs. Retrieved nov 2008 from http://www.adobe.com/devnet/actionscript/articles/atp_ria_guide.html]]
# [[Flash video component tutorial]]
# [[Flash sound tutorial]]
# [[Clipart]] and [[texture]] (to help you finding/importing media elements)


; Advanced drawing
== Flash versions compared ==
# [[Flash object transform tutorial]]
# [[Flash arranging objects tutorial]]
# [[Flash colors tutorial]]
# Flash pen tutorial (not done)


; Basic interactivity
CS3 was a major break from earlier versions (Flash 8 and earlier) with respect to ActionScript. ActionScript 3 is much more difficult to learn than ActionScript since it uses a modern typical user interface paradigm. In Flash 8 one could directly attach scripts to objects. In Flash 9 and later scripts are attached to frames.
# [[Flash button tutorial]]
# [[Flash components tutorial]] (just started)
# [[Flash video component tutorial]]
# [[Flash drag and drop tutorial]]
# [[ActionScript 3 event handling tutorial]]
# [[ActionScript 3 interactive objects tutorial]] (not finished)
# [[Flash games tutorial]] (just started)


; Associated materials (mostly flash files)
Changes/Additions in CS4:
* All materials (*.fla, *.swf, etc.) are available at http://tecfa.unige.ch/guides/flash/ex
* A completely redesigned interface
* Copyright: See [[EduTech Wiki:Copyrights]]
* Easier [[Flash animation overview|motion tweening]] (CS 3 motion tweening was renamed "classic tween")
* [[Flash CS4 inverse kinematics tutorial|inverse kinematics]]
* Support for 3D animation of 2D objects.


=== Other Flash articles in EduTech Wiki ===
CS5 includes:
* Better looping support in motion tweens. E.g. ctrl-select first keyframe, then ALT-drag to right after the tween span, then inverse keyframes with the right click menu)
* Physic engine additions to [[Flash CS4 inverse kinematics tutorial|inverse kinematics]], e.g. spring functions
* Support for IPhone applications (not sure that it works, since Apple doesn't like other's developing environments)
* Much better text support
* Code snippets (helps beginners to write AS3 code).
* XML-based source code: Either compressed *.fla files or *.xfl folders.
* Easier management of cue points in videos (directly in CS5)
* Better deco brushes, e.g. you now can easily draw a tree...


These are pieces like overviews, cheatsheets or unfinished stuff.
CS6 includes:
* Better support for mobile technology
* and more .... (to document)


# [[Flash CS3 keyboard shortcuts]]
Since CS5, Flash includes [[flash actions-frame tutorial|code snippets]]. Therefore, these newer versions are better suited for teaching Flash to beginners. However, for learning modern Flash, it doesn't make a big difference whether you use CS3, CS4 or CS5 or CS6. Some schools simply can't afford upgrading at an 18 month rate ...
# [[Flash ActionScript 3 overview]]
# [[Flash formats and objects overview]] (not ActionScript objects !)
# [[Flash - being organized]]
# [[Actionscript 3]]  -- a fully fledged programming language


== Alternative technologies ==
== Alternative technologies ==


; General formats
; General formats
* [[DHTML]], i.e. the combination of HTML, CSS, DOM and Javascript
* [[DHTML]], i.e. the combination of HTML, CSS, DOM and JavaScript and [[AJAX]] (asynchronous server-client communication trough JavaScript). See various [[JavaScript libraries|JavaScript libraries]].
* [[SVG]]
* [[SVG]], an XML-based vector graphics format sponsored by WC3. SVG is a powerful format, but lacks support from authoring tool and web browser makers. Adobe, before it acquired Macromedia, used to support SVG. SVG works well in the Opera browser and increasingly better in Firefox.
* [[SMIL]]
* [[HTML5]]. It includes SVG and "DHTML". Adobe [[Animate CC]] (the successor product or Flash Professional) can produce code or HTML5 canvas.
* [http://www.microsoft.com/silverlight/ Microsoft Silverlight], a new Microsoft attempt to have its own "Flash"
* [[SMIL]], an XML-based multi-media integration language that supports timing, layout, animations, etc. SMIL is included in the full SVG profile and as such works with [[HTML5]]. SMIL also works with other technologies that now seems outdated (e.g. RealPlayer).
* [http://www.microsoft.com/silverlight/ Microsoft Silverlight], a mostly failed attempt by Microsoft attempt to have its own "Flash".


; Others
; Others
Line 89: Line 103:
=== Authoring tools ===
=== Authoring tools ===


* [http://www.adobe.com/products/flash/ Adobe Flash CS3 Professional]. '''The''' commercial authoring tool.
* [http://www.adobe.com/products/flash/ Adobe Flash CS5 Professional]. '''The''' commercial authoring tool. '''Students''': You can get huge discounts either through some stores or Adobe's [http://www.adobe.com/education/ education program] (takes some times to fight through this web site and to find the appropriate page). In both cases you will have to send proof to Adobe before you will get a key. '''Teachers''' pay more, institutions can make deals that are more difficult to get.
Adobe Flash CS3 Professional was released in April 2007, CS4 Professional  in October 2008 and CS5 in April 2010. CS4 adds inverse kinematics, easier motion tweening (i.e. object-based animation finally!) and some basic support for 3D animations of 2D objects. CS5 adds for example a physics engine.


* [http://www.swishzone.com/index.php SWISH]. An alternative set of commercial products to produce Flash. Much cheaper and somewhat easier it seems, but doesn't export to *.fla files (so you can't import to the Adobe authoring tool). See the [http://en.wikipedia.org/wiki/SWiSH_Max Wikipedia] article.
* [http://www.swishzone.com/index.php SWISH]. An alternative set of commercial products to produce Flash. Much cheaper and somewhat easier it seems, but doesn't export to *.fla files (so you can't import to the Adobe authoring tool). See the [http://en.wikipedia.org/wiki/SWiSH_Max Wikipedia] article.


* [http://www.uira.org/ UIRA] A project to make a free authoring tool. Should output both Flash and SVG. (development seems to have stalled in 2007).
* [http://www.salasaga.org/ Salasaga]. An free (and OSS) Integrated Development Environment for producing animated swf files, similar to Adobe Captivate. Goal is to create a free, easy to use GUI authoring environment that helps you create visually impressive and actually useful learning material. Example swf output [http://www.salasaga.org/downloads/alpha3/projects/Installing_on_Ubuntu804.html here].
 
=== Decompilers ===
 
A decompiler can translate an *.swf to *.fla. Useful if you want to learn (not steal) from examples on the web or if you lost by mistake your *.fla sources.
 
* Sothink decompiler: [http://www.sothink.com/product/flashdecompiler/index.htm Flash Decompiler], [http://www.swf-decompiler.com/ SWF Decompiler], [http://www.swf-to-fla.com/ SWF to FLA]
* [http://www.eltima.com/products/flashdecompiler/ Flash Decompiler Trillix]
** See also [http://www.flash-decompiler.com/ Flash Decompiler Trillix] (strange website without any documentation)
 
=== Translators and common formats ===


* [http://www.flameproject.org/ FLAME]. A similar project. For the moment, outputs SVG.
E.g. *.fla to *.html
* [http://labs.adobe.com/technologies/wallaby/ Wallaby] "Wallaby" is the codename for an experimental technology that converts the artwork and animation contained in FLA files (retrieved Feb 2011).
* The *.fxp file format is used by Flash Catalyst to create a (compressed/zipped) Flex project archive that is understandable by Flash Builder. I.e. designers can create a project in Catalyst and then hand it over to a Flash/Flex programmer who will work with Flash Builder.
* Conversely, *.fxg enables cross communication among Creative Suite, Flash Catalyst and Flash Builder. {{quotation|The FXG format is new to Flash Professional CS5. It allows Flash to exchange graphics with other Adobe applications such as Illustrator, Fireworks, and Photoshop with all of the complex graphic information preserved. Flash allows you to import FXG files (version 2.0 only) as well as save selections of objects on the Stage or the entire Stage in FXG format. FXG is based on a subset of MXML, the XML-based programming language used by the Flex framework.}} ([http://www.adobe.com/devnet/flash/articles/concept_fxg.html Flash glossary: FXG], retrieved March 7 2011).


=== Special purpose authoring tools ===
=== Special purpose authoring tools ===


* [http://www.adobe.com/products/captivate/ Adobe Captivate]. An authoring environment to create simulations, scenario-based training, and robust quizzes. Can importexport to Flash *.fla documents.
There is an increasing variety of tools and for a wide range of people, covering casual users to programmers.
 
* [http://www.adobe.com/products/captivate/ Adobe Captivate]. An authoring environment to create simulations, scenario-based training, and robust quizzes. Can import/export to Flash *.fla documents.


* [http://www.adobe.com/products/acrobatconnect/ Adobe Acrobat Connect] (formerly called Breeze) is a flash-based [[videoconferencing]] software.
* [http://www.adobe.com/products/acrobatconnect/ Adobe Acrobat Connect] (formerly called Breeze) is a flash-based [[videoconferencing]] software.


* [http://www.adobe.com/products/flex/ Adobe Flex] is a software development kit and an IDE for a group of technologies to make [rich internet application]s with Flash, HTML, JavaScript etc.).
* [http://www.adobe.com/products/flex/ Adobe Flex] is a software development kit and an IDE for a group of technologies to make [[rich internet application]]s with Flash, HTML, JavaScript etc.).
 
* [http://www.toufee.com/ Toufee], an online tool to make Flash presentations (movies). Free in a basic version. Drag and drop pictures or special elements to a stage, add special effects, buttons, etc. Also saves in other formats.


* OpenOffice Impress (the power point clone) can produce *.swf
* OpenOffice Impress (the power point clone) can produce *.swf


* Some capturing tools (see [[screen capture tutorial|screen capture]], photo gallery makers, and video editing software can export to Flash.
* Some capturing tools (see [[screen capture tutorial|screen capture]], photo gallery makers, and video editing software can export to Flash.
=== Server technology ===
* [http://silex-ria.org Silex] is free open-source CMS with a Flash Interface (and AS API). Source Forge project of the month June 2009.
* [http://osflash.org/red5 red 5] is an open source Flash Server. I supports Streaming Audio/Video (FLV and MP3, Recording Client Streams (FLV only), Shared Objects, Live Stream Publishing and Remoting (AMF) (nov/2008)
* Adobe has a global [http://www.adobe.com/flashplatform/ Flash framework] that includes e.g. a Flash Media Server Family.


=== Generating Flash ===
=== Generating Flash ===
Line 115: Line 154:
* [http://swfmill.org/ SWFMill] xml2swf and swf2xml processor that can be used to create (non interactive) multiframe SWF animations.
* [http://swfmill.org/ SWFMill] xml2swf and swf2xml processor that can be used to create (non interactive) multiframe SWF animations.


=== Reusable flash code ===
* [http://haxe.org/ HaXe]. Programming language very similar to actionscript that can compile a SWF file for Flash Players 6 to 9. Free to use.


There are several kinds of components
In addition, you also should know that you can import several vector graphics formats. e.g. Windows Metafile formats into Flash CS3 (speeds up drawing).
* *.swf - Flash (embedd as movie)
* *.fla - Flash source code (i.e. a template with drawings and code)
* *.as - Action Script source code (watch out for the version !!)
* *.swc - Compiled components (like the ones in the built-in components library).
 
; Indexes
* [http://www.hotscripts.com/Flash/Components/index.htmlFlash::Components at HotScripts.com]
 
; Free (need more)
* [http://www.adobe.com/cfusion/exchange/index.cfm?view=sn110 Adobe Exchange beta] (various licences, also commercial).
* [http://www.flashcomponents.net/ Flashcomponents] (good site, but mostly older Flash)
* [http://www.flash-db.com/ Flash-DB] (older Flash, i.e. MX)
* [http://www.flashkit.com/ Flashkit.com] (Good large libary, but older Flash. Too many ads and difficult navigation and sorting.)


; Commercial (I only want to have 5-6, the best at some point and not a long list ...)
=== Programming Editors for ActionScript ===
* [http://www.ohmyflash.com/ Oh my Flash]
* [http://www.flashvalley.com/ Flash Valley] (some free)
* [http://www.flashloaded.com/flashcomponents/ Flashloaded]


In addition, you also should know that you can import several vector graphics formats. e.g. Windows Metafile formats into Flash CS3 (speeds up drawing).
* [http://www.flashdevelop.org/ Flashdevelop]. Free and open source tool that provides syntax support and an interface with the Flex compilers.
* Some multi-purpose editors (like [[emacs]] also may support [[Actionscript 3]] programming
* [http://www.adobe.com/products/flex/ Adobe Flex Builder] - a commercial Eclipse plugin from Adobe, but that is free for education upon request.


{{Hide in print|
=== Media for building your own scenes ===
=== Media for building your own scenes ===


Line 144: Line 170:
* See [[texture]]
* See [[texture]]


== Links to Tutorials ==
== Extra Resources ==


This section only should index good and free tutorials. '''No''' junk indexes with nothing but advertisements.
* [[Flash and AS3 links - general]]
There is a problem with Flash Version. Various Flash versions are considerably different and most sites include older stuff...
* [[Flash and AS3 links - tutorials]]
* [[Flash and AS3 links - documentation]] (Flash and AS3 Books, Reference Manuals and Cheatsheets)
* [[Flash and AS3 links - toolkits]] (AS 3 Toolkits, Libraries, Flash reusable components, AS 3 reusable code, etc.)
}}


=== Web sites with tutorials ===
[[Category: Multimedia]]
* Both just links or "real" repositories
* Since there exist very little Flash 9-only collections, I also include sites with older information. There is quite a huge difference between ActionScript 2 and 3, but drawing and the elements of the Flash environment (timeline, etc.) are not that different.


; Collections - both text and videos


* Lloyd Rieber's [http://www.nowhereroad.com/menu.html Flash Tutorials] (both text and video)
[[Category: Tutorials]]
 
[[Category: Flash tutorials]]
* [http://www.adobe.com/devnet/flash/ Adobe Flash Developer Center]. Includes some tutorials, including video tutorials
[[Category: Actionscript 3]]
 
* [http://www.oman3d.com/tutorials/ Oman3D]. Contains both good text and video tutorials (the latter from learnflash.com).
 
* [http://www.video-animation.com/flash_01.shtml Steve tutes] (good, but Flash 8)
 
* [http://www.flzone.net/ FlZone.net] has a [http://www.flzone.net/categories.asp?TypeId=2 tutorial section] with ratings (links to other sites)
 
* [http://www.emanueleferonato.com/2007/09/05/the-best-flash-game-creation-tutorial-sites/ The best Flash game creation tutorial sites]
 
; Collections - mostly video
 
* [http://www.adobe.com/designcenter/video_workshop/ Video tutorials] at Adobe
 
* [http://wikivid.com/index.php/Flash Wikivid Flash]. Index of Video Tutorials (mostly Flash 8, but CS3 is similar) from the whole web. Probably the '''biggest''' index of training videos.
 
* [http://cartoonsmart.com/ cartoonsmart.com/] Includes three good Flash video tutorials, e.g. shape tweening and a button tutorial.
 
* [http://learnflash.com/ LearnFlash.com]. (Some good free ones, scroll down, for more registration is needed)
 
; Collections - mostly text tutorials
 
* [http://www.lukamaras.com/tutorials/tutorials-index.html lukamaras.com] Probably one of the best short tutorials site (mostly Flash MX/Flash 8)
 
* [http://www.kirupa.com/developer/flash/index.htm Flash/ActionScript] Tutorials at Kirupa. Gook, but mostly < Flash 9
 
* [http://www.webwasp.co.uk/index.php WebWasp] (some content is free, *.fla files are sold)
 
* [http://www.webdevelopersnotes.com/tutorials/flash/index.php3 Webdeveloper notes]
 
* [http://www.w3schools.com/flash/ W3School Flash Tutorial]. Short step-by-step tutorials.
 
* [http://www.toxiclab.org/default.asp?ID=2 ToxicLab.org]. About 99 little Flash tutorials submitted by various people. The ones I have seen are short and nice.
 
; Collections - to sort out
 
* [http://www.cbtcafe.com/flash/ cbtcafe flash tutorials]
 
* [http://www.echoecho.com/flash.htm EchoEcho.com Flash Tutorials] (including drawing, tweening and buttons, etc.)
 
* [http://www.flashkit.com/ Flashkit.com] (A Flash Developer Resource Site)
 
* Find [http://www.youtube.com/results?search_query=%22Adobe+Flash+CS3%22&search= "Adobe Flash CS3"] on YouTube.
 
* [http://www.webworksite.com/flashtutorials.shtml Flash Tutorial at webworksite] (For Flash 5, but still useful).
 
* [http://www.flashvalley.com/ Flash Valley]
 
* [http://www.flashkit.com/tutorials/ Flash Kit] Index of Tutorials (lots of outdated ones too).
 
* [http://netdiver.net/toolbox/flashware.php Netdiver Flashware]
 
* Subsites of http://about.com, e.g. [http://webdesign.about.com/ webdesign] and [http:animation.about.com animation] have several flash related resources. You need to search ...
 
=== Recommended introductory CS3 tutorials ===
 
; Basics (graphics and animation)
 
??
 
; ActionScript 2.0
 
* [http://www.mindtrove.info/articles/flash.html Simple Design Patterns in Adobe Flash MX] by Peter Parente. ActionScript 2.0
 
; ActionScript 3.0
 
* [http://www.senocular.com/flash/tutorials/as3withflashcs3/ Getting Started with ActionScript 3.0 in Adobe Flash CS3]
 
=== Academic Flash courses ===
(should include lecture notes or Slides, plus examples)
 
* [http://voyager.deanza.edu/~marie/caos114a/index.shtml Introduction to Flash], [http://voyager.deanza.fhda.edu/~marie/ Marie Taylor-Harper] ([http://voyager.deanza.edu/~marie/caos118a/index.shtml Advanced Flash], under preparation ?)
 
== Reference and manuals on-line ==
 
Tip: Since the help pane in CS3 can't be really detached, better use Adobe's on-line help.
 
=== On-line manuals ===
 
(It's not really obvious to find things at Adobe. There is much more documentation that one might think at first glance ...)
 
* [http://www.adobe.com/support/documentation/en/flash/ Flash resources], Adobe. The central starting point.
 
* [http://livedocs.adobe.com/flash/9.0/UsingFlash/ Using Flash CS3 Professional]. The starting point for beginners and graphics designers.
 
* [http://livedocs.adobe.com/flash/9.0/main/ Flash 9.0 documentation]. Includes several "books" on ActionScript and AS components for more advanced users, e.g.
** [http://livedocs.adobe.com/flash/9.0/main/Part2_Using_AS3_Components_1.html Using ActionScript 3.0 Components]
** [http://livedocs.adobe.com/flash/9.0/ActionScriptLangRefV3/ ActionScript 3.0 Language and Components Reference]. For programmers (!)
 
* [http://livedocs.adobe.com/flex/ Flex Live Docs] (for ActionScript 3 programming). For programmers only.
 
=== Cheatsheets ===
 
* [http://actionscriptcheatsheet.com/ ActionScriptCheatSheet.com] Look at the [http://actionscriptcheatsheet.com/blog/quick-referencecheatsheet-for-actionscript-20/ downloads]. Several excellent ActionScript cheatsheets.
 
== Other links ==
 
=== General ===
 
* Waldron, Rick (2006-08-27). [http://www.flashmagazine.com/413.htm The Flash History]. Flashmagazine
* [http://en.wikipedia.org/wiki/Adobe_Flash Adobe Flash] (Wikipedia)
 
=== Forums ===
 
* [http://www.kirupa.com/forum/ Kirupa Forums]
 
=== Links to Adobe ===
 
* [http://www.adobe.com/software/flash/about/ Adobe Flash Player]
* [http://www.adobe.com/devnet/flash/ Adobe Flash Developer Center]
(includes some tutorials, including video tutorials)
* [http://www.adobe.com/devnet/flash/testing_usability.html Testing and usability] (Adobe Flash Developer Center).
 
; Help
 
* [http://www.adobe.com/support/documentation/en/flash/ Flash resources]
 
=== Good Flash examples ===
 
; Artsy websites
* [http://www.yugop.com/ Yugop] (Abstract animation art)
* [http://www.xiaoxiaomovie.com XiaoXiao] (Animation Movies)
* http://www.newgrounds.com/
 
; Flash trailers for company websites / advertizements
* [http://www.eye4u.com/ Eye4u]
* [http://www.hillmancurtis.com/ hillmancurtis]
 
; Flash comics
* [http://www.angryalien.com/ Angry Alien (30 sec. Bunnies]
 
=== Books ===
No idea if they are any good, except Veer, The Missing Manual which is great for learning drawing and the Flash CS3 tool. It doesn't cover ActionScript 3.
 
* Adobe Creative Team (2007). Adobe Flash CS3 Professional Classroom in a Book. ISBN 0321499824
 
* Anderson, Andy (2007). Adobe Flash CS3 Professional On Demand. ISBN 0789736926 592 pages.
 
* Finkelstein Ellen and Gurdy Leete (2007). Flash CS3 For Dummies. ISBN 0470121009, 408 pages.
 
* Gerantabee, Fred (August ? 2007). Dynamic Learning: Flash CS3 Professional. ISBN 10 0-596-51058-6
 
* Veer, E.A. Vander and Chris Grover (2007). Flash CS3: The Missing Manual. ISBN 0596510446 - 527 pages. - [http://www.oreilly.com/catalog/9780596510442/ O'Reilly page] (From reviews on the web, this looks like the most suitable one for starters. The example files can be found on the [http://www.missingmanuals.com/cds/flashcs3tmm/ Missing CD-ROM] page. [[User:Daniel K. Schneider|Daniel K. Schneider]] bought this and I think it's ok, can be used as a textbook, if you agree to cover topics by topics v.s a more project-oriented approach.)
 
* Morris David (2007). Creating a Web Site with Flash CS3 Professional: Visual QuickProject Guide. ISBN 0321503007
 
* Moock, Colin, Essential ActionScript 3.0. ISBN 0-596-52694-6. (From reviews on the web, this seems to be best action script 3.0 book)


[[Category: Multimedia]]
[[fr:Flash]]
[[Category: Technologies]]
[[Category: Authoring tools]]
[[Category: Tutorials]]
[[Category: Flash]]

Latest revision as of 14:39, 22 April 2018

This page needs to be updated for Flash CS6, but principles remain the same ...

Definition

“Adobe Flash (previously called Macromedia Flash) is a multimedia platform originally acquired by Macromedia and currently developed and distributed by Adobe Systems. Since its introduction in 1996, Flash has become a popular method for adding animation and interactivity to web pages. Flash is commonly used to create animation, advertisements, and various web page components, to integrate video into web pages, and more recently, to develop rich Internet applications. Flash can manipulate vector and raster graphics and supports bidirectional streaming of audio and video. It contains a scripting language called ActionScript. Several software products, systems, and devices are able to create or display Flash content, including Adobe Flash Player, which is available free for most common web browsers, some mobile phones and for other electronic devices (using Flash Lite).” (Wikipedia, retrieved May 23 2009).

In addition, Flash is used as a format for desktop applications under the name of "Adobe Integrated Runtime" (Adobe AIR).

We could distinguish four kinds of Flash authors: (a) People who use simple offline or online tools to generate applications like slide shows. (b) Multi-media authors who create good looking Flash movies. (c) Multi-media / light-weight programmers who create interactive Flash applications and (d) "Real programmers" who write so-called rich internet applications. Today, many tools can produce runnable Flash contents. However, only Adobe's commercial Flash authoring tools allow non-programmers to exploit the full capabilities of this format. Programmers, on the other hand, may use Adobe's free Flex software development kit instead of the commercial Flex builder.

This page contains an overview of Flash-related articles in EduTechWiki, some general definitions, as well as links to software. References to tutorials, documentation and other websites are available on different pages.

See also:

Flash tutorials and articles in EduTech wiki

EduTech Wiki includes introductory Flash and ActionScript 3 (AS3) tutorials for Flash version 11 using mostly Adobe Flash CS6 Professional and for Flash version 9 using CS3, plus some CS4/CS5 tutorials that introduced new features not in CS3).

We used these in COAP 2110 (Fall 1 2007, Fall 2008, Spring 2010, Sprint 2013, Webster University), STIC III (Fall 2007, fall 2008, Geneva university), and STIC IV (spring 2010, in french, Geneva university) courses. Some tutorials better than others and none is top quality so far, but most can serve as lecture notes and for some self-study.

Most tutorials have been upgraded to CS6 in winter 2013. CS4 and CS5 users can read CS6 tutorials, but should take files from tutorials developed for CS3 and CS4. The interface changes between CS3 and CS4/CS5/CS6 are substantial but not major. The differences between CS4, CS5 and CS6 are rather minor.

We produced three families of tutorials with some overlaps:

  • Flash tutorials (Flash CS6 plus ActionScript 3 for non-programmers, and links to deprecated CS3/4/5 versions)
  • Actionscript 3 (Beginner's tutorials for "pure" AS3, i.e. tool independent coding, these should be further expanded, but are not so far ...)
  • Flex tutorials (very few)

All materials (*.fla, *.swf, etc.) are available at http://tecfa.unige.ch/guides/flash/ under a CC BY-NC-SA licence.

Other Flash articles in EduTech Wiki (e.g. overviews and cheat-sheets)
  1. Flash CS3 keyboard shortcuts
  2. Flash ActionScript 3 overview -- a conceptual little overview of AS3
  3. Flash formats and objects overview (not ActionScript objects !)
  4. Flash - being organized (some advice for beginning Flash CS3 designers)
  5. Actionscript 3 -- a complete programming language. An entry page for AS3 tutorials
  6. Flash 3D -- overview page of of Flash 3D tools and AS3 libraries

The Flash framework

In the past, Flash was just a web animation/interactive multimedia technology. Today (2008) Flash is a serious contender for one-stop rich internet application technology as the following picture shows:

Adobe Flash Platform for RIAs. Retrieved nov 2008 from http://www.adobe.com/devnet/actionscript/articles/atp_ria_guide.html

Flash versions compared

CS3 was a major break from earlier versions (Flash 8 and earlier) with respect to ActionScript. ActionScript 3 is much more difficult to learn than ActionScript since it uses a modern typical user interface paradigm. In Flash 8 one could directly attach scripts to objects. In Flash 9 and later scripts are attached to frames.

Changes/Additions in CS4:

  • A completely redesigned interface
  • Easier motion tweening (CS 3 motion tweening was renamed "classic tween")
  • inverse kinematics
  • Support for 3D animation of 2D objects.

CS5 includes:

  • Better looping support in motion tweens. E.g. ctrl-select first keyframe, then ALT-drag to right after the tween span, then inverse keyframes with the right click menu)
  • Physic engine additions to inverse kinematics, e.g. spring functions
  • Support for IPhone applications (not sure that it works, since Apple doesn't like other's developing environments)
  • Much better text support
  • Code snippets (helps beginners to write AS3 code).
  • XML-based source code: Either compressed *.fla files or *.xfl folders.
  • Easier management of cue points in videos (directly in CS5)
  • Better deco brushes, e.g. you now can easily draw a tree...

CS6 includes:

  • Better support for mobile technology
  • and more .... (to document)

Since CS5, Flash includes code snippets. Therefore, these newer versions are better suited for teaching Flash to beginners. However, for learning modern Flash, it doesn't make a big difference whether you use CS3, CS4 or CS5 or CS6. Some schools simply can't afford upgrading at an 18 month rate ...

Alternative technologies

General formats
  • DHTML, i.e. the combination of HTML, CSS, DOM and JavaScript and AJAX (asynchronous server-client communication trough JavaScript). See various JavaScript libraries.
  • SVG, an XML-based vector graphics format sponsored by WC3. SVG is a powerful format, but lacks support from authoring tool and web browser makers. Adobe, before it acquired Macromedia, used to support SVG. SVG works well in the Opera browser and increasingly better in Firefox.
  • HTML5. It includes SVG and "DHTML". Adobe Animate CC (the successor product or Flash Professional) can produce code or HTML5 canvas.
  • SMIL, an XML-based multi-media integration language that supports timing, layout, animations, etc. SMIL is included in the full SVG profile and as such works with HTML5. SMIL also works with other technologies that now seems outdated (e.g. RealPlayer).
  • Microsoft Silverlight, a mostly failed attempt by Microsoft attempt to have its own "Flash".
Others

See also multimedia authoring systems and computer games. Some of these have their own format, some can export to more common formats.

Links for software and media elements

General / Indexes

  • OsFlash has a large comprehensive list of links to Open Source Flash projects, both those hosted on OSFlash and elsewhere. Of particular interest are tools that generate flash in various ways.

Viewers

  • Adobe (Flash player download)
  • Gnash (Wikipedia article) A project which aims to create a player and browser plugin for the Adobe Flash file format which is free software.

Authoring tools

  • Adobe Flash CS5 Professional. The commercial authoring tool. Students: You can get huge discounts either through some stores or Adobe's education program (takes some times to fight through this web site and to find the appropriate page). In both cases you will have to send proof to Adobe before you will get a key. Teachers pay more, institutions can make deals that are more difficult to get.

Adobe Flash CS3 Professional was released in April 2007, CS4 Professional in October 2008 and CS5 in April 2010. CS4 adds inverse kinematics, easier motion tweening (i.e. object-based animation finally!) and some basic support for 3D animations of 2D objects. CS5 adds for example a physics engine.

  • SWISH. An alternative set of commercial products to produce Flash. Much cheaper and somewhat easier it seems, but doesn't export to *.fla files (so you can't import to the Adobe authoring tool). See the Wikipedia article.
  • Salasaga. An free (and OSS) Integrated Development Environment for producing animated swf files, similar to Adobe Captivate. Goal is to create a free, easy to use GUI authoring environment that helps you create visually impressive and actually useful learning material. Example swf output here.

Decompilers

A decompiler can translate an *.swf to *.fla. Useful if you want to learn (not steal) from examples on the web or if you lost by mistake your *.fla sources.

Translators and common formats

E.g. *.fla to *.html

  • Wallaby "Wallaby" is the codename for an experimental technology that converts the artwork and animation contained in FLA files (retrieved Feb 2011).
  • The *.fxp file format is used by Flash Catalyst to create a (compressed/zipped) Flex project archive that is understandable by Flash Builder. I.e. designers can create a project in Catalyst and then hand it over to a Flash/Flex programmer who will work with Flash Builder.
  • Conversely, *.fxg enables cross communication among Creative Suite, Flash Catalyst and Flash Builder. “The FXG format is new to Flash Professional CS5. It allows Flash to exchange graphics with other Adobe applications such as Illustrator, Fireworks, and Photoshop with all of the complex graphic information preserved. Flash allows you to import FXG files (version 2.0 only) as well as save selections of objects on the Stage or the entire Stage in FXG format. FXG is based on a subset of MXML, the XML-based programming language used by the Flex framework.” (Flash glossary: FXG, retrieved March 7 2011).

Special purpose authoring tools

There is an increasing variety of tools and for a wide range of people, covering casual users to programmers.

  • Adobe Captivate. An authoring environment to create simulations, scenario-based training, and robust quizzes. Can import/export to Flash *.fla documents.
  • Toufee, an online tool to make Flash presentations (movies). Free in a basic version. Drag and drop pictures or special elements to a stage, add special effects, buttons, etc. Also saves in other formats.
  • OpenOffice Impress (the power point clone) can produce *.swf
  • Some capturing tools (see screen capture, photo gallery makers, and video editing software can export to Flash.

Server technology

  • Silex is free open-source CMS with a Flash Interface (and AS API). Source Forge project of the month June 2009.
  • red 5 is an open source Flash Server. I supports Streaming Audio/Video (FLV and MP3, Recording Client Streams (FLV only), Shared Objects, Live Stream Publishing and Remoting (AMF) (nov/2008)
  • Adobe has a global Flash framework that includes e.g. a Flash Media Server Family.

Generating Flash

  • Ming Ming is a C library for generating SWF ("Flash") format movies, plus a set of wrappers for using the library from C++ and popular scripting languages like PHP, Perl, Python, and Ruby.
  • SWFMill xml2swf and swf2xml processor that can be used to create (non interactive) multiframe SWF animations.
  • HaXe. Programming language very similar to actionscript that can compile a SWF file for Flash Players 6 to 9. Free to use.

In addition, you also should know that you can import several vector graphics formats. e.g. Windows Metafile formats into Flash CS3 (speeds up drawing).

Programming Editors for ActionScript

  • Flashdevelop. Free and open source tool that provides syntax support and an interface with the Flex compilers.
  • Some multi-purpose editors (like emacs also may support Actionscript 3 programming
  • Adobe Flex Builder - a commercial Eclipse plugin from Adobe, but that is free for education upon request.

Media for building your own scenes

Extra Resources

Retrieved from "https://edutechwiki.unige.ch/mediawiki/index.php?title=Flash&oldid=67543"