Flash Mx 2004

Niveau II

tutorial 11/28

Fichier source

Insérer de la vidéo

L' exercice consiste à incruster de la vidéo dans flash Quick-Time doit être obligatoirement installé sur le poste

Les outils à utiliser

Pour configurer votre interface de travail vous devez ouvrir ces panneaux !

Outil Symbole Descriptif Raccourci
Le rectangle

Trace un rectangle seul ou un contour seul ou les deux à la fois selon que les options de couleur ou de contour sont activées. On peut remplir un ton uni ou dégradé.

L'options "Alt" : le tracé s'effectue à partir du centre

L'option "Maj/Shift" : le tracé est contraint à un cercle parfait ou un carré parfait

R
Le texte

Outil d'écriture qui se paramètre dans les options. On peut écrire du texte statique et non statique.

T

Créez un nouveau document flash de 600 x 400 x 24 ips.

Puis modifiez la couleur de fond si vous le souhaitez.

Importez "2cv.wmv" c'est le format Windows Media Video, un codec (COmpresseur-DECompreseur) en général MPG. C'est assez proche du JPG dans la façon de compresser les images.

I) La video intégrée

On pourra placer le contenu complet d'une video sur une piste, attention au nombre d'images de la vidéo. Une video de moins d'une minute sera gérable. Dans le cas d'une vidéo plus longue, le poids de votre animation s'en ressentira

Bien entendu vous devez régler votre document de travail à 24 images secondes. 12 ips et la vidéo sera ralentie, 48 ips et la vidéo sera accélérée.

II) Paramétrage

Pour diffuser une video sur internet, la configuration des codecs images et son, sont primordiaux. La vitesse de connection, la puissance de la machine, la carte video sont autant de contraintes pour effectuer le meilleur compromis qualité d'image, qualité du son, fluidité.

Si vous avez une machine peu puissante, la lecture d'une vidéo "haute qualité" se fera difficilement : images figées ou saccadées, son désynchronisé ajoutez à cela une connection internet moyen voir bas débit et vous ne pourrez pas profiter du spectacle.

Il faut donc savoir un peu optimiser une vidéo pour le web. Un bon compromis est de rester entre 400 et 600 K/bits par seconde, c'est à dire environ 40 à 50 kilos octes d'informations traités par secondes ce qui est énorme. (imaginez qu'un modem de 56 k/bits traite au meilleur de sa forme entre 3 et 6 Kilos octets par seconde)

Dans le cas d'une connection ADSL (Asymmetric Digital Subscriber Line)

ADSL 512 k = 64 Ko/Sec

ADSL 2048 k = 256 Ko/Sec

ADSL 8 Mo = 812 Ko/Sec

Disons qu'une moyenne serait du 2 à 4 Mo, et oui beaucoup d'abonnés ont des connections très moyennes, hors des villes, loin des serveurs proxy.

Donc basons nous sur du 600 Kbits/Sec, environ 70 kilos octets par seconde son et image compris.

III) Personnalisation

Bien entendu, dans la cas d'une vidéo intégrée, on peut ajouter autant de calques, de graphiques, de boutons que l'on veut.

Personnalisez l'habillage de votre vidéo en ajoutant des calques.

IV) Ajout de boutons et d'actions

Nous avons plusieurs pistes du bas vers le haut :

Piste action images : en bas, une piste vide dans laquelle nous placerons des étiquettes (repères) et un stop au début afin que la vidéo ne démarre qu'avec le bouton "play" que nous allons créer. A

Piste video : la piste de la vidéo intégrée

Piste habillage : notre personnalisation d'habillage

Piste boutons : nous placerons nos boutons "play", "stop", plus des boutons qui iront directement à des étiquettes.

Pour commencer, sur la première étape (frame) de la piste "action image" ajoutons un "stop"

Puis créons notre bouton invisible

Menu du haut > Insertion > Nouveau symbole ou "Ctrl + F8" , créez un bouton dans lequel nous dessinerons un carré uniquement dans l'image clef "cliqué", revenons sur notre séquence principale et glissons ce bouton invisible sur nos textes "Play", "Stop" et deux ou trois autres boutons qui mèneront directement à des images clefs de notre clip video.

Voir le tutorial "diaporama_interactif.html" pour utiliser les étiquettes et les boutons invisibles.

Sur le calque "action image" celui du bas, nous allons ajouter des étiquettes, plus tard nous renseignerons les boutons sur le nom de ces étiquettes.

"F6" pour créer un image clef et y ajouter une étiquette

Plaçons les étiquettes qui correspondent à des étapes fixes que vous avez choisis, nommons-les et renseignons les boutons.

Dans notre exemple l'étiquette "voiture_debout" est placée à l'image 123, donc sur le bouton "1" qui va aller à cette étape nous avons cette action :

on (release) {
gotoAndStop("voiture_debout");
}

Nous aurions pu écrire aussi :

on (release) {
gotoAndStop(123);
}

Placez les étiquettes qui correspondent à vos choix, nommez-les de façon claire et explicite (une bonne habitude à prendre) puis ajoutez les fonctions "goto" à vos boutons.

Enfin ajoutons nos actions "play" sur le bouton "play, et l'action "stop" sur le bouton "stop"

VI) Exportation de l'animation

"Ctrl + Maj/Shift" + Alt + S" ou Menu du haut > Fichier > Exporter > Exporter l'animation