Share
Dans l'article précédent, je vous ai expliqué comment utiliser différentes applications pour créer les actifs d'un magazine interactif, puis le processus d'ajout de médias, de mouvements et d'interactivité à ces actifs dans InDesign CS5. Cet article se concentrera sur le dernier jeu: sortie du projet pour livraison via une page Web ou envoi du projet à Flash pour davantage de travail et sortie vers un fichier SWF ou même une application AIR..
La raison pour laquelle j'utilise une présentation de style magazine est la démonstration de nombreuses fonctionnalités d'InDesign CS5. J'admettrai d'emblée, le format de page pourrait en faire un peu trop large. N'oubliez pas que vous pouvez utiliser la taille de page dont vous avez besoin et je suppose qu'une des tailles les plus courantes se situera autour de 800 x 600. Pourtant, le choix est à vous.
Avant de creuser, parlons de l'inévitable "Pourquoi un SWF?" et "Pourquoi un fichier Flash?" des questions. Ils sont valables et la réponse peut en surprendre quelques-uns.
Pendant trop d'années, les designers ont été obligés de s'asseoir sur les chaises le long du mur lors de la soirée Flash. Ils proposeraient de bonnes idées, mais leur influence diminuerait au même rythme que leurs homologues développeurs. Alors que nous entrons dans un monde de communications numériques où le papier et les écrans ne sont considérés que comme des supports d’affichage, la conception graphique devient de plus en plus importante. Les projets conçus pour l'impression, comme vous l'avez vu, peuvent quitter la page d'impression statique et, grâce à l'interactivité, des éléments audio et vidéo peuvent être intégrés directement à la conception..
Le format SWF, notamment avec la version Flash Player 10.1, qui met un monstre de lecteur multimédia entre les mains de tous ceux qui ont accès à un écran, vous permet de créer des prototypes rapides pour vos clients. Ce n’est pas parce que nous «avons compris» que vos clients le feront. Faire le saut intellectuel du papier à l’écran sera une nouvelle expérience et leur donner un swf entre les mains leur permet de "voir" de quoi vous parlez..
Le format Flash ravira les développeurs. Le projet sera décomposé et réassemblé en éléments conviviaux pour Flash qui nécessiteront les compétences d'un développeur Flash expérimenté. Il n'y a rien de cela: "Ouais, il suffit de sortir en Flash et vous êtes dans le jeu." qui semble toujours attirer l'attention de personnes qui n'ont jamais utilisé Flash. Comme je suis friand de dire, "ça n'arrivera pas." Vous verrez pourquoi je dis cela plus tard.
À partir de là, le flux de travail Flash normal prend racine lorsque le développeur rassemble les fichiers de classe, le code et les éléments multimédias qui se construisent et, dans de nombreux cas, s’améliorent, grâce aux efforts du concepteur graphique. Ce qui ravira les concepteurs, c’est que Flash CS5 s’efforce de prendre en compte l’intégrité de la conception. Une fois ce processus terminé, le projet peut être exporté dans le fichier SWF final et intégré dans une page Web à une application AIR 2.0..
Commençons:
Le document InDesign étant ouvert, sélectionnez Fichier> Exporter pour ouvrir la boîte de dialogue Exporter. Sélectionnez Flash Player (SWF) dans le menu déroulant Format, puis cliquez sur Enregistrer..
La plupart de vos choix sont explicites, mais il y en a quelques-uns ici qui pourraient attirer votre attention:
Balisage InDesign (IDL): Ce format permet d'ouvrir le document dans InDesign CS4. Ce n'est pas quelque chose qui nous concerne.
Extrait InDesign: Cela n'a absolument rien à voir avec la fonctionnalité d'extrait de code de Flash CS5. Il vous permet de sauvegarder et de réutiliser des objets sur la page InDesign..
XML: Je parie que celui-ci a attiré votre attention. Ne soyez pas trop excité à propos de celui-ci car il nécessite beaucoup de travail supplémentaire de la part des développeurs. Si vous êtes intrigués par cette option, vous ne pouvez exporter le code XML qu'après avoir:
Remarquez, si cela "flotte votre bateau", assommez-vous.
Lorsque la boîte de dialogue Export SWF s’ouvre, déterminez vos préférences générales pour le fichier SWF..
Passons en revue vos choix:
Dans la boîte de dialogue Exporter SWF, cliquez sur l'onglet Avancé pour ouvrir les options avancées..
C’est là que les pros prennent le relais, car ce panel déterminera le fonctionnement du fichier SWF. Passons en revue vos choix:
Lorsque vous cliquez sur OK, le fichier SWF est créé et, comme vous pouvez le voir sur la capture d'écran, le projet s'ouvre dans une page Web..
OK, réduisez InDesign et ouvrez le dossier SWF…
Pour que nous soyons tous sur la même page, pour ainsi dire, voici les fichiers qui restent bloqués là:
Si vous vous interrogez sur les images, les boutons et le texte, ils sont tous intégrés au fichier SWF..
Pour un développeur ou un concepteur Flash, le passage immédiat à un fichier SWF est "tout simplement pas accompli". Je ne pourrais pas être plus d'accord. Je trouve la fonctionnalité vidéo un peu "basique" et je ne suis pas un grand fan de l'application d'un skin vidéo sur la vidéo en cours de lecture. Également en utilisant les différents panneaux pour "câbler" les boutons et ainsi de suite, lorsque je peux le faire plus efficacement avec ActionScript 3.0, ces fonctionnalités "géniales" d'InDesign donnent plutôt l'impression de jouets "à remonter" qu'autre chose. Ils offrent quand même une opportunité de tester les fonctionnalités, ils ont donc une utilisation. Même dans ce cas, si vous souhaitez créer un fichier SWF allégé, moyen et à chargement rapide, Flash est la prochaine étape du processus..
Avant de vous enthousiasmer à ce sujet, vous devez savoir que cette technique, comme vous le découvrirez bientôt, fonctionne mieux entre Flash CS5 et InDesign CS5; En fait, il s’agit du seul format Flash disponible. De plus, Adobe a abandonné l'option d'exportation XFL dans InDesign. Il s'agissait simplement de donner à InDesign CS4 la possibilité de passer à Flash. L'export Flash le remplace.
Enfin, avant d’exporter, assurez-vous de créer un nouveau répertoire pour stocker les fichiers..
Commençons.
Sélectionnez Fichier> Exporter> Flash CS5 Professional (FLA), puis cliquez sur le bouton Enregistrer pour ouvrir la boîte de dialogue Exporter Flash CS5 Professional (FLA)..
La plupart des choix se trouvent dans la zone générale de la boîte de dialogue d'exportation SWF. Le nouveau étant le texte.
Vous avez quatre choix. Trois - Texte classique, Convertir en contours et Convertir en pixels - ont déjà été couverts. Le nouveau est le texte Flash TLF. C'est la nouvelle façon de gérer le texte dans Flash CS5. TLF signifie «Text Layout Framework» (cadre de mise en forme de texte). Il s'agit de la fonctionnalité qui permet à la typographie d’utiliser Flash. Toute modification typographique apportée dans InDesign sera transférée intacte à Flash. C'est une excellente nouvelle pour les concepteurs. La mauvaise nouvelle est que cette fonctionnalité ne fonctionne qu'avec Flash CS5 et avec Flash Player 10 ou supérieur..
La sélection d'insertion de points de césure discrétionnaires "casse" les mots lorsqu'ils se heurtent au bord d'une zone de texte..
Avant d'exporter vers Flash, vous souhaiterez peut-être effectuer une vérification avant contrôle afin de vous assurer que vous obtenez bien WYSIWYG. Parmi les choses à vérifier:
Réduisez InDesign et ouvrez le dossier Flash..
La seule différence que vous devriez voir entre le contenu de ce dossier et celui de son équivalent SWF est l'inclusion d'un fichier .fla..
Prenez le fichier .fla et ouvrez-le dans Flash CS5 (c’est là que ça devient vraiment cool).
Tout d'abord, le film n'a que trois images. La raison en est chaque propagation dans InDesign, et il y en a trois dans ce document. Il est emballé dans son propre MovieClip (nommé "Spread-xxx") dans la bibliothèque. Tous les boutons utilisés dans le document InDesign sont transformés en symboles de bouton dans la bibliothèque Flash et chacune des images utilisées dans le diaporama - un objet multi-état dans InDesign - est convertie en clip et les images sont ajoutées au fichier Flash. bibliothèque en tant que symboles bitmap.
La mauvaise nouvelle, et pour beaucoup d’entre vous ce n’est pas vraiment une mauvaise nouvelle, c’est toute l’interactivité qui est perdue. Vous devrez "recâbler" le projet à l'aide d'ActionScript 3.0..
Discutons de l'ouverture d'un MovieClip contenant un objet animé.
Dans ce projet, il y a un bloc de texte animé sur la page 3 qui commence par une valeur alpha de 0 et utilise l'effet Envellement du début dans InDesign. Ces effets se déplacent, intacts, dans Flash, sont ajoutés aux calques Motion et les chemins sont entièrement modifiables dans Flash..
Double-cliquez sur une extension sur le scénario principal pour ouvrir le clip et cliquez sur un bloc de texte..
Comme vous pouvez le constater, l'intégralité de la mise en forme du texte, y compris le flux entre les conteneurs, appliquée dans InDesign est reflétée dans les propriétés de texte du conteneur dans Flash CS5. C'est énorme. La seule chose qui manque, c'est le retour à la ligne. il ne passera pas entre InDesign et Flash. Ce qui bouge, cependant, ce sont des images en ligne. Ce sont des images ou des éléments graphiques ajoutés aux conteneurs de texte dans InDesign en tant qu'éléments intégrés. Encore une fois, c'est énorme.
La vidéo et l'audio, des ressources externes typiques, ne sont pas transférés dans Flash. Toute vidéo est remplacée par un espace réservé bitmap de l’affiche de la vidéo d’InDesign CS5 et l’audio est, de ce fait, ignoré. Encore une fois, ActionScript 3.0 permet de mieux gérer ces deux types de supports, ce qui ne représente pas une perte considérable. En fait, l’espace réservé vidéo peut être remplacé par un composant FLVPlayback ou un objet vidéo.
Dans ce tutoriel, je vous ai expliqué les étapes nécessaires pour préparer un document InDesign CS5 en vue de sa lecture sur le Web en tant que fichier SWF ou .fla. Ils sont remarquablement similaires dans la manière dont ils sont exportés, mais les deux formats sont très différents..
Comme je l'ai indiqué, l'exportation de fichiers SWF est utile pour le prototypage et quelques autres utilisations très spécifiques. Pour beaucoup d’entre vous, c’est le .fla, expulsé d’InDesign, qui compte le plus.
Je vous ai montré comment le mouvement, les ressources de page, le texte, l'audio et la vidéo sont transférés dans Flash. L'aspect le plus important est que tous les actifs arrivent dans la bibliothèque Flash, mais qu'un développeur Flash devra faire attention à "rewire" le projet avec ActionScript 3.0. C'est une bonne chose; Ceux qui ne possèdent ni vos compétences ni vos connaissances réfléchiront bien avant d'exporter des documents Indesign au format Flash, car ils pensent que cela résoudra leurs problèmes. Loin de là. Ils commencent juste.
Enfin, une fois que le projet est «câblé» et fonctionnel, il peut ensuite être transféré sur le Web ou intégré à un document XFL et transmis à l’équipe Flex. Il s'agit d'un tout nouveau flux de travail et je suppose que beaucoup d'entre vous le verront comme un travail supplémentaire. Honnêtement, j’ai l’impression que, une fois que vous aurez compris, InDesign est sur le point de devenir un autre outil de notre arsenal, car un flot de tablettes - Android et autres systèmes d’exploitation - sont à notre porte..
Accentsconagua