Importer du Pixel Art dans Flash (écrit par Jérémie )
Vous aurez besoin d'un logiciel 2D autre que Paint.
Photoshop ou Paint shop pro pour les plus connus.
intro
Le vectoriel pose de grands problèmes de qualité d'image
lorsque la taille des clips est très petite.Les traits deviennent
flous. Pour de petits dessins, impossible d'obtenir la qualité
des curseurs ou icônes windows (par exemple), aux traits bien propres.
Comment remédier à ce problème ? Ben importer des
images en pixel, justement. Ce n'est pas toujours évident.
étape 2 - prérequis
Il ne s'agit pas dans ce tutoriel d'importer des photos ou de grandes
images bitmap ou jpeg. Nous souhaitons ici importer de petites images
avec le meilleur rendu possible et de poids les plus petits possibles.
Pour de telles images, le GIF est le meilleur format, le jpeg s'adressant
plus particulièrement aux photos ou images avec de nombreuses couleurs.
étape 3 - récupération
d'une image
Vous pouvez créer votre image entièrement (en pixel art)
ou la récuperer dans l'environnement Windows (désolé
pour mac ou linux, je ne sais pas adapter).
Pour mon curseur, j'ai ouvert le panneau de configuration > souris
> pointeurs
Cliquez sur la touche "impr écran" de votre clavier et
coller l'image dans votre logiciel 2D.
étape 4 - recadrage ( et les bugs de
flash )
Il faut maintenant recadrer l'image autour de notre curseur.
Attention. Laissez un cadre d'un pixel tout autour
du dessin lui-même !
Flash déforme le dessin si ce cadre n'est pas respecté.
( et quand on sait pas pourquoi, on peut chercher d'où vient le
problème ...)
ici, j'ai laissé un cadre orange pour montrer le pixel laissé,
mais bien entendu pas la peine de le faire en orange sur votre dessin.
etape 5 - gif transparent
on ne veut pas du carré blanc autour du curseur dans notre animation.
le format GIF permet d'exporter notre image avec un fond transparent.
chaque logiciel a sa propre méthode pour créer des gifs
transparents.
si vous êtes coincés, allez sur www.google.fr et tapez "photoshop
gif transparent" ou "paint shop pro gif transparent" (sans
les guillemets).
pour ces deux logiciels, en tout cas, j'ai trouvés des explications
détaillées.
enregistrez votre image et lancez flash.
pour un curseur comme celui la, il ne faut pas plus de 150 octets, c'est
plus que raisonnable, non ?
étape 6 - Importation.
dans flash, cliquez sur fichier > importer (ctrl + r) et allez choisir
votre image.
elle est automatiquement ajoutée sur la scène et dans la
bibliothèque.
si c'est une simple illustration en pixels, pas la peine de créer
un movie clip, en revanche, pour le rendre dynamique, cliquez sur celle-ci
plus appuyez sur F8 (convertir en symbole), choisissez clip (ou bouton),
donnez lui et donnez lui un nom.
Vous pouvez maintenant l'utiliser comme curseur (voir le tutoriel sur
le site dans la rubriques interface/design) ou comme élément
de menu.
Vous pouvez également créer dans votre logiciel 2D l'état
"abaissé" ou "survolé" pour le rendre
interactif.
Si jamais le resultat n'est pas celui que vous attendiez, vous pouvez,
dans la bibliothèque (ctrl + L), éditer les propriétés
de votre image, décocher "autoriser le lissage" et vérifier
quela compression est bien "sans perte".
Les possibilités de Flash sont par ces importations grandement
repoussées. Il est possible d'obtenir un design très propre
même dans de tout petits détails, ce qui reste impossible
en vectoriel. (pour l'interactivité du curseur, n'oubliez pas d'aller
voir le tutoriel "nouveau curseur")