Edge Animate CC (3.0)

Audio
Faites vibrer les murs avec vos projets Animate, grâce à la nouvelle option permettant d’ajouter des données audio à vos compositions. A l’aide des API audio HTML5 natives disponibles dans tous les navigateurs modernes, vous pouvez lier des événements audio au scénario, ajouter des actions audio à vos éléments ou encore créer des transitions audio afin d’obtenir des effets sonores uniques.

Pour en savoir plus sur l’utilisation des fonctions audio, reportez-vous à la section Ajouter des données audio aux animations.

Mise à l’échelle réactive
Il est désormais aussi facile de créer des projets Animate réactifs que de cliquer sur un simple bouton. Une fois activée, cette option vous permet de mettre à l’échelle votre scène Animate en fonction de la taille de la fenêtre du navigateur ou du conteneur parent, et ce tout en conservant ses proportions.

Chargement de scripts
Intégrez vos bibliothèques JavaScript favorites afin d’élargir les possibilités de vos projets Animate grâce au nouveau panneau de chargement de scripts. Les bibliothèques peuvent être importées à partir de sources locales ou en ligne, puis enregistrées avec votre composition et incluses dans les packs des fichiers publiés.

Mise à l’échelle + Rotation de trajectoires de mouvement
Diverses améliorations ont été apportées à l’édition de trajectoires de mouvement, ce qui vous permet de modifier facilement la taille d’une trajectoire et de la faire pivoter autour de son origine de transformation. Passez le curseur sur une trajectoire de mouvement pour voir ces nouvelles commandes, ou appuyez sur la touche H pour faire disparaître l’incrustation.

Nouvelles commandes de répartition
Les nouvelles commandes de répartition sont disponibles dans le menu Modifier, pour vous aider à aligner et à positionner les éléments sur la scène. Sélectionnez au moins deux objets et cliquez sur Modifier > Répartir dans le menu pour accéder aux différentes options de répartition.

Centrage de la scène
Centrez votre scène Animate dans la fenêtre du navigateur ou tout autre conteneur parent dans laquelle elle se trouve. Vous pouvez choisir de centrer la scène sur le plan horizontal, vertical ou les deux. Pour cela, il suffit de cocher la case correspondante dans les propriétés de la scène.

Image d’affiche transparente pour OAM
Lorsque vous publiez un fichier OAM, vous avez désormais la possibilité d’enregistrer l’image d’affiche sous la forme d’un fichier PNG transparent. Utilisez cette option pour intégrer du contenu Animate dans InDesign ou Adobe Muse si vous souhaitez qu’une scène transparente apparaisse en incrustation par-dessus le contenu de votre document. Remarque : lorsque cette option est utilisée dans une application prenant en charge les fichiers OAM, le fichier positionné apparaît vide en raison de la transparence.

Pour le moment, cette fonction n’est pas compatible avec les folios PDF lors de la publication dans DPS. Pour utiliser une image d’affiche transparente, sélectionnez le type de folio Automatique, PNG ou JPG.

Publication CDN pour OAM
Profitez d’un chargement plus rapide de vos projets Animate grâce à l’hébergement en cache, maintenant disponible avec la publication OAM. Activez cette option si vous créez du contenu Animate en vue de l’utiliser en ligne (Muse, Dreamweaver ou plug-in de chargement tiers).

­

Nouvelles leçons
Deux nouvelles leçons (Mise en forme réactive et Audio) sont proposées pour vous aider à découvrir une partie des fonctionnalités disponibles dans cette version. Cliquez sur « Prise en main » sur l’écran d’accueil ou sur Fenêtre > Leçons pour afficher le panneau des leçons.

Mise à jour de jQuery
Animate utilise maintenant la version 2.0.3 de jQuery, une mise à jour de jQuery 1.7.1.

Prise en charge la fonctionnalité Source Map
Lors du débogage de compositions Animate à l’aide de la fonction Aperçu dans le navigateur ou sur le CDN, vous pouvez maintenant analyser le code compressé des bibliothèques Animate et jQuery. Cette option est disponible dans les navigateurs prenant en charge la fonctionnalité Source Map, tels que Google Chrome.

 

Edge Animate CC (2.0.1)

Cette mise à jour d’Edge Animate CC résout des problèmes de compatibilité avec Internet Explorer 11 et est recommandée pour tous les utilisateurs. Les contenus générés avec les anciennes versions d’Animate ne s’exécuteront pas sous IE11 ; cette mise à jour est nécessaire pour assurer la compatibilité.

