[Adobe Muse] Maîtriser l'effet de renversement/Rollover







Vous pouvez créer un effet de survol dans Muse sans aucun widget. Vous devez juste comprendre comment fonctionne le Panneau d'Etat. Il y a quatre états dans le panneau: normal, renversement, souris vers le bas et actif. Vous pouvez appliquer différents comportements du même élément avec les différents états.

 Dans ce tutoriel, vous apprendrez à réaliser différents effets de survol avec une image.


Vous devrez avoir deux photos différentes de la même personne pour obtenir cet effet. Voici comment faire:

1.Prenez l'outil rectangle et redimensionnez l'image comme vous le souhaitez (assurez-vous que vous êtes en état normal), puis téléchargez la première photo. Réglez l'échelle pour remplir le rectangle.




effet-renversement



2.Cliquez sur l'état de Rollover. Téléchargez la deuxième photo et réglez l'échelle pour remplir le rectangle.  Ici j'ai appliqué un effet d'ombre jaune pour cet état, mais vous pouvez ne pas en mettre ou appliquer un autre effet. Réglez la transition Fade en Normal pour faciliter et en renversement aussi. Faites de même en état actif. 


effet-renversement



Le premier effet de roulement est fait et maintenant vous apprendrez à créer un effet avancé avec le deuxième ensemble de photos.

3.Répétez l'étape 1. Puis allez à l'état de renversement et téléchargez la deuxième image. J'ai ajouté un coup épais, joué au rayon du coin et ajouté une lueur lisse. Il s'agit toujours d'une options, après à vous de faire comme vous le souhaitez essayez de jouer avec les outils et soyez inventif.
Réglez la transition Fade en Normal pour faciliter et en renversement aussi. N'oubliez pas de faire de même chose dans l'état actif.
 





Vous pouvez créer des effets de renversement dans Muse, non seulement en jouant avec une opacité, des ombres ou des lumières, mais vous pouvez jouer avec des traits et des rayons pour créer différentes formes comme dans ce tutoriel.  


Regardez la vidéo pour obtenir des informations plus détaillées. 

 
 

Commentaires

Posts les plus consultés de ce blog

La façon la plus simple d'utiliser Font Awesome dans Adobe Muse

6 Widgets pour relier vos réseaux sociaux à votre site

[Adobe Muse] Menu hamburger avec Lightbox et effets de textes