Confidential/2026
Captaleads
A navigable prototype of a lead marketplace for tradespeople: prepaid credits, a real-time auction for phone calls, and two panels, professional and admin.
(01) Overview
The product captures demand through advertising and routes it to plumbers, electricians and other trades as phone calls forwarded to their mobile and as web leads they can unlock. Professionals buy prepaid credits and bid per service and location; the highest bid wins the incoming call. The client's brief described mostly backend logic. My job was turning it into an interface: signup, the professional's panel and the admin panel, under a fictional brand created for the prototype.
Client
Confidential
Year
2026
Services
Design, Development, Strategy
Deliverables
Product design, Design system, Clickable prototype, UI decision log, Demo video
The Challenge
Auction algorithms, retry chains, integrations and automated ad spend make a poor interface if shown as they are. The panel had to let a tradesperson understand what they pay, why they won or lost a call and what to do next, without exposing the machinery, and in some cases without revealing the platform's margin. It also had to work down to 320 px, because this audience lives on the phone.
The Approach
One criterion guided every screen: show the consequences of the backend, never its mechanics. The auction surfaces as just two things, a banner explaining that bid changes only affect new calls and a lost-call state. Unlocking a web lead is framed as a balance debit, not a checkout, because that is what it is. Each decision was logged with its reasoning, including seven directives deliberately left out of the UI. The build is static HTML with native ES modules, all state in the URL hash, and scripts that capture every view, audit each screen at four widths and render a seamless video loop frame by frame.
views designed & built across three areas
review rounds with the client team
minimum width audited with zero overflow
(02) Brand & Design System
Light mode on a warm neutral, flat white cards with a hairline border and no heavy shadows. Salmon, adopted at the client's request, is the brand and action colour; blue is informational only and doubles as the admin accent. Gabarito carries headings and figures, Instrument Sans the interface and JetBrains Mono anything that must never break across lines: IDs, invoice numbers, phones. Credits are the visible unit everywhere; euros appear only when buying packages and on invoices. No emojis and no abbreviations.
Palette
Typography
Gabarito
142 créditos · 87 % · 0123456789
títulos y cifras 500 → 700 · Instrument Sans para interfaz · JetBrains Mono para IDs, facturas y teléfonos
(03) The Product
A call pipeline with masked numbers
Each call shows its service and location, a partially masked phone, a colour-coded state and its cost in credits, refunds included. Verifying identity reveals full numbers, past calls too, and the row menu groups reporting a call and blocking a number.
The auction, explained where it matters
A banner states that changes only affect new calls, and the same note is repeated inside the edit modal next to the Save button, the moment the user needs it. Per-service bids sit against platform minimums, with pause, delete and bulk editing.
A second product for a second role
The admin panel takes a blue accent to mark the role and opens on a work queue: pending reports, supply and demand match rate with unattended zones, a cross-system activity feed, pending verifications and failed charges.
Five steps, several professions
Multi-profession chips with a searchable catalogue that proposes unlisted ones, then services grouped per profession with the most requested marked, and positioning tags such as urgent or 24 hours.
A weekly schedule and a standby mode
A custom weekly control with several time ranges per day and copy to all days. With phone reception off, standby mode diverts the auctions the professional would have entered to their web leads instead of losing them.
(04) The Outcome
Forty-nine views across signup, the professional's panel, the admin panel and system states, refined over four review rounds. Client feedback changed the data model, not just the layout: the whole flow became multi-profession and multi-location, the dashboard ranks the professional per profession and zone, and the admin panel exists because the client asked where the administrator's side was. The responsive audit passes with zero horizontal overflow at 320, 375, 768 and 1440 px.