From Idea to Interface
Took a product from concept to clickable prototype through multiple iterations.
Project Overview
We designed a new customer-facing portal for loan auditing and rebuttal management — a critical tool enabling users to manage audits, respond to defects, and maintain compliance.
This case study focuses on two essential journeys:
Account Access Experience (Login, Password Management, Account Locked)
Rebuttal Workflow (from viewing audits to submitting responses)
The goal was to create an experience that was intuitive, secure, action-driven, and scalable from the ground up.
Role: Lead Product Designer (UX/UI)
Team: Product Manager, Business Analyst, Front-End + Back-End Engineers
Timeline: 8 weeks
Tools: Figma
Problem Statement
Since the portal was being built completely from scratch, the key challenge was to design clear, trust-building flows that would:
Enable easy access and secure account management
Guide users through complex rebuttal workflows with minimal confusion
Surface critical actions clearly at every stage
Prevent user errors, especially in high-stakes defect responses
Design Goals
Create a secure, frictionless account login and password experience
Build an end-to-end Rebuttal flow that is action-oriented and transparent
Reduce cognitive overload by chunking information progressively
Support power users with filtering, search, and quick task prioritization
Process
Defining the Flows
Account Access (Login, Password, Lockouts)
Designed Forgot Password, Change Password, and Account Locked screens with clear CTAs and simplified recovery instructions
Enforced security standards (password policies clearly listed upfront)
Avoided overwhelming users with technical jargon; kept language simple and supportive
Rebuttal Workflow
Mapped the full end-to-end process:
View active audits or completed audits
Drill down into number of audited loans
See loan-specific defects
Respond to individual defects via a sidebar interaction
Upload documents, add comments, and submit responses
Track rebuttal statuses: (Pending, Submitted, Reviewed, Completed)
Each stage had distinct visual status indicators (color-coded) to guide users intuitively.
Key Design Decisions
Login and Password Screens
Created a simple, friendly password recovery flow (with progressive validation rules)
Added visual reassurance for "Account Locked" with a clear CTA to contact support
Listed password rules before form entry to reduce frustration
Rebuttal Interface
Clear Tables and Filtering: Tables with sortable columns, filters by rebuttal status, and intuitive action buttons (View/Respond)
Progressive Disclosure: Display only relevant fields at each stage to avoid overwhelming users
Right Panel Interaction: Allowed users to respond to defects without navigating away from context
Status Tracking: Immediate feedback on submission status (e.g., Awaiting Auditor Review)
Challenges & Solutions
Challenge | Solution |
|---|
Designing secure flows without feeling too restrictive | Used soft, reassuring language and inline guidance |
Managing high information density in Rebuttal screens | Chunked data into manageable views (Audits → Loans → Defects → Actions) |
Avoiding user mistakes during submission | Added confirmation dialogues and autosave for comments/uploads |
Ensuring consistent behavior across states (Locked, Password Change, Forgot Password) | Designed componentized forms and interaction templates |
Final Design Highlights
Clean, branded, minimal login and password flows
Structured rebuttal process: dashboard → loans → defects → responses
Status clarity at each step (Pending, Submitted, Completed)
Intuitive document upload and comment handling
Consistent, clear microcopy throughout for guidance
Reflection
Designing from scratch meant we had the freedom — but also the responsibility — to make every decision thoughtfully.
Balancing security, clarity, and usability was key.
This project strengthened my belief that the smallest interactions — a reassuring password hint, a well-placed upload button — can have the biggest impact on user trust and success.
