Architecture. Pet-проект.
VIMv
Проект для практики работы с событиями, нагруженными анимациями, оптимизацией изображений.
Проект сайта с реализацией прокрутки сайта в "глубину" экрана, перемещением интерактивной секции в виде плитки масонри с помощью мыши и применением css-mask свойств для изменения и анимации изображений.
Хотя сайт адаптирован для работы на мобильных устройствах, в основу взят визуальный эффект и удобство для desktop устройств. В браузере Firefox наблюдаются большие проблемы с производительностью.
Используемые технологии и подходы:
- JS
- SCSS
- БЭМ
- CSS custom properties
- CSS masks
- Picture
- DOM events
- GSAP Draggable
Gulp конфиг: Gulp-VIMv