Proof page: speaks to the staffer, not the engineer

Rebuilt the page to address a staffing coordinator who's tired of
learning new tools. Opens with "Your Morning Just Got Easier" and
a side-by-side: their current 45-minute routine vs 5 minutes with
pre-matched workers.

Key messaging:
- "This isn't another CRM to learn"
- "We know what your day looks like" (checklist they'll recognize)
- Shows real matched workers WITH names, not abstract metrics
- "It understands what you mean" — warehouse help finds forklift ops
- "It already filtered the junk" — only workers worth calling
- "It runs on YOUR machine" — no cloud, no fees, no data leaving

Technical proof pushed below a divider for the skeptical team.
The staffer sees their contracts and their workers first.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
root 2026-04-17 12:40:07 -05:00
parent dd344c9b38
commit c53d3f4d14

View File

@ -536,19 +536,105 @@ tr:hover{background:#111827}
.note strong{color:#60a5fa}
.footer{text-align:center;color:#475569;font-size:12px;padding:30px;border-top:1px solid #1e293b;margin-top:40px}
</style></head><body>
<div class="hero">
<h1>Lakehouse Proof of Work</h1>
<div class="sub">Live verification every number runs on page load</div>
<div class="ts">${ts} · 192.168.1.177 · i9 + 128GB + A4000</div>
<div class="hero" style="padding:50px 40px 40px">
<h1 style="font-size:28px">Your Morning Just Got Easier</h1>
<div class="sub" style="font-size:16px;color:#cbd5e1;max-width:700px;margin:12px auto 0">
This isn't another CRM to learn. It's your contracts, your workers, your data <br>
already matched before you sit down.
</div>
</div>
<div class="container">
<section style="background:linear-gradient(135deg,#0c1220,#0f1a2e);border:1px solid #1e3a5f;border-radius:16px;padding:35px;margin-bottom:40px">
<h2 style="border:none;color:#e2e8f0;font-size:20px;margin-bottom:20px">We know what your day looks like</h2>
<div style="display:grid;grid-template-columns:1fr 1fr;gap:24px">
<div>
<div style="color:#f87171;font-size:13px;font-weight:600;margin-bottom:12px">RIGHT NOW without this</div>
<div style="color:#94a3b8;font-size:13px;line-height:1.8">
Open the CRM. Search "forklift" + "Chicago" + "OSHA."<br>
Get 200 results. Scroll through. Half are inactive.<br>
Cross-reference certifications in a different tab.<br>
Check availability in a spreadsheet.<br>
Check reliability from memory or ask a coworker.<br>
Copy names into a message. Personalize each one.<br>
Repeat for the next contract. And the next.<br>
<span style="color:#f87171;margin-top:8px;display:block">45 minutes before you make your first call.</span>
</div>
</div>
<div>
<div style="color:#34d399;font-size:13px;font-weight:600;margin-bottom:12px">WITH THIS same morning</div>
<div style="color:#94a3b8;font-size:13px;line-height:1.8">
Open the page. Your contracts are listed by urgency.<br>
Workers already matched name, skills, certs, scores.<br>
Only workers who are available, certified, and reliable.<br>
Ranked by who's the best fit, not just who comes first.<br>
Emergency fills flagged at the top.<br>
One click away from outreach.<br>
<br>
<span style="color:#34d399;margin-top:8px;display:block">You're on the phone in 5 minutes.</span>
</div>
</div>
</div>
<div style="border-top:1px solid #1e3a5f;margin-top:24px;padding-top:16px;color:#64748b;font-size:12px">
This isn't about replacing what you know. It's about not making you dig for it every single time.
You know who the good workers are this just puts them in front of you faster.
</div>
</section>
<section style="margin-bottom:40px">
<h2 style="border:none;color:#e2e8f0;font-size:18px;margin-bottom:16px">Here's what it actually did just now, when you loaded this page:</h2>
<div style="display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:20px">
<div class="stat" style="text-align:left;padding:20px">
<div style="color:#34d399;font-size:28px;font-weight:800">${hybrid.sql_matches?.toLocaleString()}</div>
<div style="color:#94a3b8;font-size:12px;margin-top:4px">Forklift operators in IL with 80%+ reliability</div>
<div style="color:#475569;font-size:11px;margin-top:2px">Found in ${tests[tests.length-1]?.ms}ms you'd still be typing the search</div>
</div>
<div class="stat" style="text-align:left;padding:20px">
<div style="color:#818cf8;font-size:28px;font-weight:800">${hybrid.vector_reranked}</div>
<div style="color:#94a3b8;font-size:12px;margin-top:4px">Best matches ranked by AI not alphabetical, not random</div>
<div style="color:#475569;font-size:11px;margin-top:2px">The system read their skills and picked the best fit for you</div>
</div>
<div class="stat" style="text-align:left;padding:20px">
<div style="color:#fbbf24;font-size:28px;font-weight:800"></div>
<div style="color:#94a3b8;font-size:12px;margin-top:4px">Every name verified against the actual database</div>
<div style="color:#475569;font-size:11px;margin-top:2px">Not guessing, not making up people. These workers are real.</div>
</div>
</div>
<div style="background:#0d0d1a;border-radius:12px;padding:20px;border:1px solid #1e293b">
<div style="color:#94a3b8;font-size:12px;margin-bottom:12px">Your top matches right now ready for outreach:</div>
<table><thead><tr><th>Name</th><th>Details</th><th>Fit Score</th><th>Verified</th></tr></thead>
<tbody>${workerRows}</tbody></table>
</div>
</section>
<section style="background:#0c1220;border:1px solid #1e3a5f;border-radius:12px;padding:24px;margin-bottom:40px">
<div style="color:#e2e8f0;font-size:15px;font-weight:600;margin-bottom:12px">What's different from your CRM:</div>
<div style="display:grid;grid-template-columns:1fr 1fr 1fr;gap:20px">
<div>
<div style="color:#818cf8;font-size:13px;font-weight:600;margin-bottom:6px">It understands what you mean</div>
<div style="color:#64748b;font-size:12px">Search "warehouse help" and it finds Forklift Operators, Loaders, Shipping Clerks because it understands those ARE warehouse jobs. Your CRM would find nothing.</div>
</div>
<div>
<div style="color:#34d399;font-size:13px;font-weight:600;margin-bottom:6px">It already filtered the junk</div>
<div style="color:#64748b;font-size:12px">Inactive workers, expired certs, low reliability already removed. You only see people you'd actually want to call. Not 200 results where 150 are useless.</div>
</div>
<div>
<div style="color:#fbbf24;font-size:13px;font-weight:600;margin-bottom:6px">It runs on YOUR machine</div>
<div style="color:#64748b;font-size:12px">No cloud. No per-search fee. No sending your worker data to someone else's server. Everything runs right here, right now, on hardware you control.</div>
</div>
</div>
</section>
<div style="text-align:center;padding:20px;color:#475569;font-size:13px;margin-bottom:30px">
Technical details below for the team that wants to see the numbers
</div>
<div class="stats">
<div class="stat"><div class="num">${totalRows.toLocaleString()}</div><div class="label">Total Rows</div></div>
<div class="stat"><div class="num">${totalChunks.toLocaleString()}</div><div class="label">Embedded Chunks</div></div>
<div class="stat"><div class="num">${ds?.length || 0}</div><div class="label">Datasets</div></div>
<div class="stat"><div class="num">${indexes?.length || 0}</div><div class="label">Vector Indexes</div></div>
<div class="stat"><div class="num">10M</div><div class="label">Lance Vectors</div></div>
<div class="stat"><div class="num">5ms</div><div class="label">10M Search p50</div></div>
<div class="stat"><div class="num">${totalRows.toLocaleString()}</div><div class="label">Total Records</div></div>
<div class="stat"><div class="num">${totalChunks.toLocaleString()}</div><div class="label">AI-Indexed Chunks</div></div>
<div class="stat"><div class="num">${indexes?.length || 0}</div><div class="label">Search Indexes</div></div>
<div class="stat"><div class="num">10M</div><div class="label">Max Tested Scale</div></div>
</div>
<section>