ASK ME ANYTHING
← Back
Zola Mobile App Designer

Wedding Registry App

Zola is an ecommerce platform that allows couples to create and share their wedding registry online. As lead mobile designer, I owned all app features and redesigned the core shopping experience.

Mobile Design E-commerce UX Product Strategy Design Systems
Zola wedding ring dot matrix visualization

The Problem

Zola's mobile app had grown alongside the web app organically but had never had a dedicated designer. Using the mobile app was much slower than simply visiting the website due to navigation and UX issues.

As Zola's primary mobile designer, I was tasked with creating a design system and updating core pages — particularly the Product Detail Page (PDP) and Product Listing Page (PLP), which were critical to enabling couples to quickly add items to their registry.

My Process

1

Audit & Research

Performed an audit of the existing experience, competitive analysis, and recorded user testing sessions of the live app.

2

Ideation

Summarized findings and presented ideas to the product team. Agreed to explore updated pages with improvements to navigation, SKU selection, and condensed product info.

3

Prototyping

Created wireframes and mid-fidelity prototypes. Used these for live user interviews to gather usability feedback.

4

Iteration

After several iterations, finalized the UX and moved on to high-fidelity designs with the Zola design system I created.

Key Improvements

Product Detail Page

  • Moved title to keep important info in view
  • Reformatted image gallery
  • Improved color/SKU selection dropdowns
  • Condensed product details sections
  • Updated discount code management

Product Listing Page

  • New 2-up grid layout fitting more products
  • Star ratings added to product cards
  • Tags for sales and new items
  • Improved filter placement
Zola Product Detail Page Redesign
Updated PDP with improved gallery, color selection, and condensed product details
Zola Product Listing Page Redesign
Updated PLP with new grid layout, star ratings, and product tags

Explorations

I experimented with different layout densities — showing products in cards, rows, and grids. We tested multiple variations to find the most effective design.

For the PDP, I explored many layouts including moving the title position, reformatting the image gallery, and improving color/SKU selection interactions.

Challenges

Stakeholder alignment: Making changes to the registry shopping process had potential to affect Zola's core business, so all ideas had to be shown to many stakeholders. Navigating these presentations was the most difficult part.

Data limitations: The mobile apps didn't provide reliable data for quantitative analysis. We relied mostly on qualitative testing and pre/post conversion rate comparisons.

Additional Work

App-Specific Roadmap

Created a roadmap focused on mobile-specific use cases rather than just porting web features.

Onboarding Series

Designed an app-specific onboarding education series that introduced users to the app features.

Design System

Built a mobile design system with drop-downs, buttons, and text styles used across the app.

Key Takeaways

  • Mobile ≠ small web — Mobile apps need their own roadmap focused on mobile-specific use cases
  • Stakeholder management is design work — Presenting changes to core business flows requires careful navigation
  • Qualitative fills gaps — When quantitative data isn't reliable, lean into user interviews and testing