Complete frontend · 8 pages

LawFeed
Product Demo

Every page of the product, fully interactive. Navigate the full user journey below.

User journey — click to explore
Step 1
🌐
Landing Page
Marketing page. Value proposition, lifecycle coverage, mock feed, pricing, waitlist.
›
Step 2
🔐
Sign Up & Login
Login, sign up with validation, 3-step onboarding — practice areas, frequency, plan.
›
Step 3 · Core
📋
Dashboard Feed
Live feed of 7 updates. Filter by stage. Take quizzes. CPD tracked. Fully interactive.
›
Step 4
📄
Update Detail
Full plain English summary, original wording, official source link, full quiz, CPD certificate.
›
Step 4b
📄
Update Detail — White Paper
Same page, different update. Shows Redundancy Pay White Paper with its own quiz.
›
Step 5
📊
CPD Tracker
Full activity log, hours by area, SRA compliance ring, certificates, CSV export.
›
Step 6
⚙️
Settings
Practice areas, email frequency, notifications, billing, danger zone. Save bar on change.
›
Step 7
✉️
Daily Email Digest
The email that lands every morning. Dark header, 7 updates, CPD bars, mobile optimised.
›
All pages
Complete file set
8 pages · All frontend complete · Backend phase next
🌐
lawfeed-landing.html
Marketing landing page · Pricing · Waitlist
✓ Done
›
🔐
lawfeed-auth.html
Login · Sign up · 3-step onboarding · Plan selection
✓ Done
›
📋
lawfeed-dashboard.html
Main feed · Filters · Quiz modal · CPD widget · 7 real updates
✓ Done
›
📄
lawfeed-detail.html
Update detail · Plain English · Original wording · Source link · Full quiz · Certificate
✓ Done
›
📊
lawfeed-cpd.html
Full CPD tracker · Activity log · Certificates · SRA ring · CSV export
✓ Done
›
⚙️
lawfeed-settings.html
Profile · Practice areas · Email preferences · Billing · Account
✓ Done
›
✉️
lawfeed-email.html
Daily email digest · Mobile optimised · Dark header · 7 updates · CPD bars
✓ Done
›
🔧
Backend — Supabase + Claude API + Resend
Database · Real auth · Monitoring engine · Email sending · PDF certificates
Phase 9
Build status
What's working right now
Navigation
All pages linked. Full journey from landing to dashboard to detail to CPD to settings.
Quiz engine
Fully interactive. 5 questions per update, scoring, explanations, CPD logging to browser storage.
CPD tracking
Persists between sessions via localStorage. Certificates, log, SRA ring all functional.
Onboarding
3-step flow — practice areas, email frequency, plan selection — all interactive.
Settings
All toggles, area selection, frequency, billing history, CSV export working.
Email template
Mobile-optimised, dark mode, all 7 updates, CPD bars, source links.
Authentication
UI complete. Needs Supabase Auth connected in Phase 9 for real login.
Monitoring engine
Data is mocked. Needs Node.js cron + Claude API to pull live from official sources.
Phase 9 — Backend
What gets built next to make this a real, working product
1
Supabase — Database & Auth
5 tables: users, updates, quiz_questions, cpd_log, user_sources. Real login with email + Google.
2
Monitoring Engine — Node.js cron
Daily job checking legislation.gov.uk, parliament.uk, SRA, ICO, BAILII for new content. Detects changes automatically.
3
Claude API — AI Processing
Every detected update sent to Claude. Returns plain English summary, stage classification, 5 quiz questions with explanations.
4
Resend — Email Delivery
Daily digest sent automatically using the email template. Personalised per user's practice areas and frequency preference.
5
PDF Certificates — Real Generation
On quiz completion, a real PDF certificate generated with name, score, date, SRA statement. Stored in Supabase.
6
Deploy — Vercel + Railway
Frontend to Vercel. Backend API to Railway. Domain connected. LawFeed goes live.