К проектам
Кейс 03 · Кофейня · Сайт + бренд 2026

BUONO — кофейня:
сайт и фирменный стиль

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

Главная страница сайта кофейни BUONO на ноутбуке
Роль
UX/UI · Бренд-дизайн
Инструменты
Figma · Photoshop · AI
Тип проекта
Сайт + брендбук
Формат
Учебный / концепт
О проекте 01

Кофейня, где меньше — значит лучше

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

Моей задачей было перенести это настроение в две точки контакта сразу — в сайт и в фирменный стиль. Важно было, чтобы человек, который сначала увидел вывеску на улице, а потом открыл сайт с телефона, чувствовал один и тот же бренд: тёплый, аккуратный и не кричащий.

Проблема 02

Как звучать тихо в шумной нише

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

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

Решение 03

Спокойная база и один тёплый акцент

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

Логику взаимодействия я держала максимально прямой. Путь к заказу собран в короткий понятный поток без лишних шагов, а структура сайта повторяет то, как человек обычно выбирает кофейню: сначала атмосфера и популярные напитки, потом меню, история и только затем оформление заказа.

Моя роль 04

Бренд и продукт в одних руках

Это сольный проект, поэтому я вела его целиком: от концепции бренда и фирменного стиля до финальных экранов сайта. Я собрала брендбук — логотип, палитру, типографику и носители, — а затем спроектировала на этой системе все ключевые страницы и пользовательские сценарии. То, что бренд и интерфейс делал один человек, помогло удержать их в едином тоне.

Процесс 05

От настроения к носителям и экранам

Работа шла от смысла к форме. Сначала я сформулировала позиционирование, миссию и ценности бренда, затем закрепила визуальную систему в брендбуке. Уже на готовой системе выросли носители фирменного стиля и структура сайта: пользовательские сценарии, wireframe-макеты, финальные экраны и UI-компоненты. Так бренд и продукт собирались не параллельно, а последовательно — один из другого.

Сайт · лучшие экраны

Ключевые страницы и весь путь к заказу

Нажмите на экран, чтобы рассмотреть его целиком.

Главная Главная страница кофейни BUONO
Меню Страница меню BUONO
О нас Страница «О нас» BUONO
Корзина Корзина BUONO
Оформление Оформление заказа BUONO
Оплата Оплата заказа BUONO
Заказ принят Экран «Заказ принят» BUONO
Контакты Контакты BUONO
Страница 404 Страница 404 BUONO
Дизайн-система сайта

Компоненты, на которых держится интерфейс

Кнопки
Заказать онлайн Забронировать стол В корзину
Карточка напитка
Фото напитка

Капучино

320 ₽
в наличии
Графический акцент

Единственный декоративный элемент системы — узорчатая плитка-азулежу. Она задаёт «домашнее» тепло и появляется дозированно: в герое, в разделах и на фоновых полосах, не споря с основным контентом.

Узорчатая плитка-азулежу — графический мотив BUONO
UI Kit

Все компоненты собраны в единый UI-kit: палитра, типографика, кнопки, карточки, иконки, поля ввода и навигация. Экраны сайта складывались уже из готовых, согласованных между собой блоков — это ускорило работу и удержало интерфейс в одном визуальном языке.

UI-kit BUONO: палитра, типографика, кнопки, карточки, иконки, формы и навигация Открыть целиком ⤢
Брендбук · фирменный стиль

Система, из которой вырос весь бренд

Мудборд

Работа началась с мудборда. Я собрала референсы интерьеров, упаковки и предметной съёмки, чтобы поймать интонацию будущего бренда: приглушённый свет, натуральные фактуры и спокойную кофейную гамму без пестроты. Именно отсюда выросли и палитра, и решение оставлять на экранах много воздуха.

Мудборд BUONO: референсы интерьеров, упаковки и кофейной палитры
Идея бренда

Брендбук BUONO построен вокруг минимализма и тишины. Миссия сформулирована просто: создать спокойное пространство в городской суете, где гость наслаждается идеальным кофе и моментом тишины. Отсюда четыре ценности — качество без компромиссов, простота и чистота форм, экологичность и осознанность, уважение к гостю и его времени.

Бренд говорит с горожанами 25–45 лет, которые ценят сдержанность и премиальное качество. Поэтому весь визуальный язык работает на вычитание: убрать лишнее, оставить воздух, чистую типографику и натуральные материалы — и дать кофе говорить самому за себя.

Поиск логотипа

В процессе разработки были рассмотрены различные визуальные направления, после чего было выбрано решение, наиболее соответствующее концепции бренда. Пробовала и мягкие округлые начертания, и классическую антикву, но в финал вышел строгий геометричный знак с чистыми контурами — он лучше всего передаёт сдержанность и премиальность BUONO.

Рассмотренные варианты логотипа BUONO и финальное решение
Логотип

Основной знак — слово BUONO заглавными буквами строгим шрифтом без засечек (Limelight). В расширенном варианте под ним добавляется подпись «Coffee home» более мелким шрифтом. Логотип живёт только на трёх допустимых фонах — белом, светло-сером и бежевом, — с обязательной зоной исключения и минимальным размером. Цветные версии, тени, градиенты и искажения пропорций под запретом: знак должен оставаться чистым на любом носителе.

Логотип BUONO на белом, светло-сером и бежевом фоне
Цветовая палитра
Светлый фон#F0F0F0
Бежевый#D2BB9A
Кофейный#54301D
Чернила#222221

Дополнительная палитра

Тёплый серый#D8D7D5
Латте#BE8D66
Пыльный#A08C8C
Графит#474A56
Хаки#4E4A40
Типографика
Начните день с идеального кофе
MontserratЗаголовки · 36–48 pt Bold · плотный трекинг
RobotoОсновной текст · 14–16 pt · интерлиньяж 1.5–1.8
Open SansРезервный шрифт для систем без Roboto
Графика и настроение

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

Тёплый характер бренду добавляет узорчатая плитка-азулежу. В печатных носителях её роль берут на себя натуральные материалы, а в цифровой среде — тот же плиточный мотив, что связывает сайт и физическое пространство кофейни в один образ.

Носители фирменного стиля

Как бренд живёт в реальном мире

Нажмите на носитель, чтобы рассмотреть ближе.

Визитка Визитки BUONO
Карта лояльности Карта лояльности BUONO
Меню Печатное меню BUONO
Крафт-пакет Крафтовый пакет BUONO
Холдер для стаканов Холдер для стаканов BUONO
Термокружка Термокружка BUONO
Шоппер Шоппер BUONO
Вывеска Круглая вывеска BUONO
Витрина Витрина BUONO
Фартук бариста Фартук бариста BUONO
Тон бренда

Голос, который звучит во всех точках

«Где кофе говорит сам за себя»

Манифест бренда

«Начните день с идеального кофе»

Стаканы · сувениры

«Свежий. Ароматный. Твой.»

Шоппер · упаковка

«Ваш уголок тишины в сердце города»

Фасад · наружная реклама
Результат

Один бренд — от вывески до экрана оформления заказа

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

9
экранов сайта в потоке
10+
носителей фирменного стиля
1
единая бренд-система
Следующий кейс →

Urban.Lab — сайт коворкинга