Univers Animate CC

De EduTech Wiki
Aller à la navigation Aller à la recherche

Cet article est une ébauche à compléter. Une ébauche est une entrée ayant un contenu (très) maigre et qui a donc besoin d'un auteur.

Introduction

L'environnement auteur Animate CC (qui s'appelait encore Flash CC en 2014) permet de développer des animations et applications interactives pour Flash, HTML5 et WebGL

Objectifs d'apprentissage

  • Se familiariser avec les différents outils et utilisations de l'outil auteur Flash CC

Version de Flash

Les prises d'écran et les mots qui font référence aux outils et fonctions de l'environnement Animate CC sont en anglais. On utilise des versions Anglaises de Animate et de Flash dans nos cours à TECFA puisqu'il existe beaucoup plus de tutoriels, exemples et livres etc. et qu'il est difficile de traduire certains termes dans un sens ou dans l'autre.

Prérequis

  • aucun

Prochaines étapes

Voir aussi, autres versions

Versions de Flash / Animate et majeurs changements

La première version de Flash Professional CC est sortie en 2013. Par rapport à Flash CS6, Flash CC comprend plusieurs nouvelles fonctions.

Il existe plusieurs sous-versions de Adobe Flash CC. Chacune introduit des nouvelles fonctionnalités, dont les suivant (il y en a d'autres ...):

  • La version Flash CC 2013 soutient Flash 13 et 64-bit et possibilité d'utiliser des services cloud (dépôt de fichiers, profiles, etc.)
  • La version Flash CC 2013.1 prend en charge HTML5 Canevas.
  • La version Flash CC 2014 permet d'exporter des dessins en SVG, publier en WebGL, et offre un nouveau éditeur d'animations
  • La version Flash CC 2014.1 soutient Flash 17 et HTML5. Elle offre pinceaux personnalisés, guides d'animation.
  • La version Flash CC 2015 améliore les animation cinématiques,....
  • La version Animate CC 2015.1 change de nom et offre plusieurs petites améliorations. Abandon de ActionScript 2.

Les nouveautés clées d'Adobe Flash Professional CC 2014

Voici les principales nouveautés proposées par la version d'Adobe Flash Professional CC 2014

  • Meilleur support pour HTML5
  • Exportation au format SVG : Exportez n'importe quelle image de votre projet Flash dans un fichier SVG que vous pouvez agrandir pour créer des affiches et autres supports promotionnels.
  • Interpolation des contours de largeur variable : Ajoutez une interpolation de forme à un contour de largeur variable afin de créer une animation à mesure que le contour change.
  • WebGL pour l’animation : Publiez des animations au format WebGL afin qu'elles puissent être exécutées sans Flash Player dans les navigateurs modernes — et qu'elles puissent tirer parti de l'accélération matérielle GPU.
  • Prise en charge des fichiers de projection : Publiez des vidéos sous forme de fichiers de projection Flash (.exe) afin de pouvoir les visionner sur les systèmes non équipés de Flash Player.
  • Contours de largeur variable : Tracez des contours dont la largeur peut être modifiée en tout point. Créez et enregistrez des profils pour un contour, ou utilisez des présélections de largeur variable.
  • Nouvel Éditeur de mouvement : Particulièrement attendu, l'Éditeur de mouvement mis à niveau permet de régler très précisément les propriétés d'interpolation de mouvement, comme les effets de couleur et les transformations.
  • Annulation au niveau de l’objet : Cette fonction est de retour. L'annulation au niveau de l’objet permet d'annuler une action sur un objet sans toucher à celles effectuées plus récemment sur d'autres objets.
  • Prise en charge de l'extension HTML5 : Flash Professional prend désormais en charge les panneaux HTML5, ce qui permet aux développeurs d'enrichir les applications de fonctionnalités et de contenus.

source : http://www.adobe.com/fr/products/flash/features.html

Eléments abandonnés:

  • Les "common libraries" ont été enlevés dans Flash CC. Les boutons, sons et n'existent plus (enfin on peut les créer soi-même). Autre alternative: On peut les trouver dans Flash CS6:
    • Dans Flash CC: File -> Import -> Open External library
    • Ensuite dire ou est le fichier *.fla qui contient les objets de la bibliothèque, par exemple:
C:\Program Files (x86)\Adobe\Adobe Flash CS6\Common\Configuration\Libraries\Buttons.fla
etc.
  • Pour la variante HTML5 il n'y a pas de composants. Les composants sont programmés en ActionScript et c'est donc logique. Par contre, Adobe pourrait fournir l'équivalent en JavaScript un jour ...

Principales nouveautés proposées par la version d'Adobe Animate CC 2015

  • Import de fichiers SVG (voili cela fait 15 ans que l'on attend cela ...)

Installation

On vous conseille d'installer la version Anglaise, car la documentation pour la version françaises a souvent des retards importants.

Avant de télécharger Flash, il règler les "Apps" dans l'outil Adobe Creative Cloud (menu "roue" en haut à droite -> Préférences; TAB "Creative Cloud", Apps). Instructions plus détaillées selon Aide Creative Cloud / Réglage de la langue d’installation | CCM (5/2015):

  • Dans l’application Creative Cloud pour le bureau, cliquez sur l’icône en forme de roue dentée, puis sélectionnez Préférences.
  • Dans la boîte de dialogue Préférences, cliquez sur Apps.
  • Dans la liste Langue de l’app, sélectionnez la langue d’installation.

Remarque : ce paramètre s’applique aux applications récemment installées avec Creative Cloud. Pour modifier la langue de l’interface utilisateur des applications actuellement installées, désinstallez celles-ci, puis réinstallez-les à l’aide d’Adobe Application Manager'.

Remarque: On trouve étonnant qu'il faut désinstaller. Pourquoi Adobe ne sait pas créer des applications multilangues ? Effectivement, d'après notre expérience, il ne suffit pas de changer de lange et de réinstaller, il faut désinstaller !

Démarrer Flash CC

Lors du démarrage d'un projet il est impératif (comme dans CS4 à CS6) de choisir le format cible:

  • HTML5 Canvas (avec JavaScript)
  • WebGL
  • ActionScript3 (Flash)
  • Air (variantes Desktop, Android, iOS)
  • ActionScript pur (Classes, Interfaces, ...)
  • JSFL pur

En Anglais (lors du premier démarrage):

Animate CC 2015.1 English version

En français (environnement de travail en configuration "designer") pour une vielle version Flash CC 2014.1

Adobe Flash CC 2014-2015-05-05.png

Documentation officielle

Les aides pour les produits Adobe ont souvent un peu de retard et souvent beaucoup de retard pour la version française:

Tutoriels vidéo de Flash cc Photo

Gestion de fichiers

Créer une tête cartoon Tutoriel 3

Créer des applications AIR Tutoriel 4

Interpolation de movement Tutoriel 5

[1] Tutoriel 6

Configuration de l'espace de travail Animate CC

Comme pour tous les produits Adobe on peut adapter la disposition des outils (menu déroulant en haut à droite). On conseille d'utiliser:

  • la configuration "designer"
  • la configuration "small screen" si vous avez un petit écran.

Pour savoir comment bouger les panneaux, voir Univers Flash CS5 L'interface est est très similair ....

Exportation de Flash CC à HTML5

Flash Creative Clouds est la première version de Flash qui permet de concevoir des animations HTML5/Canevas de façon intégrée. L'utilisateur peut choisir de produire en HTML5 et JavaScript en même titre qu'il peut choisir de produire en AS3, AS2 ou AIR. Les fonctionnalités sont toutefois plus limitées. Il existe aussi un outil qui facilite la migration.

  • [fr] Menu Commandes -> Convertir en HTML5 Canevas à partir de formats de documents AS3
  • [en] Menu Commands -> Convert to HTML5 Canevas ....

Cette exportation ne prend en charge que les graphismes et animations. Il va falloir traduire manuellement le code ActionScript.

Liens