SALT AND PEPPER x Matthew Fisher: креативный e-commerce на Shopify API — 50К просмотров за 60 дней

SALT AND PEPPER — студия веб-разработки, которая специализируется на разработке креативных сайтов с нестандартной анимацией и сложным фронтендом. В этом кейсе рассказываем, как разработали премиальный e-commerce сайт для нью-йоркского художника Matthew Fisher — на базе React Web App с интеграцией Shopify Storefront API и проприетарным кастомным скроллом с алгоритмом предсказания. За первые 60 дней сайт собрал более 50 000 просмотров, а коллекции были полностью распроданы. Проект получил Site of the Day, Developer Award и Mobile of the Week от Awwwards, FWA of the Day и Winner of the Day от CSSDA — и открыл долгосрочное сотрудничество с клиентом ещё на два проекта.

Мэтью хотел создать сайт, который бы привлекал внимание арт-сообщества США и Нью-Йорка в частности. Нужно было заявить о себе, поэтому мы с партнерами вложили много сил в дизайн, плавность анимаций и общее ощущение премиумности.

Основа сайта — React Web App, который работает на базе Shopify Storefront API. Это позволило нам создать уникальный дизайн, встроить крутые галереи и анимацию, сохранив при этом функциональность электронной коммерции. В итоге сайт может не только работать как интернет-магазин, но и выглядеть так, как вы хотите.

В основе сайта — наш собственный скролл. Мы его используем практически в каждом проекте, при этом итеративно улучшаем его производительность. Пользовательский компонент прокрутки помогает нам обеспечивать безупречное взаимодействие между компонентами, синхронизировать HTML-блоки с элементами WebGL, а также выводить только видимые элементы сайта для повышения производительности.

Наша любимая часть — алгоритм предсказания. Основываясь на предыдущих действиях пользователя, он сообщает нам, какие элементы скоро появятся на экране, что обеспечивает их видимость. Этот алгоритм не только помогает обеспечить плавную и бесшовную работу на любом устройстве, но и гарантирует высокую производительность галерей изображений с быстрой прокруткой, где положение элементов резко меняться от кадра к кадру.

За первые 60 дней сайт был просмотрен более 50 000 раз, а некоторые коллекции были полностью распроданы. После успеха сайта Мэттью предложил сотрудничество по двум другим проектам: сайту для его второй коллекции и цифровой экспозиции "The Quarry House".