Flash Video: The Basics, and BEYOND! · ‣ GO TO FLASH » 11 11. of 24 The v3 FLVPlayback component + ‣What it CAN do ‣Quick ‣Progressive or streaming delivery ‣More easily

Flash Video:The Basics, and BEYOND!Lisa Larson + Renée Costantini

www.gotogroupinc.comwww.flashconnections.com

1

of 24

In this session, we’ll cover...

‣ Examples in the wild

‣ The basics of video in Flash

‣Metadata and cue points

‣Basic playlisting; pre-roll and post-roll video

‣Masks and filters

‣Basic code examples for each

2

2

of 24

Startups...

3

3

of 24

Adobe Media Player

4

4

of 24

Taking online video to the next level

‣ Interactive and dynamic

‣ Veotag.com

‣ the-N.com

‣ jumpcut.com

‣ click.tv

5

5

of 24

veotag.com

6

6

of 24

the-N.com

7

7

of 24

jumpcut.com

8

8

of 24

click.tv

9

9

THE BASICS

10

of 24

How to bring video into Flash

‣ FLVPlayback component

‣ Video object

‣ GO TO FLASH »

11

11

of 24

The v3 FLVPlayback component +

‣What it CAN do

‣Quick

‣ Progressive or streaming delivery

‣More easily skinned (than v2 component)

‣ ActionScript cuepoints

‣ FLVPlayback Captioning available

12

12

of 24

The FLVPlayback component –

‣What it CAN’T do

‣Not useful for live chat or alpha channel video

‣Can’t apply bitmap effects or filters just to video

‣Black box; difficult to customize

‣Overkill for simple video players

13

13

of 24

The video object

‣ The most basic simple code to playback video in Flash:var nc:NetConnection = new NetConnection();

nc.connect(null);

var ns = new NetStream(nc);

myVideo.attachVideo(ns);

ns.play("yourVideo.flv");

14

‣Or, for streaming video:var nc:NetConnection = new NetConnection();

nc.connect("rtmp://yourFMSserver.com/yourAppName/yourInstanceName");var ns = new NetStream(nc);

myVideo.attachVideo(ns);

ns.play("yourVideo.flv");

14

and BEYOND…

15

of 24

Demystifying metadata and cue points

‣What are they?

‣ Embedded in the FLV

‣Or, in some cases external (ActionScript cue points)

‣How do they differ?

‣Metadata: single values

‣Cue points: Associative array of cue point objects

‣What you’d use them for

16

16

of 24

Metadata

‣ Expected metadata in all FLVs

‣ duration

‣width

‣ height

‣ framerate

‣Other useful common metadata properties

‣ audiodatarate, videodatarate, videocodecid

‣Basic Code

‣How to read metadata GO TO FLASH »

17

17

of 24

Cue points

‣Cue point data

‣ time, name, type, parameters

‣Cue point types

‣Navigation

‣ Event

‣ (and ActionScript)

‣Basic code

‣How to read cue points GO TO FLASH »

18

18

of 24

How to add metadata and cue points to FLVs

‣How to add this data to your FLVs

‣ External

‣ AS cue points GO TO FLASH »

19

‣ Internal

‣ Embed during encoding

‣ Inject after encoding

‣ FLV Metadata Injector (FLVMDI)

‣ FLVTool2

‣ Captionate

19

of 24

Playlists

‣What is a playlist

1. Load data into Flash

2. Display or store data

3. Play FLVs

20

20

of 24

Playlists

‣Methods for creating playlists, pros/cons

‣ Parse a text document

‣Read from an array

‣ Parse XML or RSS

‣Retrieve from database

‣Read directory contents

21

21

of 24

Playlists: pre-roll and post-roll

‣ Play a list of videos, in sequence

‣Basic code: pre-roll – content – post-roll

‣ GO TO FLASH »

22

22

of 24

Getting fancy: filters and masking

‣How masking differs from alpha channel video

‣What’s possible

‣What NOT to do

‣Basic code:

‣How to mask a video

‣How to apply a filter to a video

‣ GO TO FLASH »

23

23

‣ Take the time to understand encoding

‣Use video in Flash to the fullest, with interactivity

‣ Experiment and be creative!

Flash Video for Professionals:Expert Techniques for Integrating Video on the WebWiley Publishing — July, 2007

http://www.flashconnections.com/

of 24

Go make some video magic!

SERIOUS SKILLS.

Flash Videofor Professionals

Expert Techniques for Integrating Video on the Web

Lisa Larson and Renee Constantini

24

24