Roofstock Broker Portal
Replacing manual processes with automated workflows to improve agent efficiency and scale transaction operations.
B2B
0-1
Web App
Startup
Industry
Real Estate
Duration
3 months
Responsibilities
Contextual Inquiry & Workflow
Data-Driven IA & Prioritization
Scalable Design Patterns
Rapid Prototyping
Usability Testing
Quality Assurance
Team
1x Product Designer
1x Product Manager
5x Engineers
2x Stakeholders
1x Legal Partner
Project Overview
Business Context
Roofstock helps institutional investors buy, sell, and manage single-family rentals at scale. When mortgage rates surged post-pandemic, investors pivoted from buying to selling—triggering an unexpected spike in property sales.
Business Challenges
No systematic workflow to handle growing volume without more headcount.
Limited visibility into deal progress and bottlenecks.
Manual compliance reviews slowed every transaction.
User Problems
Fragmented workflows: Agents juggled multiple tools, emails, and sheets to manage tasks.
Scattered deal data: Hard to see what’s done or what’s next.
Collaboration friction: Disconnected threads caused misalignment across teams.
Results & Impacts
Rapidly onboarding into a complex, high-stakes domain to deliver a viable MVP within a tight 3-month timeline, resulting in a 40% reduction in manual entry task time and 100% adoption by network agents.
Solution
Dashboard
Quick snapshot of deal performance and upcoming tasks
Property Workspace
Property details, tasks, listing information, and documents — all in one place
My Design Process in Startup Mode
Rapid Discovery
10+ User & Stakeholder Interviews
Competitive Analysis
Domain & Desk Research
Definition
Problem Framing & Validation
Workflow & Journey Mapping
Information Architecture
Design Principles
Feature Prioritization
Weekly Design Sprint
Interactive Prototyping (Figma)
Cross-Functional Alignment
Usability Testing
Design System Contribution
Parallel Development
Developer Collaboration
Edge Case & State Validation
Comprehensive Test Case Development
Responsive QA & Bug Triage
Weekly Design Sprint
Monday
PRD Review with PM
Research Analysis
Tuesday
Design Exploration
Wednesday
Design
Design Critique & Dev Sync
Thursday
Usability Testing
XFN teams Meeting
Friday
Design Refinement
Design Handoff
From Research to Strategic Design Principles
I led 10+ stakeholder interviews across operations, compliance, and leadership to identify critical friction points and synthesize them into three strategic design principles that guide all product decisions.
User Pain Points
Hard to track deal progress due to scattered information across tools.
Manual work, double entry, and hunting for info waste time on admin tasks.
Varied tech comfort across agent age groups.
Business Goals
Gain visibility into pipeline status and bottlenecks
Identify performance gaps
Shorten deal cycle
Increase deal volume
Increase revenue
Speed up onboarding
Drive platform adoption across user types
Design Principles
Single Source of Truth
Centralize transaction data for faster, confident decisions.
Automated Workflow Orchestration
Automate coordination to reduce manual work.
Cognitive Simplicity
Lower mental load with organized and consistent design.
Solving the Information Architecture Puzzle
Real estate deals are messy—you've got documents, inspections, compliance checklists, all happening at once. We knew the IA had to be right from the start, so I ran workshops with the PM and team to figure out the structure to ensure it reflected real agent behaviors and reduced cognitive load.
Iterative IA Process
Broker Portal IA
Design Principles
Workflows
User Mental Model
Content Structure
Crafting the Broker Dashboard Experience
Agents juggle 10+ deals simultaneously, each with dozens of tasks, documents, and deadlines. The dashboard needed to answer three critical questions instantly: "What needs my attention right now?", "What's at risk of falling through?", and "Where are my deals in the pipeline?"—all without cognitive overload.
Clarity
Complete Pipeline visibility at a glance
Control
Easy access to high-priority actions
Direction
Clear next steps without hunting
Exploring Dashboard Layout
Table View
Deal Metrics
Transactions
Traditional spreadsheet-style with rows for each deal. Dense information but overwhelming for scanning priorities.
List View
Deal Metrics
Transactions
Vertical list with expandable details. Clean but requires scrolling to see all deals.
Kanban View
Deal Metrics
Pre Listing
On Market
Under Contract
Pipeline stages with draggable cards. Good for status tracking but takes longer to develop.
Card View
Selected
Deal Metrics
Transactions
On Market
Under Contract
Scannable cards with key metrics and actions at-a-glance. Balances information density with visual clarity.
Refining the Deal Card
Revise BPO
Due: Today
7436 N Painted Sky Way, Glendale, AZ, 85383
On Market
V1
User Feedback:
Agents have strong mental models organized around properties, not tasks.
7436 N Painted Sky Way
Glendale, AZ, 85383
On Market
Revise BPO
Due: Today
V2
PM Feedback:
Observed that agents were still clicking into cards to get basic context. Show key property data on the card so agents don't have to open every deal to get context.
7436 N Painted Sky Way
Glendale, AZ, 85383
On Market
Listing Price: $459,000
DOM: 12 days
Submit Weekly Report
Due: Today
Final Version
Rationale:
Added contextual property data to reduce “click-to-check” behavior and introduced clear visual dividers to separate property details from task information.
Dashboard Prototype
Dashboard
At-a-glance deal metrics
Property status visibility
Tasks ranked by urgency
Fast task actions from the dashboard
Streamlining Complex Tasks for Speed and Confidence
Agents need to complete 14+ complex, sequential tasks—finishing one before moving to the next. The system needed to be intuitive, reduce manual work, and ensure every task is traceable and compliant. I mapped all 14 tasks to identify common patterns and create one unified flow that works universally.
Phase 1
Task Analysis
Mapped all 14 tasks to identify common patterns and create one universal flow for all tasks.
Phase 2
Efficiency Opportunities & Prioritization
Brainstormed design opportunities to improve task efficiency and used a prioritization matrix to decide what to design first.
Phase 3
Leverage Design System
Utilized design system components for rapid iteration and created new reusable components to contribute back to the system for future design speed.
Task Flow Prototype
Task Flow
One streamlined design pattern for all task types
Reusable task requirements, statuses, and history components
Integrated progress disclosure form
Learning
Navigating Ambiguity with Collaboration and Alignment
When I joined this project, I had no prior domain knowledge, and the initial requirements were broad and ambiguous. It was intimidating at first, but I learned to navigate ambiguity by communicating openly and learning from my team. I focused on trusting the design process and building clarity step by step alongside others. Designing early prototypes and sharing quick visuals gave the team something tangible to align on. Through consistent communication and alignment, we turned uncertainty into a shared direction — helping the team move forward with confidence.
Designing at Fast-Paced Startup
Working in a fast-paced startup environment taught me to design and iterate alongside development. With limited design time, I leaned on rapid prototyping and early weekly testing systems to validate designs quickly and de-risk decisions. I focused on building reusable task patterns to improve efficiency and leveraging the design system to accelerate delivery. Over time, I began contributing back to the system, refining components and patterns to support future design speed and consistency.