Pour mettre à jour un projet, installez la mise à jour d’Animate CC disponible ici et enregistrez à nouveau votre projet. Pour en savoir plus sur les problèmes résolus par cette mise à jour, consultez le blog de l’équipe Animate ici.

Edge Animate CC (2.0)

Trajectoires de mouvement

L’introduction de trajectoires de mouvement va vous permettre d’ajouter des mouvements extrêmement précis aux éléments suivant une trajectoire courbe. Vous pouvez ainsi reproduire l’expérience du monde réel grâce à des mouvements fluides, basés sur des principes physiques, qui ne pourraient pas être obtenus par une animation linéaire.

La translation x/y reste la méthode par défaut pour le contrôle des positions. Pour utiliser des trajectoires de mouvement sur un élément particulier, sélectionnez le bouton radio Trajectoires de mouvement dans le panneau Propriétés. Pour définir les trajectoires de mouvement comme méthode d’animation par défaut des nouveaux éléments de la composition, sélectionnez « Trajectoires de mouvement » dans les paramètres de mise en forme par défaut.

Lorsque les trajectoires de mouvement sont sélectionnées pour votre objet, créez une transition comme vous le feriez ordinairement, avec des images-clés ou l’outil de verrouillage. Une trajectoire est alors tracée sur la scène entre deux points d’ancrage, que vous pouvez modifier pour ajouter des courbes. Les points d’ancrage de fin sont représentés par des triangles pointant dans le sens du mouvement de l’objet.

Pour contrôler la durée d’une trajectoire de mouvement, ajoutez une image-clé Emplacement à la transition Emplacement du scénario. Vous obtenez ainsi deux trajectoires distinctes, dont la vitesse est indépendante. Vous pouvez également ajouter une accélération à votre trajectoire, et ainsi contrôler les variations de vitesse du mouvement de façon réaliste.

Cochez la case Orient. auto. pour appliquer une rotation automatique à vos éléments lors de leur déplacement le long de la trajectoire.

Mouvement de glissement

Vous pouvez maintenant associer des mouvements de glissement vers la droite et vers la gauche à des éléments pour optimiser l’utilisation sur mobile. Le glissement peut être associé à n’importe quel élément de votre composition. Attribuez une action à un événement de glissement comme vous le feriez pour un clic, un double-clic ou autre, via le bouton d’ajout d’actions d’un élément.

Publication optimisée avec hébergement CDN

Bénéficiez de téléchargements plus rapides et de sorties plus simples à gérer grâce à l’hébergement des fichiers exécutables par Adobe via les serveurs Akamai. Désactivez cette option si votre contenu doit s’exécuter hors ligne ou si vous souhaitez utiliser votre propre solution d’hébergement.

Modèles

Vous pouvez maintenant charger, enregistrer et réutiliser des modèles à partir d’une galerie. Il est ainsi possible de charger une composition Animate pour une utilisation de fichier similaire.

Accédez au menu des modèles depuis l’écran d’accueil (« Créer à partir d’un modèle ») ou le menu Fichier. Depuis la galerie de modèles, vous pouvez importer, supprimer et créer une nouvelle composition à partir d’un modèle.

Lorsque vous enregistrez un modèle, un fichier .antmpl est créé, qui peut être diffusé librement et être utilisé n’importe où dans le système de fichiers. Les modèles peuvent inclure des images, du texte, des symboles, des polices, et toute modification personnelle apportée à la composition active. Vous pouvez charger des modèles à partir de l’outil visuel de chargement de modèles.

Défilement des panneaux Eléments/Scénario

Les panneaux Eléments et Scénario affichent maintenant directement les éléments sélectionnés si le défilement du panneau est activé.

Outil pipette

Le nouvel outil pipette se trouve dans la fenêtre du sélecteur de couleurs. Sélectionnez l’outil pipette dans la fenêtre du sélecteur de couleurs pour prélever des couleurs sur la scène.

Codes de couleur du scénario et des éléments

Lorsque vous cliquez sur la couleur appliquée à un élément dans le panneau Eléments ou sur le scénario, vous pouvez attribuer une couleur pour assurer une segmentation facile des couleurs des objets. La couleur attribuée est alors modifiée à la fois sur les transitions du scénario et les éléments.

Niveaux de zoom supplémentaires pour la scène

Vous pouvez maintenant définir un niveau de zoom de la scène allant de 10 à 400 %, pour une vision plus globale de vos projets.

Edge Animate 1.5

Prise en charge des filtres CSS

