café fikasmysa.

Narashino, Japan
カフェ・フィーカスミーサ

A small café. A clear invitation to slow down.

I designed and developed this website for a Swedish-inspired café, bringing its atmosphere, menu and visit information together in one place.

Visit live website

The mobile website uses a compact menu and stacks the café photograph above the About section. — 01 / Desktop + mobileActual website captures

My role: Sole designer & developer
Platform: Webflow
Site language: Japanese
Project type: Café landing page

The brief

Website brief and audience

The brief called for a simple, easy-to-understand café landing page for local residents, families with children, older people and visitors to Kasumi Park. It set a Scandinavian direction: a restrained palette, blue or navy options, oak textures and attention to readability.

This case study revisits the original brief through the finished website. The considerations below are a retrospective reading of the design.

Invite new visitors

Introduce the café and help people decide to visit.

Support returning guests

Give people who know the café a place to find information.

Keep upkeep manageable

Connect to social posts without requiring frequent website updates.

01 / Visual design

Photography and café identity

The opening of the About section shows the café’s entrance, sign and access ramp. — 02 / About · Introducing the physical space

On the site: Interior and exterior photography sit alongside Japanese copy explaining fika and mysa. The café’s name, logo and restrained blue palette give the page a consistent identity.
Why it matters: The brief asked for Scandinavian character and a page local residents could understand. The blue palette and interior photographs carry that visual direction. Showing the entrance gives visitors a reference for the place they are looking for; the Japanese copy explains the Swedish terms.

02 / Menu structure

On the site: The menu groups products into categories including espresso, coffee, tea and cake. Opening the espresso category reveals item names, Japanese labels, prices and hot/iced options.
The tradeoff: Keeping item details inside categories shortens the initial list. Once a category is open, the repeated name and price layout supports comparison. It also adds a step: someone has to recognize that a category opens before they can see what it contains.
What I’d check next: Ask someone to find the price of an iced espresso, starting with the categories closed. Watch where they hesitate, including with keyboard navigation. If the opening cue is missed, revise it and repeat the same task. That would check whether the compact layout helps in use.

Expanded Espresso menu showing English and Japanese item names, prices, and hot or iced choices. — 03 / Menu · An expanded category

03 / Visit planning

Directions, hours and visit information

Access section with the café’s map, directions, opening hours, payment information and amenity icons. — 04 / Access · Information in one place

On the site: Access brings together a map, address, station directions, opening hours, payment methods and amenities. Contact follows with an email field and message area.
Why they belong together: A family planning a visit may need to check the route, opening hours and available facilities together. Grouping those details gives them one section to consult. The next review would follow that whole task and note any information that is missing or difficult to find.

04 / Responsive presentation

Mobile layout and navigation

The mobile capture shows a compact navigation control and a vertical flow from the café image into About. The identity remains recognizable while the content adapts to a narrower screen.

A compact menu leaves more room for the content, but its control still needs to be easy to find and operate. I’d review the route from opening the menu to reaching visit information, together with text contrast, zoom, visible focus, keyboard operation and reduced-motion preferences.

Mobile view of the café homepage and the start of its About section. — 05 / Actual mobile capture

05 / Review

Published site and next review

The delivered experience

A published Webflow website brings the café’s story, menu and practical information into a single journey, with desktop and mobile presentations. Social links and selected Instagram posts connect the website to the café’s wider presence, reflecting the brief’s preference for manageable upkeep.

The result is a place to discover the café, explore what it serves and find the details needed to plan a visit.

Explore the original website

What I’d evaluate next

Finding the essentialsCheck how easily first-time visitors find opening hours, directions and payment details.
Accessible browsingReview the menu and contact flow with keyboard navigation, zoom and assistive technology.
Keeping information currentReview the social-post setup and the café’s content-update routine together.

Project visuals show the live café fikasmysa website.

Explore the café website

Back to selected work Visit live website