Веб · UI/UX · Разработка · Концепт

North & Bean

Концепт сайта кофейни и мобильный сценарий заказа заранее.Концепт сайта кофейни и мобильный сценарий заказа заранее.

Открыть живой сайт Открыть прототип Все работы

Роль: UI/UX-дизайн и разработка
Тип: Концепт / учебный проект
Результат: Адаптивный сайт, EN + RU
Стек: React, TypeScript

Обзор

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

Бриф

Тёплое первое впечатление и понятный путь к напиткам, истории и практичной информации.

01
Discover
«Что можно заказать?» Фото, названия, описания и цены — вместе.
02
Connect
«Что это за место?» Образы кафе и Our Story.
03
Visit
«Как добраться?» Адрес, часы и контакты в одном разделе.

Что я сделал

01
Визуальное направление
Тёплый скандинавский минимализм: кремовые, эспрессо и латте тона вместо холодных цифровых цветов.
02
Дизайн-система
Cormorant Garamond для заголовков, Inter для интерфейса; Espresso #2B1D17, Latte #C8A77B, Cream #F4EBDD, Paper #FFFDF8; отступы 8 · 16 · 24 · 32 · 48 · 64 · 96, радиусы 12 и 24.
03
UX-структура
Меню, история и «Visit us» — три понятных раздела с чёткой иерархией.
04
UI-дизайн
Десктопные и мобильные экраны в Figma.
05
Разработка
Адаптивный сайт на React и TypeScript, версии на английском и русском, опубликован.
06
Website 2.0
Развитие концепта: новая главная для десктопа и мобильного.
07
Заказ заранее
Мобильный сценарий из пяти экранов: Home (Order again) → настройка напитка → время и оплата → статус заказа → карта постоянного гостя.