SHEET 11 — КОТ-КАФЕ / ИЛЛЮСТРАЦИЯ2026

Loaf & Purr

Кот-кафе на авторской чернильной графике: видео вместо статики, знакомство с котами, недельная программа и праздники как отдельный продукт.

Кафе с восемью резидентными котами, куда можно прийти со своим питомцем, отпраздновать детский день рождения и заказать фотосессию. Роль студии — концепция, иллюстрация, арт-дирекшн, UX/UI и фронтенд.

A — ФИЛЬМ ПО ЭКРАНАМ

Видео-прогулка по экранам: вход, главы-дисциплины, магазин и хранилище.

B — ВВОДНЫЕ

Бизнес: Кафе + кошачья комната + праздники + доп. услуги
Аудитория: Взрослые 25–40 и родители детей 4–10
Боль №1: Гость не знает о дорогих услугах → низкий средний чек
Боль №2: Категория выглядит одинаково: фото котов, пастель, скруглённые углы
Боль №3: Решение о визите принимается эмоционально и почти всегда с телефона
Метрика успеха: Заявки на брони и запросы на праздники и фотосессии

Ключевая проблема

Снаружи бизнес читался как «просто кафе, где есть коты». Гость приходил на кофе за 300 рублей и уходил, не узнав, что здесь можно отпраздновать день рождения ребёнка или снять студийную фотосессию. Средний чек упирался в потолок не потому, что услуг нет, а потому, что о них никто не знал в момент принятия решения.

Цели

01За первые пять секунд вызвать желание прийти
02За первые тридцать секунд показать, что здесь тратят не 300 рублей, а 15 000
03Вывести дорогие услуги — праздники, фотосессии, портреты — в навигацию и на главную
04Перераспределить поток с перегруженных выходных на пустые будни
05Сделать сайт узнаваемым в категории с одного взгляда, без логотипа

C — ОГРАНИЧЕНИЯ

Ограничения — не оправдание, а аргумент: они объясняют, почему решение выглядит именно так.

Живых съёмок нет и не будет: котов нельзя ставить в кадр по команде.
Бюджета на регулярный фотопродакшн нет, а контент нужно обновлять к каждому сезону.
Фото конкретного кота устаревает: через год он может здесь не жить.
Основной трафик — мобильный, путь до брони должен быть в одно касание.
Анимации не должны задерживать чтение и обязаны деградировать корректно.

D — КОНЦЕПЦИЯ

Чернильная линейная графика в riso-палитре: кремовая бумага, кобальтовая синь, коралловый красный и чёрная тушь. Ограничения клиента — котов нельзя снимать по брифу, нет бюджета на продакшн — превращены в основу стиля.

E — РЕШЕНИЯ И ОБОСНОВАНИЕ

Первый экран: чернильная сцена кафе

5.1

Иллюстрация вместо фотографии

Задача: Дать узнаваемость и снять зависимость от съёмок.
Ограничение: Котов невозможно снимать по брифу, бюджета на продакшн нет.
Решение: Весь сайт построен на авторской чернильной линейной графике в четырёх цветах — стилистика ручной печати, а не стока.
Эффект: Новая услуга — новый рисунок, без съёмочного дня. Кафе перестаёт быть «одним из»: категория выглядит одинаково, а этот сайт — нет.

Витрина меню сразу под первым экраном

5.2

Видео на первом экране

Задача: Продать состояние, а не список преимуществ.
Ограничение: Звук блокируется браузерами, медленный мобильный интернет.
Решение: Зацикленный ролик без звука во всю высоту окна, постер-подложка под ним, кремовая вуаль слева ради контраста заголовка, две кнопки: «Book a table» и «See the menu».
Эффект: Человек ещё ничего не прочитал, но уже понял, как он будет себя чувствовать. Тем, кто не готов бронировать, есть куда пойти вместо ухода.

Меню: рукописный ритм и честные цены

5.3

Четыре продукта — четыре адреса

Задача: Поднять средний чек, не поднимая цены.
Ограничение: Раньше всё жило одним потоком, дорогие услуги терялись.
Решение: Menu, The Cats, Extras, Parties, Visit — отдельные страницы, на каждую можно вести рекламу и которые индексирует поиск.
Эффект: Дорогая услуга получает собственную посадочную с понятной ценой заявки.

Знакомство с резидентами

5.4

Перехваты на главной

Задача: Рассказать о дорогом тому, кто пришёл за кофе.
Ограничение: Человек не листает навигацию, он листает главную.
Решение: По дороге вниз: «как это работает», знакомство с котами, тизер доп. услуг, недельная программа, витрина меню. Каждый блок заканчивается ссылкой глубже.
Эффект: Рост денег с уже пришедшего человека — самый дешёвый рост: трафик уже оплачен.

Понедельник: Slow Purr Hour

5.5

Недельная программа как игра

Задача: Заполнить пустые будни.
Ограничение: Таблицу расписания пролистывают не читая.
Решение: Интерактивная сцена: нажимаешь день — меняется кот, анимация и реквизит. Под каждым днём кнопка «Book Monday», а не абстрактное «забронировать».
Эффект: Пока человек кликает все семь дней подряд, он семь раз узнаёт, что происходит в кафе в будни. Намерение ловится на пике.

Extras: фотосессии и рисованные портреты

5.6

Анимация с функцией

Задача: Сделать страницу обитаемой, не мешая читать.
Ограничение: Движения много — оно не должно отвлекать и двигать текст.
Решение: Кот-официант ходит по ленте, коты просыпаются под курсором, следы медленно смещаются в фоне, кнопки работают на squash & stretch, разделители прочерчиваются пером.
Эффект: Пользователь получает опыт кафе до визита. Правило: анимация никогда не задерживает получение информации.

Parties: три формата праздника

5.7

Праздники как отдельный продукт

Задача: Показать чек в разы выше кофе.
Ограничение: Праздники раньше обсуждались только на месте.
Решение: Страница Parties с форматами — Little Paws, Big Birthday Bash, Grown-Up Gathering — ценами и брифингом по обращению с котами.
Эффект: Запрос на праздник приходит с сайта уже с понятным форматом и бюджетом.

Форма брони: повод выбирается сразу

5.8

Бронь без трения

Задача: Сократить путь от «увидел» до «забронировал».
Ограничение: Мобильный трафик преобладает.
Решение: Кнопка «Book a table» всегда в закреплённой шапке, форма короткая, повод выбирается списком — так заявка сразу сортируется.
Эффект: Одно касание до брони и заявка, по которой уже понятно, сколько она стоит.

F — ЧТО МЫ СОЗНАТЕЛЬНО НЕ ДЕЛАЛИ

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

G — ДИЗАЙН-СИСТЕМА

#f7efdd

Кремовая бумага

#e2503a

Коралловый акцент

#1f3fa0

Кобальтовая синь

#1b1a18

Чёрная тушь