How can I put more animation before hover? Help

Hi. I’m an architect from Brazil and I’m studying UX Design. To understand every step and be able to do a great work I’m trying WebFlow to make my animate portfolio so I can see more about UI, etc.
I saw some videos about animation and I’m trying to make my porfolio idea go ahead but without any success. :confused:

Question is: I want to animate the colors to open full page, setting the inicial page to work like a menu, the hover open and show a little preview about what I want to show and than, with the first click the color open full window, with an animation with a good flow to hide the other colors and show the content (different in every color) with a button to turn back for the inicial look of the webpage with a soft animation.

What I did till now:

https://preview.webflow.com/preview/tvweb-0e897e7547fada93180d6a73153f9996?utm_source=tvweb-0e897e7547fada93180d6a73153f9996&preview=51c902a229adf0cf22e4ae669bdb9f64

Hope you can help me with some tips, methods or tutorials.

Thanks. :wink:

Opa, sempre um prazer ver brasileiros por aqui. Voce vai querer utilizar o painel de animações. Veja o resultado que você pode obter:

Vale a pena aprender o IX2, é bem melhor do que definir tais animações mais complexas pelo “Style Panel”

eeei, muito obrigado, to aqui batendo cabeça ainda e tive outros problemas, eu tinha configurado o hover na aba Style, removi essas alterações e fui fazer a animação pelo interactions, tentei seguir as dicas do vídeo porém ainda configurando o Hover, na última configuração de Timed Actions, quando altero para Interaction Trigger, todas as Timed Actions alteram junto, não consigo deixar as duas primeiras com class e a ultima com Interaction Trigger, isso altera algo? Testando tava tudo ok no hover

o problema veio com o click, queria fazer cada cor ocupar 100% da tela horizontalmente e verticalmente porque quero inserir conteúdo em cada cor e quando tento fazer a mesma coisa pra altura, ai tudo sai do lugar