Folio'23

Developer

Designer

- Folio details

_Framework : Nuxt3

_Hosting : Vercel

_CMS : Microcms

_Font : Cinzel

ttl : DistortionScroll

see : New Window

ScrollTriggerでuniform値を変化させて、ノイズマップ切り替えを実現しています。
事例一覧の背景としてなど非常に幅広く活用できる動きを作成できたと思います。
慣性スクロールには、Lenis.jsを採用しましたが使いやすく今後案件にも取り入れていけそうと感じました。

次回は、今回とは違うタイプのノイズをかけてみたいです。


The noise map is switched by changing the uniform value with ScrollTrigger.
I think I was able to create a movement that can be used in a wide range of ways, such as as a background for a list of examples.
I used Lenis.js for inertial scrolling, but I felt that it was easy to use and could be incorporated into projects in the future.
Next time, I'd like to add a different type of noise than this time.


Back to Index
© folio'23

Loading...