Epic 1 Stories (E1.S1 t/m E1.S6): ✨ E1.S1 - Verwijder EPD demo pagina - Removed /epd route en credentials-box component - Updated navigation: EPD Prototype → Login link - Removed demo_users references from middleware en auth libs - Cleaned up TypeScript errors in hero-section-2 ✨ E1.S2 - Homepage vereenvoudigen - Replaced lange manifesto (8000+ woorden) met statement section - Added problem-solution-proof format (3 paragrafen) - Removed comparison table, experiment CTA, manifesto content - Timeline placeholder toegevoegd (completed in E1.S3) ✨ E1.S3 - Timeline component integreren - Created BuildTimeline component (Aceternity UI pattern) - Added timeline.json met 4 weken data (Week 1 completed) - Features per week met icons, metrics, achievements - Scroll-based animation met Framer Motion - Responsive design (sticky titles, mobile/desktop layouts) ✨ E1.S4 - Timeline content structuur - Structured JSON data in content/nl/timeline.json - 15 Lucide icons voor feature types - Week status badges (completed/in_progress/planned) - Time savings display (< 5 sec vs 30 min) ✨ E1.S5 - Login pagina refactor - Split-screen layout (60% features, 40% login) - Teal gradient showcase met 4 feature cards - Time savings badges per feature - Responsive stack layout voor mobile - Footer met AI Speedrun branding ✨ E1.S6 - Bento Grid showcase - Replaced feature grid met Bento Grid layout - Variable card sizes voor visual hierarchy (col-span-2, col-span-1) - Dark slate background (from-slate-900) - Gradient backgrounds per card (teal, amber, purple) - Stats footer met 3 key metrics (90%+, < 5 sec, 4 weken) - Hover animations en glassmorphism effects 🎨 Design System: - Teal-first brand colors (#0D9488) - Amber accents voor AI features (#F59E0B) - Slate scale voor neutral colors - WCAG AA compliant contrast 📦 Components: - BuildTimeline (app/(marketing)/components) - BentoGrid & BentoCard (components/ui) - Button variants (components/ui) 📄 Content: - timeline.json met volledige 4-weken data - Features array per week - Metrics en achievements tracking 🔧 Technical: - Removed demo user scripts en migrations - Updated middleware routes (removed /epd) - TypeScript type fixes (hero-section-2, auth) - Build succesvol: 13 routes generated 🚀 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
161 lines
5.3 KiB
JSON
161 lines
5.3 KiB
JSON
{
|
|
"heading": "Build in Public: 4 Weken",
|
|
"description": "Volg de ontwikkeling van een volledig EPD prototype - van idee tot werkende applicatie. Volledige transparantie over features, tijd en kosten.",
|
|
"weeks": [
|
|
{
|
|
"weekNumber": 1,
|
|
"title": "Week 1 • Nov 11-17",
|
|
"status": "completed",
|
|
"description": "Foundation & Marketing - Technische basis opzetten en marketing website bouwen met teal-first design system. Database schema, auth flow en vereenvoudigde user journey.",
|
|
"features": [
|
|
{
|
|
"title": "Project Setup",
|
|
"description": "Next.js 15 + Supabase + Vercel running met complete development environment",
|
|
"icon": "Rocket"
|
|
},
|
|
{
|
|
"title": "Database & Auth",
|
|
"description": "PostgreSQL schema met 5 core tables en RLS policies voor data isolatie",
|
|
"icon": "Database"
|
|
},
|
|
{
|
|
"title": "Marketing Refactor",
|
|
"description": "Vereenvoudigde homepage met statement section en timeline component",
|
|
"icon": "Sparkles"
|
|
},
|
|
{
|
|
"title": "Teal Design System",
|
|
"description": "Modern, innovatief brand identity met teal primary color en WCAG AA compliance",
|
|
"icon": "Palette"
|
|
}
|
|
],
|
|
"metrics": {
|
|
"hours": "32 uur",
|
|
"cost": "€0",
|
|
"linesOfCode": "~2500"
|
|
},
|
|
"achievements": [
|
|
"✅ Development environment compleet",
|
|
"✅ Database schema en RLS policies live",
|
|
"✅ Marketing website refactored",
|
|
"✅ Teal design system geïmplementeerd"
|
|
]
|
|
},
|
|
{
|
|
"weekNumber": 2,
|
|
"title": "Week 2 • Nov 18-24",
|
|
"status": "planned",
|
|
"description": "EPD Core - Client management module met CRUD operations, responsive UI en navigatie. De basis van het EPD systeem.",
|
|
"features": [
|
|
{
|
|
"title": "Coming Soon Dashboard",
|
|
"description": "Placeholder dashboard met roadmap en verwachtingen management",
|
|
"icon": "Calendar"
|
|
},
|
|
{
|
|
"title": "App Layout & Navigation",
|
|
"description": "Header, sidebar, breadcrumbs en logout flow voor EPD applicatie",
|
|
"icon": "Layout"
|
|
},
|
|
{
|
|
"title": "Client CRUD",
|
|
"description": "Volledige client management: toevoegen, bewerken, verwijderen en zoeken",
|
|
"icon": "Users"
|
|
},
|
|
{
|
|
"title": "Responsive Design",
|
|
"description": "Mobile-first UI met adaptive layouts voor alle schermformaten",
|
|
"icon": "Smartphone"
|
|
}
|
|
],
|
|
"metrics": {
|
|
"hours": "~28 uur",
|
|
"cost": "~€50",
|
|
"linesOfCode": "~2000"
|
|
},
|
|
"achievements": []
|
|
},
|
|
{
|
|
"weekNumber": 3,
|
|
"title": "Week 3 • Nov 25-Dec 1",
|
|
"status": "planned",
|
|
"description": "AI Magic - TipTap editor, Claude API integratie en AI-gestuurde workflows. Het hart van de time-saving features.",
|
|
"features": [
|
|
{
|
|
"title": "TipTap Rich Text Editor",
|
|
"description": "ProseMirror-based editor voor intake notes met formatting en shortcuts",
|
|
"icon": "FileText"
|
|
},
|
|
{
|
|
"title": "AI Intake Samenvatting",
|
|
"description": "Claude 3.5 Sonnet genereert samenvattingen in < 5 seconden",
|
|
"time": "< 5 sec",
|
|
"traditional": "15-20 min",
|
|
"icon": "Brain"
|
|
},
|
|
{
|
|
"title": "DSM-light Classificatie",
|
|
"description": "Automatische categorisatie van problematiek op basis van intake",
|
|
"time": "< 3 sec",
|
|
"traditional": "10-15 min",
|
|
"icon": "Tags"
|
|
},
|
|
{
|
|
"title": "SMART Behandelplan",
|
|
"description": "AI-gegenereerde behandelplannen met doelen en interventies",
|
|
"time": "< 5 sec",
|
|
"traditional": "20-30 min",
|
|
"icon": "Target"
|
|
}
|
|
],
|
|
"metrics": {
|
|
"hours": "~35 uur",
|
|
"cost": "~€50",
|
|
"linesOfCode": "~3000"
|
|
},
|
|
"achievements": []
|
|
},
|
|
{
|
|
"weekNumber": 4,
|
|
"title": "Week 4 • Dec 2-8",
|
|
"status": "planned",
|
|
"description": "Polish & Launch - Onboarding, performance optimization en demo preparation. Klaar voor de wereld.",
|
|
"features": [
|
|
{
|
|
"title": "User Onboarding",
|
|
"description": "Tooltips en walkthrough voor first-time users met feature highlights",
|
|
"icon": "HelpCircle"
|
|
},
|
|
{
|
|
"title": "Performance Optimization",
|
|
"description": "Lighthouse score > 90, LCP < 2.5s en code splitting",
|
|
"icon": "Zap"
|
|
},
|
|
{
|
|
"title": "Accessibility Audit",
|
|
"description": "WCAG AA compliance, keyboard navigation en focus states",
|
|
"icon": "Eye"
|
|
},
|
|
{
|
|
"title": "Production Deployment",
|
|
"description": "Live op Vercel met monitoring en error tracking setup",
|
|
"icon": "Rocket"
|
|
}
|
|
],
|
|
"metrics": {
|
|
"hours": "~25 uur",
|
|
"cost": "~€50",
|
|
"linesOfCode": "~1500"
|
|
},
|
|
"achievements": []
|
|
}
|
|
],
|
|
"totals": {
|
|
"totalHours": "120 uur",
|
|
"totalCost": "€150",
|
|
"traditionalCost": "€100.000+",
|
|
"traditionalTime": "12-24 maanden",
|
|
"savings": "99.85% goedkoper, 99% sneller"
|
|
}
|
|
}
|