Share
Edge est le dernier outil de conception à avoir frappé Adobe Labs. Il permet aux concepteurs d’apporter du contenu animé aux sites Web, en utilisant des normes Web telles que HTML5, JavaScript et CSS3..
Au cours de cette introduction, nous allons faire connaissance avec l'interface, examiner la chronologie et appliquer une animation à un projet réel..
Nous allons commencer par apprendre à connaître l'interface de l'application.
Dans ce screencast rapide, nous allons vérifier la chronologie et animer.
Au cours de ce troisième exercice, nous allons reprendre ce que nous avons appris dans les deux vidéos précédentes..
Que génère exactement Adobe Edge en termes de fichiers et de code? Eh bien, un petit projet Edge crée un dossier qui ressemble à ceci:
Vous pouvez voir clairement le fichier de projet Edge ainsi que tout le contenu du déploiement. Il y a un fichier html avec les fichiers css et js qui l'accompagnent, puis toute une série d'actifs, y compris jQuery, des outils js et tout ce que vous avez importé dans le projet..
En termes de code généré, consultez le source pour le code HTML de base. Ne pourrait pas être plus simple!
tester
Le contenu est entièrement ajouté à la scène via le fichier javascript et manipulé par la suite..
contenu: dom: [id: 'Rectangle1', type: 'rect', rect: [88,82,119,106], remplissage: ['rgba (192,192,192,1)'], trait: [0, "rgba (0, 0,0,1) "," aucun "],, id: 'Image1', type: 'image', rect: [0,0,755,600], remplissage: ['rgba (0,0,0,0) ',' images / Image.png '],, id:' Texte1 ', tapez:' texte ', rect: [155,77,0,0], texte: "peu de texte", police: [" Arial Black, Gadget, sans-serif ", [24," "]," rgba (0,0,0,1) "," normal "," none "," "],,], symbolInstances: [] ,
Accentsconagua