Web · UI/UX · Development · Concept

North & Bean

Concept café website with a mobile order-ahead flow.Concept café website with a mobile order-ahead flow.

Explore the live website Open prototype All work

Role: UI/UX Design & Development
Type: Concept / learning project
Output: Responsive website, EN + RU
Stack: React, TypeScript

Overview

Personal concept project for a fictional Copenhagen café: visual direction, UI/UX design and front-end development in one responsive English / Russian website.

Brief

A warm first impression and a clear path to the drinks, the story and the practical details.

01
Discover
“What can I order?” Photos, names, descriptions and prices together.
02
Connect
“What is this place like?” Images of the café and Our Story.
03
Visit
“How do I get there?” Address, hours and contacts in one section.

What I did

01
Visual direction
Warm Scandinavian minimalism: cream, espresso and latte tones instead of cold digital colours.
02
Design system
Cormorant Garamond for headings, Inter for the interface; Espresso #2B1D17, Latte #C8A77B, Cream #F4EBDD, Paper #FFFDF8; spacing 8 · 16 · 24 · 32 · 48 · 64 · 96, radii 12 and 24.
03
UX structure
Menu, story and “Visit us” as three clear sections with a clear hierarchy.
04
UI design
Desktop and mobile screens designed in Figma.
05
Development
A responsive website in React and TypeScript, in English and Russian, published online.
06
Website 2.0
The concept taken further: a new desktop and mobile home page.
07
Order ahead
A five-screen mobile flow: Home (Order again) → Customise drink → Pickup time & pay → Order status → Regulars card.