Introduction à Adobe Edge

Edge est un nouvel outil proposé par Adobe pour réaliser des animations interactives en HTML5, CSS3 et JavaScript.

Le logiciel est encore en preview et est donc susceptible d'évoluer rapidement. Cependant Edge propose un ensemble de fonctionnalités uniques et efficaces.

Dans cette présentation avancée, après avoir installé le logiciel, nous verrons les diverses méthodes de travail disponibles dans Edge :

• création et import d'éléments, que ce soit directement sur la scène ou en incorporant des éléments créés pour ce sujet (fichiers JPG, PNG, SVG, etc.),
• animation d’éléments sur une timeline efficace pour un rendu immédiat calé à la milliseconde avec gestion d'accélération et des keyframes,
• ajout d'extraits de code JavaScript pour rendre votre page interactive directement ou même convertir des éléments en déclencheur,
• quelques astuces pour aller plus loin, notamment en matière d'animation d'un site HTML existant ou de l'utilisation d'Illustrator dans l'export de scène.

Vue d'ensemble de la formation :

Introduction à Adobe Edge Preview 3

Dans ce chapitre, nous faisons un tour d'horizon d'Edge et nous démarrons la prise en main, à la fois via l'installation et la découverte de l'interface.

Premiers pas dans Adobe Edge Preview 3

Maintenant que nous savons à quoi ressemble notre espace de travail, nous allons créer et importer nos premiers éléments dans Edge.

Animer une page web simple dans Edge Preview 3

L'animation, bien que basique, est assez instinctive dans Edge. Voici quelques astuces et spécificités qui vous permettront de gagner du temps.

Interactivité et code dans Edge Preview 3

Edge génère du HTML5 (ainsi que des CSS et du JavaScript), ce qui nous ouvre énormément de possibilités en termes d'interactivité.

Aller plus loin avec Edge Preview 3 

Utiliser Edge dans le monde réel, c'est déjà possible !

Les nouveautés d'Edge Preview 4

Dans ce chapitre le formateur Franck Payen vous présente les nouveautés d'Edge Preview 4.