Dans ce cours en vidéo, je vais vous montrer comment faire un effet de parallaxe dans Adobe XD.
Cet effet permet de donner de la profondeur dans l'animation de vos pages.
Pour bien le comprendre je vous propose de réaliser un exercice complet depuis la retouche des images dans Photoshop jusqu'à la mise en place de l'effet dans XD.
Au programme de ce tuto effet parallaxe dans XD
- Dans la première partie, je vous montre le principe de l'effet parallaxe et comment l'appliquer dans XD
- Dans la seconde partie, nous préparons les images pour notre exercice dans Photoshop
- Enfin, dans la troisième partie nous intégrons le tout dans XD.
Si vous avez des questions, je reste disponible dans le salon d'entraide pour répondre à vos éventuelles questions. Les fichiers de travail sont fournis avec le cours.
Si vous souhaitez vous former complètement sur Adobe XD, je vous propose cette formation !
Bon tuto !
Table des matières de cette formation XD, Photoshop (durée : 1h18m)
-
Introduction et principe
- Introduction gratuit 00:01:04
- Un peu de théorie gratuit 00:01:07
- Le fonctionnement dans XD 00:06:53
-
Préparation dans Photoshop
- Préparation du fond 00:07:37
- Détourage de la montagne 00:06:56
- Première couche de nuages 00:10:21
- Deuxième couche de nuages 00:01:50
- Préparation du document pour XD 00:10:06
-
Mise en place dans XD
- Page d'accueil de barre de menu 00:05:28
- Animation de la page d'accueil 00:08:33
- Animation de la galerie 00:11:26
- Parallaxe et défilement 00:06:24
-
Conclusion
- Conclusion 00:00:37
- Fichiers sourcestélécharger
- Certificat
Formateur : Emmanuel Correia
-
Tuto super clair et bien expliqué, à l'image de la formation complète. Merci
-
Tuto rapide et efficace. Merci Emmanuel !
-
Un effet qui semble pas bien compliqué mais qui demande tout de même pas mal de rigueur dans la mise en place. Ici tout est très clair et concis avec en prime la préparation des sources dans Photoshop qui permet d'éviter quelques pièges. C'est parfait. Merci...
-
Avec quelles versions de logiciels ce tuto est-il compatible ?XD , Photoshop CC
-
Quel est le niveau requis pour suivre ce tuto ?intermédiaire
note moyenne
avis laissés