Property Management Dashboard Overhaul
A national property management firm's internal dashboard had become unusable. Three disconnected interfaces, a 47-field form with a 34% completion rate, and zero accessibility compliance. We audited, redesigned, and rebuilt it in six weeks.
- Client
- Crossfield Realty Group
- Industry
- Real Estate
- Timeline
- 6 weeks
- Services
- Accessibility Audit · Accessibility Remediation · Design System · Web Application Development
- Tags
- Results
- 34→91% Form Completion100% WCAG 2.2 AA6wk Timeline
The Challenge
A national property management firm with 2,400+ rental properties across six states had an internal operations dashboard that had become unusable. Property managers were working across three disconnected interfaces to track maintenance requests, lease renewals, tenant communications, and insurance claims.
The claims reporting view alone had a 47-field form with nested conditional logic that staff were abandoning mid-entry. Only 34% of claims submissions were being completed successfully, resulting in an estimated $180K in unprocessed claims per quarter.
The entire platform had zero accessibility considerations, putting the company at risk of ADA litigation from a recent tenant complaint.
Our Approach
Phase 1: Audit and Discovery (Weeks 1-2)
We started with a full UI/UX audit and accessibility assessment across all three interfaces. The accessibility scan identified 142 WCAG 2.2 AA violations. The UX audit mapped every workflow that property managers touched daily and identified where they were losing time, abandoning tasks, or switching between systems unnecessarily.
The claims form was the worst offender. The original implementation rendered all 47 fields on a single page with jQuery show/hide logic that had broken in multiple places. Fields that should have been conditional were either always visible or never appearing when they should.
Phase 2: Design System and Rebuild (Weeks 3-6)
Claims Form Architecture
The entire form was rebuilt in React with a schema-driven approach. Each field's visibility, validation, and dependencies were defined in a single config object. The 47-field form became a guided multi-step wizard with smart conditional rendering. Only the fields relevant to each claim type appeared at each step.
This made the form maintainable and testable instead of relying on brittle DOM manipulation. Form completion went from 34% to 91%.
Data Table Performance
The data tables were loading full datasets on mount with no pagination or virtualization. The maintenance request view, often containing 10,000+ rows, would lock up the browser. We implemented virtualized table rendering with TanStack Table, server-side pagination, and a debounced search/filter system that kept the UI responsive regardless of dataset size.
Lighthouse performance scores went from 38 to 96.
Design System
A shared component library was built in React with TypeScript, documented in Storybook. It covered everything from form inputs and data tables to status badges and notification patterns. Every component had accessibility built in from the start: proper ARIA attributes, keyboard navigation, focus management, and screen reader announcements for dynamic content updates.
The unified design system replaced the three disconnected interfaces with one consistent experience and reduced the frontend codebase by 30%.
Results
- Form completion rate increased from 34% to 91% after restructuring claims intake into a guided multi-step wizard
- 100% WCAG 2.2 AA compliance across all dashboard views, resolving 142 identified violations
- Average task completion time dropped from 12 minutes to under 4 minutes per workflow
- Lighthouse performance scores went from 38 to 96 after refactoring data tables and implementing virtualized rendering
- Frontend codebase reduced by 30% by eliminating duplicate components and consolidating into a unified design system
- $180K quarterly claims backlog addressed by making the submission flow actually completable
- ADA litigation risk resolved through full WCAG 2.2 AA compliance
Key Takeaway
The dashboard was not a bad product. It was a good product with a bad frontend. The data was there. The workflows were there. The business logic made sense. But property managers could not get through a claims form, the tables crashed their browsers, and the whole thing was one ADA complaint away from a lawsuit.
Six weeks of focused work turned it into something the team actually wants to use. That is the difference between a frontend that exists and a frontend that works.
"They came in and in six weeks completely transformed how our team interacts with our platform. Our property managers actually enjoy using the dashboard now, which sounds small but it was a real problem before. The accessibility work alone saved us from what could have been a very expensive legal situation. They're the rare team that understands both the technical and the human side of the problem."
Director of Operations, Crossfield Realty Group