I joined the Hitched team mid-project to evolve early-stage wireframes into a high-fidelity, end-to-end wedding budgeting system. By designing a logic-driven onboarding flow and a dynamic, itemised expense tracker, I transformed complex financial data into a manageable user experience, bridging the gap between a couple’s initial vision and the granular reality of vendor costs and payment deadlines.
Let me see the designs already! >
Role: Product Designer
Working alongside a team of product managers, UX designers, developers, and stakeholders, my role on this project was::
UX Refinement
UI Design
Prototyping
The Overview
Managing wedding finances is notoriously stressful. I was brought in by Immediate Media mid-project to refine and execute the product vision for the Hitched Wedding Planner. The goal was to transform a complex financial tracking task into a streamlined, intuitive web app that helps couples move from a rough estimate to a granular, vendor-level budget.
The Challenge
I joined the team when initial wireframes were already in place. My role was to take these early concepts and evolve them into a high-fidelity, user-ready experience. The primary challenge was information density: wedding budgets involve dozens of line items, deadlines, and suppliers. I needed to ensure the UI felt manageable on mobile while providing the robust tracking tools users need.
Key Objectives
Standardise the Experience:
Mature the existing wireframes into a cohesive, high-fidelity design system that aligns with the Hitched brand and Immediate Media’s standards.
Simplify Financial Complexity:
Reduce the cognitive load of wedding budgeting by designing an intuitive UI that handles high information density without overwhelming the user.
Drive Day-One Engagement:
Create an onboarding flow that provides immediate, tangible value (a baseline estimate) to encourage long-term tool adoption.
Ensure Mobile Utility:
Optimize the itemized list and budget tracking for mobile web, ensuring that users can update costs and deadlines "on the go" while meeting with suppliers.
The Solution
1. Guided Onboarding & Instant Value
I worked on a streamlined, three step onboarding process designed to convert user intent into actionable data. By breaking down the complex task of "setting a budget" into simple, bite-sized questions, the app automatically calculates a custom estimate based on location and scale. This gives couples a professional starting point in under a minute, drastically reducing the friction of starting a new plan.
2. Dynamic Budget Visualisation
The core of the app is the Budget Planner. I focused on creating a clear hierarchy:
The Global Header:
An "Actual Cost" progress bar that updates in real-time, changing colour (red) to alert users when they exceed their total budget.
Categorised Spending::
Organising costs into logical buckets like "Say I Do" or "Let’s Celebrate" to make a large total feel like smaller, achievable tasks.
3. Granular Item Management
I designed the itemised lists to be both flexible and powerful.
Key Features & Design Details
Supplier search: Integrating vendor discovery directly into the budget flow.
Track Discrepancies: Clearly showing the "Est. Price" vs. "Actual Price" to help users see exactly where they are overspending.
Customisation: Users can add, edit, or delete items and sections, acknowledging that no two weddings are the same.
Real-time Calculations: Every time a user edits a line item, the category and global headers update instantly, providing immediate feedback.
Status Indicators: Used visual cues (progress bars and red text) to highlight overspending without making the experience feel "punitive."
Deadline management: A dedicated calendar tool to ensure payments aren't missed, bridging the gap between "budgeting" and "project management."
Results:
By streamlining the transition from the initial estimate to the itemised list, we created a tool that functions as both a financial calculator and a daily planning companion. The final product allows Immediate Media to offer Hitched users a cohesive ecosystem, connecting their vendor directory directly to the user's wallet.”