YENNI
Усі проєкти

04 / 05

KŌIKEI

Категорія
Їжа та гостинність · Інтерактивне меню
Мова сайту
Англійська
Статус
Незалежний концептуальний проєкт

Суші-бар, де страви виходять за межі сітки, а меню складене як пейзаж.

Відкрити сайт наживо
Fig. 01Головний екран — «A little ocean. A lot of flavour.»

Питання

Що станеться, якщо дозволити їжі виходити за сітку?

Ідея

Вигаданий сучасний суші-бар. Назва означає «рибний пейзаж»: глянцевий лосось, темно-червоний тунець, теплий рис і хрусткий норі, складені як краєвид.

Візуальна мова

Виразна фуд-фотографія та вирізані страви на теплих рисових тонах, жирний гротеск з японськими знаками і закріплена сцена, що складає тарілку під час прокрутки.

01

Тарілка, складена прокруткою

Сім шматочків збираються на одній дошці, розкладаються в підписаний «акторський склад» і нарешті наближаються до одного шматочка — три стани однієї закріпленої сцени.

1 / 3

Fig. 03Композиція, стан 1 — сім шматочків на одній дошці

2 / 3

Fig. 04Композиція, стан 2 — тарілка розкладена й підписана

3 / 3

Fig. 05Композиція, стан 3 — великий план, «Made to disappear»

02

Меню, яким справді користуються

Шість категорій, чотирнадцять страв, кількість і панель вибору, збережена в браузері. Зрозумілі ціни й жодного оформлення, що вдає справжнє.

Fig. 06Меню — категорії та перша страва
Fig. 07Меню — страви з цінами й керуванням кількістю

03

Чотири фірмові страви

Кожна фірмова страва отримує власне кольорове поле, надвеликий шрифт і примітки, що вказують на саму їжу.

Fig. 08Фірмова 01 — Kōikei Salmon з примітками
Fig. 09Фірмова 02 — Pink Tide
Fig. 10Фірмова 03 — Midnight Tuna
Fig. 11Фірмова 04 — Kōikei Selection

04

Той самий апетит на телефоні

На мобільному страви так само виходять за рамку, а фільтри категорій стають горизонтальною стрічкою, яку можна гортати.

Fig. 12Мобільна версія — головний екран
Fig. 13Мобільна версія — меню
Fig. 14Мобільна версія — фірмова страва

05

Ремесло й бар

Розділ про ремесло проводить через сім рухів у горизонтальній послідовності; бар описано через матеріали — темне дерево, глазуровану кераміку, холодне скло.

Fig. 15Ремесло — скручування та формування, два з семи рухів
Fig. 16Бар — матеріали й атмосфера

06

Підпис

Логотип латиницею та японською, а повний перелік авторів фото — просто у футері.

Fig. 17Футер — логотип і автори фото

Деталі дизайну

  1. 01Вирізані страви пливуть між секціями й ламають сітку
  2. 02Японський і латинський акцидентні шрифти поруч
  3. 03Тепла, апетитна палітра з чорнильно-темними контрастними блоками

Взаємодія

  1. 01Фільтри категорій і керування кількістю
  2. 02Панель вибору, яка не приймає замовлень і платежів
  3. 03На сенсорних екранах закріплені сцени переходять у звичайну прокрутку

Технології

  • React 19
  • TypeScript
  • Vite
  • CSS

Автори зображень

Екрани KŌIKEI вище містять фотографії страв з Wikimedia Commons. Зображення зменшено й обрізано, у вирізаних страв прибрано фон. Змінені версії зберігають ліцензію кожного оригіналу.

