The Challenge
Simplifying a workflow for those that spent hours in it
Staff managed housing assignments through a form-based tool that processed one record at a time. With dozens of transfers to process and no way to see the full picture, the work stretched across days.
One record per form
No overview or batch submission. Each housing assignment required a separate form submission, forcing staff to context-switch constantly with no sense of overall progress.
No filters or shortcuts
The members list was a plain table with Edit links per row. There was no way to filter, sort, or select groups of records.
Repetitive workflows without useful validation
Staff repeated the same steps for every record with no inline feedback and no help to follow up on mistakes after validation failure.
High time cost for high-stakes tasks
Housing assignments are compliance-critical. The tool made an already high-stakes process slower and more error-prone than it needed to be.
Approach
Lean UX, but with code
With no dedicated design process, Figma files, and no analytics to pull from, the approach was direct: build fast, test with stakeholders, iterate.
Coded prototypes were my wireframes. Each mockup was coded directly in HTML, CSS, and JavaScript to force design discussions. Stakeholder feedback sessions drove the direction, and every round surfaced something new to optimize.
Before
The original experience
Two separate tools to manage what should have been one workflow.
Members list - one Edit link per record, no filters, no batch control
Single-record form - one submission per assignment, no overview
After
The matrix: batch control in a single view
The redesign replaced two disjointed tools with a single Bootstrap matrix - with all records visible and included filters, batch toggles, and inline validation. Staff could review and act on a full roster.
Housing matrix - all records at once, with filters and batch toggles replacing per-record forms
Results & Impact
From days to minutes
2 days to 5 minutes
A workflow that previously required processing each housing record individually - across multiple days - was collapsed into a single batch operation. Staff could review the full roster, apply filters, and confirm assignments without leaving one screen.
Direct recognition from leadership
The Chief Developer called it the "cleanest solution" in his tenure - unsolicited feedback from the most senior technical voice on the project.
"Cleanest solution" - Chief Developer, DOJ
Reflection
Playing every role at once
This was a rare case where I got to play technologist, designer, and product owner. With no access to analytics, no dedicated designer, and limited time, I leaned into what I knew best: building prototypes in code, gathering feedback through stakeholder demos, and optimizing for real-world use.
It was here I learned that design is iterative and fast: there are always data-backed improvements to make and not enough time to do it all in the first go.
All visuals shown are recreations designed to reflect the original experience. Due to DOJ confidentiality constraints, direct screenshots or code were not used.