Pidapipó interface design overview

Interaction Design

Pidapipó

INFO20005 · User Interface Development

Overview

Pidapipó is an artisanal gelato shop in Melbourne. For this project I designed its brand interface from scratch — a mobile app and a desktop website — then built a working prototype in HTML, CSS and JavaScript. The UI leans on warm, playful colours and clear hierarchy so ordering feels as light as the shop itself.

Role

UI/UX Designer & Frontend Developer

Tools

Figma, HTML / CSS / JS

Platforms

Web & Mobile

Target

Ice cream shop customers

Final Deliverable ↗ Design Process ↗ GitHub ↗

Interface & Implementation

Pidapipó — full page design — Final interface — desktop overview

Pidapipó — menu screen — Menu screen

Pidapipó — cart screen — Cart & checkout

Pidapipó — flavour selection — Flavour selection

Pidapipó — responsive view — Responsive view

Design Process

Pidapipó design document page 1 — Project brief

Pidapipó design document page 2 — Research & moodboard

Pidapipó design document page 3 — Wireframes

Pidapipó design document page 4 — UI iterations

Pidapipó design document page 5 — Implementation notes

Pidapipó implementation document page 1 — Live build