Zoe Asadi

Hevywave

A bold mobile UI concept for discovering and booking local music gigs in Dorset.

Hevywave is a fictional music booking app designed for people who want to discover live gigs, browse local events, and book tickets in a simple mobile flow.

ROLE
UI Designer
TYPE
UI Concept
PLATFORM
Mobile App
TOOLS
Figma
DISCOVER
EVENT DETAIL
TICKETS

The Problem

Music gig apps rely heavily on atmosphere, imagery, and quick decision-making. The challenge was to design a booking app that felt visually exciting without becoming overwhelming — balancing bold concert imagery with clear event information, simple navigation, readable ticket details, and a smooth checkout experience.

The Goal

Create a polished mobile UI experience that lets users move from discovering an event to completing a booking with minimal friction — bold, modern, music-focused, and consistent across screens.

Design System

I built a small design system of reusable components and repeated patterns so the interface stayed consistent across event listings, ticket selection, and the checkout flow.

  • · Event cards
  • · Bottom navigation
  • · Search bars
  • · Primary buttons
  • · Ticket selection controls
  • · Input fields
  • · Event tags
  • · Confirmation state
  • · Icons & navigation actions

Working from shared components made it easier to keep spacing, colour, and typography consistent — and quicker to iterate as the design evolved.

DESIGN SYSTEM · COMPONENTS & STYLES
FINAL DESIGNS · HIGH FIDELITY

Final Solution

The final UI presents a complete mobile booking journey for a fictional gig featuring Crystal Lake and Miss May (Official) at The Brook Pub — from discovery through ticket purchase to confirmation.

DISCOVER
SEARCH
EVENT
TICKETS
CHECKOUT
CONFIRMED
WELCOME

A first-touch screen sets the tone with a bold logo treatment and a single clear path into the app.

DISCOVER

Today / This Weekend / Hot tabs surface what's on locally, with rich event cards driven by a single reusable component.

SEARCH

A grid of compact event cards lets users scan and compare options quickly without losing the visual identity.

EVENT

A bold hero image, artist tags, venue map, and ticket info all live on one scannable page so users can decide fast.

TICKETS

Clear ticket tiers, transparent fees, and a simple stepper keep ticket selection low-friction.

CHECKOUT

Billing details and payment options are grouped into focused sections to keep the form-heavy step calm.

CONFIRMED

A celebratory confirmation state reassures users and offers a newsletter sign-up for future discounts.

Prototype

I built an interactive Figma prototype that connects the key screens — from browsing an event to completing a ticket purchase — so the booking flow could be tested end-to-end and feel closer to a real mobile product.

FIGMA PROTOTYPE · BOOKING FLOW

What I Learned

01.

UI systems in Figma

Building a small set of reusable components paid off quickly — the more screens I added, the faster each one came together.

02.

Mood through visuals

Using bold concert imagery and tight typography helped the app feel music-focused without clutter or excessive ornament.

03.

Clarity beats decoration

Even on an expressive product, the booking flow only worked when hierarchy, spacing, and labels stayed disciplined.

Final Reflection

“Hevywave was a chance to explore a more expressive visual style while still designing around a practical user flow.”

Because this was a UI-focused project, I concentrated on visual hierarchy, layout, consistency, and interaction design rather than full UX research. The result is a polished mobile concept that shows how a local music booking experience could feel bold, energetic, and easy to use.