Les fonctionnalités CSS les plus sophistiquées font leur apparition dans Edge Animate.

Les filtres pris en charge sont :

  • Inversion
  • Rotation de teinte
  • Contraste
  • Saturation
  • Sépia
  • Niveaux de gris
  • Flou
  • Ombre

Ils sont disponibles dans le panneau des propriétés en tant qu’effets animables. Remarque : les filtres CSS font partie des nouvelles spécifications CSS et sont uniquement pris en charge par les navigateurs Chrome 18 et ses versions ultérieures, Safari 6, iOS Safari 6 et Blackberry 10.

Dégradés
Appliquez des dégradés radiaux ou linéaires à vos éléments via le nouvel outil Dégradé. Vous avez maintenant accès aux fonctionnalités suivantes :

  • Ajout de plusieurs étapes de dégradé à vos éléments
  • Création d’interpolations pour les couleurs et le positionnement du dégradé
  • Répétition de dégradés à l’infini en fonction des étapes de couleur
  • Transitions de dégradé disponibles en mode linéaire ou radial (les transitions linéaires et radiales ne peuvent pas être utilisées conjointement)
  • Définition de propriétés CSS pour les dégradés radiaux telles que ellipse-farthest-corner, circle-farthest-corner, etc.
  • Positionnement du dégradé en degrés de rotation pour les dégradés linéaires et en pourcentages x/y pour les dégradés radiaux

Typographie avancée avec Edge Web Fonts

Vous pouvez maintenant parcourir la bibliothèque de polices Edge Web Fonts directement dans Edge Animate et appliquer des polices de la collection à vos compositions. Vous pouvez afficher les polices par style et les ajouter à la bibliothèque de polices au niveau du document.

Nouveau sélecteur de couleurs
Le sélecteur de couleurs a été mis à jour pour vous permettre de modifier les couleurs plus facilement.

Nouveaux modes colorimétriques
Les couleurs peuvent maintenant être définies aux formats RVBa, TSLa et hexadécimal, y compris pour les dégradés.

Curseurs de couleurs
De nouveaux curseurs de couleurs sont disponibles dans les panneaux Couleur et Dégradé et permettent de définir et d’appliquer facilement des couleurs.

Nuanciers réutilisables
Il est possible d’enregistrer des nuanciers et de les réutiliser pour définir des couleurs et des dégradés au niveau du document.

Eléments verrouillés grisés
Les éléments verrouillés apparaissent en grisé sur le scénario et dans le panneau Eléments, ce qui permet de repérer facilement les éléments modifiables.

Outils de préchargement adaptés aux Iframes
Le préchargement est maintenant optimisé pour une utilisation au sein d’Iframes, afin d’obtenir un chargement coordonné des ressources. Les compositions Animate contenues dans des Iframes attendent que le document soit chargé avant de s’exécuter, ce qui permet un préchargement retardé pour les publicités.

Le maintien du mode de modification de symbole lors de l’aperçu
permet que la composition Animate ne retourne plus à la scène lors de l’aperçu dans le navigateur. Animate maintient vos modifications en l’état actuel à chaque création d’aperçu.

Edge Animate 1.0.1

Cette mise à jour inclut la possibilité d’envoyer un rapport anonyme sur l’utilisation des fonctionnalités spécifiques d’Edge Animate. L’objectif est de mieux comprendre les fonctionnalités les plus appréciées par les utilisateurs d’Edge Animate. Ces informations permettent à l’équipe Edge Animate de prendre des décisions éclairées pour définir des priorités et mettre l’accent sur certaines fonctionnalités. L’équipe Edge Animate a établi une relation de confiance avec ses utilisateurs depuis le développement de la version 1.0. Leurs avis et commentaires ont joué un rôle majeur sur le produit final. Grâce à cette mise à jour, chacune de vos actions dans l’application devient un élément d’information exploitable.

Adobe a également traité plusieurs problèmes importants concernant le produit :

  • Prise en charge d’Edge Web Fonts
  • Amélioration des performances sur le contenu publié
  • Correctif iOS 6 pour plusieurs compositions intégrées via iFrame et Adobe DPS
  • Divers correctifs visant à améliorer la stabilité de l’application

Ce produit est distribué sous licence Creative Commons Attribution - Pas d’utilisation commerciale - Partage à l’identique 3.0 non transposé  Les publications Twitter™ et Facebook ne sont pas couvertes par les dispositions Creative Commons.

Mentions légales   |   Politique de confidentialité en ligne