Menufier — Product design / code

2025-2026

Website

Menufier is a digital menu platform for cafés and coffee shops. Most QR code menus look outdated or feel too vibe coded. My goal was to give small business owners access to good design without having to hire a designer.

Vibe coding

During this project, I've been learning a lot about what coding with AI can actually do. I started with Cursor, moved to Codex, and eventually ended up using Claude Code.

Claude Code became my main tool for the project, going beyond coding and helping me with design, strategic planning, product decisions, and marketing.

Since I started by creating a design system and outlining my design principles to Claude, a lot of the design was created directly in code without ever touching Figma.

Onboarding

Onboarding consists of 6 steps and collects all the necessary information about the place. The goal was to reduce repetitive actions as much as possible. For example, when setting working hours, users can set the hours for one day and copy them to the rest of the week.

  • First onboarding step on a phone: “Let's get started!” with a primary language set to English and a field for up to two additional languages
  • The currency step: a single dropdown set to USD, with the progress bar two segments in
  • The business information step: empty fields for place name, description and address, plus an upload button for the company logo
  • The working hours step: a row per weekday with an on-off toggle, opening and closing time, and a copy button that pushes those hours to the rest of the week
  • The contact details step: fields for phone number, Instagram, Facebook and Telegram
  • The final gallery step: an add-image tile with an 8 MB limit and a “Go to dashboard” button

Dashboard

Unlike many menu builders, I decided not to split the experience across multiple sections and extra navigation. Instead, users land straight on the dashboard with their menu, and most of the work happens right there.

Performing actions like changing settings or adding a new dish happens in modals.

The dashboard on a phone: the venue's cover photo and logo, its name, hours, address and contact links, a row of menu categories, and the cocktails section with edit, delete and reorder controls next to it

Public menu

From the dashboard, café owners can publish their menu and instantly get a public link and QR code. Since this is the part guests actually interact with, I treated the public menu as the core experience of the product.

The published menu as a guest sees it: the café's photo and logo, its name, hours and address, a row of categories, and the breakfast dishes below

Place owners can enable online orders for their menu. Once enabled, guests can place an order directly from their phone, and the order is sent to the café's Telegram through a dedicated bot.

I designed two order flows: takeaway and dine-in. For dine-in orders, each table has a number that guests enter before placing the order, so the café knows where to deliver it.

  • The sandwiches category of the public menu: a grid of dishes with photo, name, weight, price and a plus button on each
  • The same grid after two dishes are added: their plus buttons have turned into quantity steppers and a floating cart button shows the $27 total
  • The cart sheet: a dine-in and takeout switch at the top, the two chosen dishes with quantity steppers, a row of drinks suggested as an add-on, and a “Create order $27” button
  • The dine-in step after the cart: a single table number field filled with 10 and a “Confirm order $27” button

Even if the place owner hasn't enabled online orders, guests can still add dishes to the cart. This helps them keep track of what they want to order and see the total price without having to remember everything.

In this case, guests see a message explaining that online ordering isn't available and that they can simply show the order to the waiter.

The cart with online ordering off: a banner saying to show the order to the waiter, the chosen dish with its quantity, suggested drinks and the total price instead of an order button

Animations

I wanted to pay a bit more attention to the details, so place owners could feel the quality of the product from the very beginning. That's why I added micro-animations throughout the experience.

To create them, I used Emil Kowalski's design skills, which helped a lot throughout the process.

Here's one of them. Set the hours for a day, then copy them to whichever other days you pick — the same interaction place owners run during onboarding.

Closed
Closed
Closed
Closed
Closed
Closed
Closed