21/03/2014 L'Animació en Scroll: tendència en disseny web
L’animació en scroll o desplaçament animat consisteix en l’aparició d’animacions i efectes a partir del moviment en scroll que fem amb el ratolí. És un recurs bastant interessant que s’ha posat molt de moda aquests últims anys.
Es tracta d’una nova forma de presentar la informació en una mateixa pàgina i de forma 100% visual. A més, crida bastant l'atenció, pel que no deixa indiferent a ningú i ofereix una experiència interactiva.
Aquests són alguns exemples que hem trobat d’animació en scroll, cadascun amb la seva lògica...
Cliqueu damunt les imatges, feu scroll i mireu què passa!
Fluger Design utilitza l'animació en Scroll per fer un recorregut per tota la web, passant pels diferents apartats. Tot i que podem canviar d'apartat en tot moment, quina millor manera de portar els usuaris pel recorregut que volem?
A mode de One Page, Biz Brain ens mostra els continguts amb aquesta animació en scroll, mostrant el recorregut que fa el cafè fins que arriba a la teva tassa.
Amb un disseny de tipus espaial, aquesta web fa un recorregut per les diferents parts de la pàgina, fins acabar al "contacta".
Aquesta animació en scroll ens dóna la possibilitat de fer preguntes a un personatge, que va responent de forma interactiva.
Kaipoche ha utilitzat l'animació en scroll per realitzar una petita introducció a la web. Després de cridar la nostra atenció, ens invita a registrar-nos o compartir-ho a les xarxes socials.
Aquesta última animació en scroll, es realitza seguint una línia narrativa, a mode de vinyeta de còmic. Després de presentar diferents problemàtiques, finalment el personatge arriba a l'èxit.
Seguint una línia narrativa, l'animació en scroll permet presentar idees, informació i fins i tot productes de forma original i creativa.
Gràcies al parallax podem veure aquests efectes, creant una experiència interessant i que ens crida molt l'atenció. L'efecte parallax és una nova tendència en disseny web. Tot i que en realitat ja s'utilitzava als vídeojocs clàssics, ara sembla ser que torna amb més forces i s'implanta al disseny web.
L'animació en scroll es pot dur a terme amb CSS, JQuery o HTML.
