05Бренд-сайт / 2026

MELNIKПуть настоящего зерна

История вымышленной пивоварни. Страница ведёт от зерна и мельницы к варке и дегустационному набору.

Тип
Концепт сайта пивоварни
Год
2026
Роль
Веб-дизайн, интерфейсы и разработка
Статус
Авторский концепт
Бутылка и бокал пива в концепте бренда MELNIK
Главный визуальный кадр проекта MELNIK

01О проекте

Что я здесь пробую

В MELNIK я пробую построить сайт вокруг пути продукта. Это концепт пивоварни: зерно, мельница, варка, выдержка и, наконец, дегустационный набор.

02Задача

Собрать рассказ из этапов производства

Производство здесь должно быть частью основного рассказа. Я не выношу его на отдельную страницу: каждый следующий экран продолжает путь зерна. Предложение набора появляется, когда этот путь уже пройден.

03Как устроена страница

Куда ведёт история зерна

01

Зерно и мельница дают начало истории. Сразу видно, о каком материале идёт речь.

02

Следующие главы показывают этапы производства по порядку.

03

В конце появляется набор. Он связан с тем, о чём страница рассказывала до этого.

04Что я пробовал

Тёплый свет и смена сцен

Здесь я экспериментировал с последовательными сценами и тёплым светом. Коричневые оттенки, крупные предметные изображения и короткие пояснения связывают главы. Анимация сопровождает переход к следующему этапу.

Что есть на сайте

  1. 01Hero бренда
  2. 02Происхождение зерна
  3. 03Мельница
  4. 04Варка
  5. 05Выдержка
  6. 06Дегустационный набор
  7. 07Контакт

05Визуальная система

Типографика

Плотный характерный заголовок сочетается с нейтральным текстом, чтобы история оставалась читаемой.

Компоненты

Иммерсивный hero, главы процесса, product close-up, предложение набора, CTA.

Палитра

#120D08#F1D7B2#A9511E#5C2D16

06Ключевые экраны

Первый экран концепта пивоварни MELNIK
01

Атмосфера с первого экрана

Тёплый свет и предметы на тёмном фоне открывают историю.

Экран процесса производства в MELNIK
02

Производство как история

Зерно и этапы варки становятся последовательными главами страницы.

Предложение дегустационного набора MELNIK
03

Следующий шаг

К набору прихожу в конце рассказа, когда уже показан путь продукта.

Responsive

Один сценарий на разных экранах

WebGL-эффекты упрощаются на слабых устройствах, главы остаются последовательными, а текст и CTA не зависят от сложной анимации.

HTML/CSSJavaScriptThree.jsWebGL

07Результат

Что создано

  • Собраны главы от происхождения зерна до дегустационного набора.
  • Добавлены предметные сцены и переходы между этапами.
  • Это авторский концепт. Он не подтверждает существование пивоварни или коммерческие результаты.
Посмотреть концепт

На связи · Кирилл

Хотите спросить об этой работе?

Можно написать о MELNIK или рассказать о своей идее. Объясню, как устроен этот концепт и что может пригодиться вам.

Напишите мне