All projects · Marketing & Lead-Gen
Mortgage Broker Readiness Check
An interactive document-readiness checklist that lets prospective mortgage applicants tick off eight required items and watch a live readiness…
An interactive document-readiness checklist that lets prospective mortgage applicants tick off eight required items and watch a live readiness score, progress bar, and status tier update in real time. Designed as a lead-qualification tool that culminates in a 'Book Your Consultation' CTA once the checklist hits 100%.
- Single source-of-truth state array with progress and tier derived on every toggle
- Three-tier theming (Not Ready / Nearly Ready / Ready to Proceed) that recolors the whole UI
- Real-time progress bar, count pill, and percentage synced to completion
- Context-aware CTA and status copy that evolve with progress
Built with: Vanilla JavaScript, CSS custom properties, Derived-state render pattern, SVG icons