Показати всіх авторів (31)
  1. Nigiri Sushi (26478725732).jpg — Tim Reckmann from Hamm, Deutschland, CC BY 2.0 (змінено: background removed, cropped)
  2. Sushi mit Lachs (26545054116).jpg — Tim Reckmann from Hamm, Deutschland, CC BY 2.0 (змінено: background removed, cropped)
  3. Sushi vegetarisch (25966206524).jpg — Tim Reckmann from Hamm, Deutschland, CC BY 2.0 (змінено: background removed, cropped)
  4. Maki Sushi (26478758172).jpg — Tim Reckmann from Hamm, Deutschland, CC BY 2.0 (змінено: background removed, cropped)
  5. Sushi (14930650292).jpg — Tim Reckmann from Hamm, Deutschland, CC BY 2.0 (змінено: background removed, cropped)
  6. Nigiri Sushi (26478732232).jpg — Tim Reckmann from Hamm, Deutschland, CC BY 2.0 (змінено: background removed, cropped)
  7. Nigiri Sushi (26505096851).jpg — Tim Reckmann from Hamm, Deutschland, CC BY 2.0 (змінено: background removed, cropped)
  8. Sashimi of São Paulo.jpg — Wilfredor, CC BY-SA 4.0 (змінено: resized, cropped)
  9. Sushi platter.jpg — chidorian from Japan, CC BY-SA 2.0 (змінено: resized, cropped)
  10. Colorful sushi lunch.jpg — Robbie Vize, CC BY 3.0 (змінено: resized, cropped)
  11. Maguro Otoro (fatty tuna) Nigiri.jpg — Zheng Zhou, CC BY-SA 4.0 (змінено: resized, cropped)
  12. Two types of Tuna nigiri, hakami and chutoro, at Uchi Houston location in July 2026.jpg — Gatorfan252525, CC BY-SA 4.0 (змінено: background removed, cropped)
  13. Kasugodai (Baby red snapper) (16220715963).jpg — City Foodsters, CC BY 2.0 (змінено: resized, cropped)
  14. Sushi searing.jpg — Original uploader was Jason Ruck at en.wikipedia, CC BY-SA 3.0 (змінено: resized, cropped)
  15. Roll sushi making.jpg — bandita, CC BY-SA 2.0 (змінено: resized, cropped)
  16. SushiPreparation-10.jpg — Guy Kawasaki, CC BY-SA 4.0 (змінено: resized, cropped)
  17. P. binghamiae,Haba-nori,Katsuura-city,Japan.JPG — katorisi, CC BY-SA 3.0 (змінено: resized, cropped)
  18. Rice, Sushi Bar Montparnasse, Paris 001.jpg — Guilhem Vellut from Paris, France, CC BY 2.0 (змінено: resized, cropped)
  19. Maguro - Shira Nui AUD4.50 each - photo by David (4760493730).jpg — Alpha from Melbourne, Australia, CC BY-SA 2.0 (змінено: background removed, cropped)
  20. Panfried Salmon Nigiri - Shira Nui AUD4.50 each (4759206623).jpg — Alpha from Melbourne, Australia, CC BY-SA 2.0 (змінено: resized, cropped)
  21. Salmon fillet.JPG — BrokenSphere, CC BY-SA 3.0 (змінено: resized, cropped)
  22. Edamame (5700539494).jpg — cyclonebill from Copenhagen, Denmark, CC BY-SA 2.0 (змінено: resized, cropped)
  23. Miso Soup 001.jpg — Ocdp, CC0 (змінено: background removed, cropped)
  24. Matcha (6328677556).jpg — cyclonebill from Copenhagen, Denmark, CC BY-SA 2.0 (змінено: background removed, cropped)
  25. Unfiltered Sake at Gyu-Kaku.jpg — Marshall Astor from San Pedro, United States, CC BY-SA 2.0 (змінено: resized, cropped)
  26. Eingelegter Ingwer (25966203794).jpg — Tim Reckmann from Hamm, Deutschland, CC BY 2.0 (змінено: background removed, cropped)
  27. Wasabi 002.jpg — https://publicdomainq.net/wasabi-japanese-horseradish-0000353/, CC0 (змінено: background removed, cropped)
  28. Day 051 - Photo365 - Fresh (15973465233).jpg — UnknownNet Photography, CC BY-SA 2.0 (змінено: background removed, cropped)
  29. Avocado Hass - single and halved.jpg — Ivar Leidus, CC BY-SA 4.0 (змінено: background removed, cropped)
  30. Salmon caviar on a spoon.jpg — TypeZero, CC BY-SA 4.0 (змінено: resized, cropped)
  31. 氷見 2017 (36947113335).jpg — akiko yanagawa, CC BY-SA 2.0 (змінено: resized, cropped)
Відкрити сайт наживо
Усі проєкти
Наступний проєкт — 05 / 05NŌCTILМузика · Аудіовізуальний досвід← Попередній: MONOLITH

1 / 1