Концепт сайта для мастерской высокой печати — Суворов и Ко
Бумага на первом экране рвётся по прокрутке, а исторические прессы собраны в книгу, которая листается вместе со страницей.
Запись прокрутки сайта от первого экрана до подвала, 1:10. Вживую сайт отвечает на прокрутку и курсор — откройте живую версию.
Что это за сайт
Одностраничный сайт мастерской высокой печати, где визитки, приглашения и фирменную полиграфию печатают на прессах 1895–1971 годов. Страница идёт от крупного заголовка на бумаге к работам, техникам и станкам и по пути объясняет, что такое рельефный оттиск и почему его нельзя сымитировать. В конце — ориентиры цен с разбором сметы и кнопки мессенджеров, чтобы описать задачу и получить расчёт.
Оформление
Светлая гамма цвета небелёной бумаги чередуется с почти чёрными секциями, акцент — приглушённый красный. Заголовки набраны крупной контрастной антиквой Playfair, подписи — гротеском Manrope вразрядку. На снимках оттиски, бумага ручного отлива, станки и работа за прессом.
Кому подойдёт такой подход
- Типографии и мастерские ручной печати
- Ремесленные производства с историей и своим оборудованием
- Студии упаковки и свадебной полиграфии
Что внутри
Бумага рвётся под заголовком
Лист с крупным заголовком вздувается и рвётся по прокрутке, из разрыва к посетителю тянется рука, затем чёрный круг закрывает экран и открывает раздел работ.
Работы и техники под курсором
В списке работ строка по наведению превращается в бегущую ленту с фотографией, а в списке техник снимок проступает сквозь буквы там, где проходит курсор.
Кадр из мастерской в разрыве
Небольшой разрыв в бумаге растёт вместе с прокруткой, пока снимок печатной формы в прессе не займёт весь экран. Так страница переходит от слов к самому производству.
Книга прессов
Четыре станка собраны в книгу: листы переворачиваются по прокрутке, на каждом — фотография пресса, год, место выпуска и его история. На телефоне книга листается вверх, как блокнот.
Постер-пазл и разбор сметы
Постер из двенадцати кусочков собирается по прокрутке, счётчик показывает процент. Ниже — ориентиры цен и пример сметы по статьям: форма, печать, бумага, упаковка.
