Domain

App rebuild using AI

React Native · Design System · Agentic Workflow

3 moearly
Time to market
+15%
Sign-up conversion
88–94%
Core task CES
<1%
Customer churn
My role
MVP scopeE2E designDesign system buildAI design to code flow
Context

Homepass is Domain's inspection management app for real estate agents. As the underlying technology aged, maintenance costs and platform risk increased. The goal was to rebuild the app while preserving the experience agents already knew.

Key Decision

We had limited qualitative data. Usage data showed under 5% of agents were on paid plans, so we prioritized rebuilding the free tier. The goal was to ship fast enough to start learning from real usage rather than assumptions. Using React Native Reusables as a component foundation and an agentic design-to-code workflow, we brought the timeline from 6 months to 3.

Before
Home — before
Home
Places — before
Places
Inspection — before
Inspection
Contacts — before
Contacts
Settings — before
Settings
After
Home
Activity
Places
Inspection
Contacts
Contact
App store

The Details

01The problem

Homepass runs daily inspection workflows for 400K real estate agents. The underlying technology was aging past the point of safe maintenance, with a fixed App Store deadline forcing a rebuild within 6 months, and no clear replacement plan risked disrupting a workflow agents depend on every day.

02Constraints
ConstraintImplication
Retain workflowsAgents rely on core workflows to manage inspections
Fixed App Store deadline6 month deadline by which app must be updated to remain on app store
Limited user insightOnly high-level Mixpanel data, no qualitative insights
Small team (1 designer, 3 engineers)Required high-leverage execution
03MVP Scope: Free tier
<5%

Agents on paid plans

Paid and low-usage features were cut from scope. The team concentrated on the workflows that mattered to the 95%+ majority.

MVP — shipped

  • Inspection management
  • Attendee check-in & capture
  • Agent dashboard
  • Buyer profile view

Deferred

  • Kiosk mode
  • Paid subscription features
  • Low-usage listing tools
  • Legacy reporting views
04Design Approach
4.1

Simplified information architecture

From 170 screens to 112 — scope discipline, not feature loss.

Dashboard2
Overview
Notifications
Inspections4
Active list
Inspection detail
Check-in
Attendee capture
Places2
Place list
Place detail
Contacts2
Contact list
Contact detail
Settings2
Profile
Preferences
4.2

Agentic design-to-code workflow

FigmaDesign source
Figma MCP + Code ConnectToken bridge
Claude CodeImplementation
Git RepoShipped
Done

Rather than a traditional design-to-engineering handoff, I implemented screens directly in code and collaborated through pull requests. This reduced iteration loops and improved implementation accuracy.

4.3

Built on an existing component foundation

React Native ReusablesAccessible primitives & touch targets
Foundation
Domain brand tokensTheme layer over the foundation
Brand
Custom product componentsScreen-level composition
Product

This allowed us to move quickly without rebuilding foundational UI primitives, while still delivering a cohesive, branded experience.

05What's next
Phase 1 — shippedFunctional parity + retention
  • 112 screens rebuilt
  • Core workflows preserved
  • CES 88–94%
  • Churn <1%
  • Mixpanel instrumentation
Phase 2 — nextDelight layer
  • Micro-interactions
  • Illustrations & empty states
  • Motion design
  • Personalisation surface
  • Onboarding refinement
Phase 3 — discoveryPaid feature growth
  • Jobs-to-be-done research
  • Paid tier feature discovery
  • Agent intelligence features
  • Cross-sell opportunities
  • Revenue instrumentation