QR Cafe dark theme
QR Cafe light theme
Task flow and wireframes

During the first week, I worked on the wireframe variations for the key user journey, which begins with selecting a product category and adding item(s) to the cart and ends at placing the order (no payments, all financial transactions are handled in person).

I created multiple variations to show how product categories and individual items could be displayed in the interface. This included accordions, card lists and grids, tabs, modal and other UX solutions.

Project taskflow
I worked on the design for the key task flow that revolves around browsing the menu, adding items to cart and placing the order.
Three wireframe variations for the main menu page
Three wireframe variations for the main menu page. Left: accordion; center: card grid; right: tabs.
Two wireframe variations for the items view
Two wireframe variations for the item view. Left: row of cards with horizontal scrolling inside an accordion; right: a more traditional list of cards.
Three wireframe variations for the expanded item's view
Three wireframe variations showing an expanded item card with more details.

After three rounds of iterations, we settled on the final flow that consists of only two pages and resolves most actions by expanding and contracting cards to show additional information.

Three wireframes for the fianl flow
Interface design

In the second week of the project, I worked on the two conceptual directions for the interface design. The first one is a classical dark theme associaled with luxury and elegance and aimed at fine dining establishments. The second theme has a modern look using bright colours and rounded shapes and typography to appeal to more casual venues.

QR Cafe dark theme
QR Cafe light theme

The client selected the first style for their minimum viable product, which I applied to all screens in the key user journey. I created an alternative light version of this theme to give restaurants more choice in how their menu is presented.

QR Cafe dark theme
QR Cafe light theme