Punto81
← All work
Case Study — P.06

UX.Work & Studies

A collection of UX process work: the FlyUX diploma project in full, a room-finder app exercise, and supporting research — moodboards, wireframes and journey maps — behind other projects in this portfolio.

Program

UX Design Diploma

School

UX Design Institute of Dublin

Project

FlyUX — airline booking website

Deliverables

Research, IA, flows, wireframes, UI

01

FlyUX — Diploma Project

UX Design Institute of Dublin · full process

Booking a flight touches everything UX has to offer: search, comparison, forms, payment, anxiety.

FlyUX was the diploma's capstone project: take a real, high-stakes booking flow — flights, add-ons, passenger details, payment — and design it end to end. The process started with user interviews to understand what actually frustrates people when booking flights online, then moved through information architecture, user flows, wireframes and annotations, before landing on a final high-fidelity interface.

The brief: make searching, booking and managing a flight feel calm, even when the underlying task — travel — rarely is.

Process

Research to interface
01

Interviews

Talked to people about their real flight-booking habits and frustrations — comparing prices, managing bookings, checking in.

02

Site Map

Mapped the full information architecture: Flights, On Board, Inspire Me and every sub-section beneath them.

03

User Flows

Diagrammed the desktop flow and a detailed purchase flow, including edge cases and error states.

04

Wireframes & UI

Annotated wireframes for every key screen, resolved into a final high-fidelity homepage design.

Site Map

Information architecture

Starting from Home, the site splits into Flights (manage booking, before you fly, extras), On Board (flight experience, cabin classes) and Inspire Me (offers, destinations, discover more) — each broken down to the sub-pages a traveller would actually need.

FlyUX site map: Home flow branching into Flights, On Board and Inspire Me sections

User Flows

Desktop & purchase flow

The desktop flow traces a full booking journey — home, airport selection, date and fare selection, passenger details, payment. The purchase flow goes deeper, mapping every decision point and error state along the way, from search to confirmation.

FlyUX desktop flow diagram: home screen through to booking confirmation

Flow diagram — desktop

FlyUX purchase flow diagram with decision points and error states

Purchase flow

Wireframes

Annotated screens

Low-fidelity wireframes for the home page, search flight, check-in and manage booking flows, and results page — each annotated to explain the reasoning behind layout and interaction decisions.

FlyUX annotated wireframes: home page search flight, check-in and booking managing, results page

Final UI

High-fidelity homepage

The wireframes resolved into FlyUX: a calm, image-led homepage built around one question — "Where are you flying to?" — with Search Flights, Check In and Manage Booking handled as equal, always-visible tabs.

FlyUX final homepage design with search flights, check in and manage booking tabs
02

RoomFinder — App Exercise

Property search app · UX study

Information Architecture

Sitemap

A short UX exercise for a room-and-property finder app: mapping Home into App info, Search, Registration/Login and the account area (Favourites, Messages, Log out), down to the Find and Contact end states.

RoomFinder information architecture: Home branching into App, About Us, Contact Us, FAQs, Search and Find

Journey & Flow

Customer journey · login flow

A customer journey map tracks the emotional highs and lows of finding a room — from downloading the app to visiting in person — alongside a detailed login flow covering returning users, sign-up, and password recovery.

RoomFinder customer journey map showing positive and negative experience points from download to visiting the room

Customer journey map

RoomFinder login flow diagram with sign up, log in and password recovery paths

Login flow

Wireframes

Mobile screens

Low-fidelity screens for the full app: log in, intro, register, finder, dashboard, feed, details, map, favourites, chat and navigation menu.

RoomFinder mobile wireframes: log in, intro, register, finder, dashboard, feed, details, map, favourites, chat, navigation
03

Research Archive

Behind the scenes of other projects in this portfolio

Loving Football Trips

Early research

Before the Loving Football Trips brand took shape, the process started here: a user survey on what football means to fans (61% said passion), a user profile built from six interviews, a moodboard setting the visual tone, and early desktop/mobile wireframes for the site.

Survey results: what football means to users, 61% said passion

User survey

Loving Football user profile research based on interviews

User profile

Loving Football moodboard with football imagery and players

Moodboard

Loving Football home page and article page wireframes, desktop and mobile

Site wireframes

UEFA Champions League

Supporting wireframes

Working wireframes behind the UEFA Champions League History section — an annotated low-fidelity pass with editor notes, followed by a cleaned-up high-fidelity layout ready for visual design.

UEFA History page wireframe with annotations and editor notes

Annotated wireframe

UEFA History page high-fidelity wireframe

High-fidelity pass

Across these studies

What ties the work together
01

Every screen decision grounded in research — interviews, surveys, journey maps — not assumptions.

02

Mapping structure before pixels: information architecture and flows first, wireframes second, UI last.

03

The same process behind the polished case studies in this portfolio — just usually kept out of sight.

Next project

P.01 — Loving Football Trips

All Work