DaisyAI Website Refactor v2: FDE-First Positioning

Use this document to: Execute a complete website refactor in Claude Code. Copy this into a new session in the daisyai-www repo.

---

TL;DR

From: "AI-Powered Medical Case Review" (SaaS product focus) To: "We Build AI That Actually Works in Healthcare" (FDE services focus)

The pivot: Position DaisyAI as a Forward Deploy Engineering firm that builds production AI for healthcare. The SaaS product becomes proof of capability, not the primary offering.

---

Part 1: Strategic Context

The FDE Thesis

The bottleneck for enterprise AI isn't models—it's implementation.

Key Statistics:

• 95% of AI projects fail to create business value
• 1% of companies have reached AI maturity
• 800%+ growth in demand for implementation engineers

DaisyAI's Positioning:

• Unlike consultants who deliver recommendations, we deliver working software
• We embed with client teams, understand real workflows (not SOPs), and ship production code
• Our SaaS product proves we can build—it's running in production today

Target Market

Ideal Customer Profile:

• Regional health systems (3-20 hospitals)
• Specialty payers and TPAs
• UM/UR outsourcing companies
• Large physician groups with value-based contracts
• Revenue: $50M-$500M (big enough for budget, nimble enough to move fast)

Pain Points We Solve:

• Prior authorization backlogs causing care delays
• Nurse burnout from repetitive manual review
• Denial rates impacting revenue cycle
• Failed AI pilots with big vendors

Engagement Models

Competitive Differentiation

---

Part 2: Research Findings

Palantir (Inspiration)

What works:

• "Get AI Into Operations" - action-oriented headline
• "Day 1 Value" messaging - emphasizes speed
• Third-party validation prominently displayed
• Educational content (Bootcamps) builds trust
• Four-card layouts for features

Apply: Lead with action, emphasize speed, use stats as social proof, education-forward via Substack

SVPG (Thought Leadership Model)

What works:

• Team credentials front and center
• Published books as credibility anchors
• Specific testimonials with results
• Active workshop calendar

Apply: Highlight Wharton/Columbia/Princeton backgrounds, link to Substack, "left consulting to build" narrative

BCG/McKinsey Style

What works:

• Data-driven claims with research backing
• Heavy use of charts and statistics
• Pyramid Principle structure

Apply: Lead with stats (95%/1%/800%), structure content as insight → evidence → action

---

Part 3: Current Website Analysis

Tech Stack (Keep All)

Framework: Next.js 15 + React 19
Styling: Tailwind CSS v4
Animation: Framer Motion
3D Effects: Three.js (Vortex background)
Fonts: Playfair Display (serif headings), Nunito Sans (body)

Current Structure

/                   # Homepage (SaaS-focused) - NEEDS REFACTOR
/about              # Team page (basic bios) - ENHANCE

Current Homepage Sections

1. Hero - "AI-Powered Medical Case Review" ❌ Wrong message
2. ProblemStatement - Healthcare complexity ✓ Good, needs reframing
3. DaisySolution - Product features with mockup ✓ Good asset, wrong emphasis
4. Features - Product capabilities → Move to /product
5. CallToAction - "Request Access" → Change to "Book a Call"

Components to Leverage

Design System (Keep + Extend)

/* Current - Keep */
--background: #0a0a0a;
--text: white with /60, /70, /80 opacity variants;
--accent: yellow-400 (CTAs);
--border: white/10;

/* Consider adding */
--accent-secondary: purple-500 or teal-500 for FDE elements;

---

Part 4: New Site Architecture

Page Structure

/                   # Homepage (FDE-first narrative)
/about              # Enhanced team + philosophy
/services           # NEW: Engagement model details
/product            # NEW: SaaS platform showcase
/insights           # NEW: Substack integration

Navigation

Desktop Header:

[Logo: Daisy AI]  [Services][Product][Insights][About]  [𝕏][in][◉]  [Book a Call →]

Mobile Header:

[Logo]                                                              [☰]

Social Links

Platforms:

• Twitter/X: https://twitter.com/daisyai (CONFIRM URL)
• LinkedIn: https://linkedin.com/company/daisyai (CONFIRM URL)
• Substack: https://substack.com/@tstartz

Placement:

1. Header: Small icons (16px), grouped, text-white/60 hover:text-white
2. Team section: Under each founder name
3. Footer: Full row with labels

---

Part 5: Homepage Section Specifications

New Section Flow

1. Hero                 → FDE thesis hook
2. ProblemStats         → NEW: 95% fail statistics
3. Approach             → NEW: Embed → Build → Scale
4. EngagementModels     → NEW: Three pricing tiers
5. ProofOfCapability    → MODIFIED: Product as evidence
6. TargetMarket         → NEW: Who we work with
7. Team                 → ENHANCED: Credibility focus
8. CallToAction         → MODIFIED: Book a call

---

Section 1: Hero

Purpose: Hook visitors with FDE thesis in <5 seconds

Content:

Headline: "We Build AI That Actually Works in Healthcare"

Subhead: "95% of enterprise AI projects fail. We're the engineers who make them succeed."

CTA Primary: "Book a Discovery Call" → Calendly
CTA Secondary: "See How We Work" → Scroll to Approach

Design:

• Keep Vortex background
• Large headline: text-5xl md:text-7xl
• Dual CTAs: conversion + engagement
• Keep scroll indicator animation

Implementation: Modify Hero.tsx, update content, change CTA links

---

Section 2: ProblemStats (NEW)

Purpose: Establish credibility through market insight

Content:

Title: "The AI Implementation Crisis"

Stats (animate count-up on scroll):
├── "95%" — "of AI projects fail to create business value"
├── "1%"  — "of companies have reached AI maturity"
└── "800%" — "growth in demand for implementation engineers"

Body: "The bottleneck for enterprise AI isn't models—it's implementation.
Healthcare organizations have the budget and the pain, but lack the
talent to transform operations. Generic AI tools fail because they're
built against documentation, not how work actually gets done."

Design:

• Dark background (continues from Hero)
• Large stat numbers with Framer Motion count animation
• Stats: horizontal row desktop, stack mobile
• Body: centered, max-w-3xl

Implementation: New file ProblemStats.tsx, use ScrollReveal wrapper

---

Section 3: Approach (NEW)

Purpose: Differentiate FDE from consultants and vendors

Content:

Title: "Unlike Consultants, We Build Working Software"

Column 1 - "Embed & Discover"
├── Shadow actual workflows
├── Map the real process (not the SOP)
├── Build trust with end users
└── Identify highest-impact opportunities

Column 2 - "Build & Deploy"
├── Write production code on your infrastructure
├── Integrate with existing EHRs and systems
├── Ship iteratively, not in 18-month cycles
└── Train your team as we build

Column 3 - "Improve & Scale"
├── Every engagement improves our platform
├── Knowledge compounds across clients
├── Your success feeds our product roadmap
└── Graduate from projects to partnership

Design:

• Three-column grid (stack on mobile)
• Icons: Eye, Code, TrendingUp (Lucide)
• Numbered steps (1, 2, 3) for visual hierarchy
• Subtle hover effect on cards

Implementation: New file Approach.tsx

---

Section 4: EngagementModels (NEW)

Purpose: Make next steps concrete with pricing transparency

Content:

Title: "Three Ways to Work With Us"

Card 1 - "Discovery Sprint"
├── Price: "$15-25K"
├── Duration: "2 weeks"
├── Includes:
│   ├── Process mapping & observation
│   ├── 10-15 stakeholder interviews
│   ├── Opportunity sizing & ROI model
│   ├── Working prototype demo
│   └── Implementation roadmap
└── Best for: "Is AI right for this workflow?"

Card 2 - "Implementation Project"
├── Price: "$75-200K"
├── Duration: "2-4 months"
├── Includes:
│   ├── Dedicated FDE team
│   ├── Production deployment
│   ├── Integration with existing systems
│   ├── Training & change management
│   └── 30-day post-launch support
└── Best for: "We know what we need, help us build it"

Card 3 - "Embedded FDE"
├── Price: "$20-30K/month"
├── Duration: "Ongoing"
├── Includes:
│   ├── Continuous engineering capacity
│   ├── Weekly syncs with leadership
│   ├── Quarterly business reviews
│   ├── Priority access to platform updates
│   └── Expansion into new workflows
└── Best for: "Be our AI team"

Design:

• Three equal-height cards
• Middle card slightly elevated (featured)
• Pricing visible (transparency builds trust)
• "Best for" helps self-qualification

Implementation: New file EngagementModels.tsx

---

Section 5: ProofOfCapability (MODIFIED)

Purpose: Show SaaS product as evidence of building capability

Content:

Title: "We've Already Built It For Ourselves"

Intro: "This isn't vaporware—it's running in production."

Product Showcase (simplified from DaisySolution):
├── 7 specialized AI agents for different review types
├── Evidence extraction with source citations
├── HIPAA-compliant, SOC2-ready infrastructure
└── Integrates with existing clinical workflows

Closing: "We're not theorists. We're builders who ship."

CTA: "Explore the Platform →" → /product

Design:

• Reuse existing product mockup
• Simplify feature list
• Frame as "proof" not primary offering
• Consider light background for contrast

Implementation: Modify DaisySolution.tsx or create new ProofOfCapability.tsx

---

Section 6: TargetMarket (NEW)

Purpose: Help visitors self-qualify, signal ICP

Content:

Title: "Built for Healthcare Operations Leaders"

Organization Types (with icons):
├── Regional health systems (3-20 hospitals)
├── Specialty payers and TPAs
├── UM/UR outsourcing companies
└── Large physician groups

Common Challenges (checkmarks):
├── ✓ Prior authorization backlogs causing care delays
├── ✓ Nurse burnout from repetitive manual review
├── ✓ Denial rates impacting revenue cycle
└── ✓ Documentation bottlenecks slowing decisions

Qualifier: "We work best with organizations doing $50M-$500M in revenue—
big enough to have budget, nimble enough to move fast."

Design:

• Two-column: org types left, challenges right
• Icons for org types (Building, Shield, Clipboard, Users)
• Checkmarks for validation feeling
• Qualifier text smaller, filters leads

Implementation: New file TargetMarket.tsx

---

Section 7: Team (ENHANCED)

Purpose: Credibility through founder backgrounds

Content:

Title: "Wharton-Trained. Healthcare-Focused. Builder-Minded."

Founder 1:
├── Name: Thomas Startz
├── Role: CEO
├── Background: Columbia University, Wharton MBA
├── Experience: Healthcare operations and finance
└── Social: [LinkedIn] [Twitter]

Founder 2:
├── Name: Michael Yuan
├── Role: CTO
├── Background: Princeton University, Wharton MBA
├── Experience: Engineering and consulting
└── Social: [LinkedIn] [Twitter]

Closing: "We've worked at Bain, McKinsey, and in healthcare operations.
We left to build something that actually ships."

CTA: "Read Our Thinking →" → Substack

Design:

• Side-by-side founder photos
• Social icons under each name
• "Left to build" narrative emphasized

Implementation: New file TeamHighlight.tsx or extract from About page

---

Section 8: CallToAction (MODIFIED)

Purpose: Convert visitors

Content:

Headline: "Let's Talk About Your AI Challenges"

Body: "Book a 30-minute call. No pitch, just problem-solving.
We'll tell you honestly if we can help—and if we can't,
we'll point you to someone who might."

CTA: [Book a Discovery Call] → Calendly

Fallback: "Prefer email? thomas@daisyai.ai"

Design:

• Light background (invert from dark) - existing pattern
• Single prominent CTA
• Email as async fallback
• Honest tone builds trust

Implementation: Modify CallToAction.tsx

---

Part 6: Component Specifications

SocialLinks.tsx (NEW)

File: /src/components/ui/SocialLinks.tsx

interface SocialLinksProps {
  platforms: ('twitter' | 'linkedin' | 'substack')[];
  size?: 'sm' | 'md' | 'lg';  // 16px, 20px, 24px
  variant?: 'header' | 'footer' | 'inline';
  showLabels?: boolean;
  className?: string;
}

const SOCIAL_URLS = {
  twitter: 'https://twitter.com/daisyai',        // CONFIRM
  linkedin: 'https://linkedin.com/company/daisyai',  // CONFIRM
  substack: 'https://substack.com/@tstartz',
};

Icons: Use Lucide React or custom SVGs Styling: Header variant: text-white/60 hover:text-white transition-colors

---

Header.tsx (MODIFY)

Add Navigation:

const NAV_LINKS = [
  { label: 'Services', href: '/services' },
  { label: 'Product', href: '/product' },
  { label: 'Insights', href: '/insights' },
  { label: 'About', href: '/about' },
];

Layout:

[Brand]  [Nav Links]  [SocialLinks size="sm"]  [CTA: "Book a Call"]

Changes:

1. Add nav links between brand and CTA
2. Import and add SocialLinks component
3. Change CTA text: "Request Access" → "Book a Call"
4. Update CTA link to Calendly

---

Footer.tsx (MODIFY)

Add:

• Full social row with labels
• "Follow our thinking" header

---

Part 7: File Operations

Files to Modify

Files to Create

Reference These for Patterns

• DaisySolution.tsx - Section layout, mockup styling, animation patterns
• ScrollReveal.tsx - Animation wrapper to use on new sections
• ProblemStatement.tsx - Text section styling
• RequestAccessModal.tsx - Modal pattern if needed

---

Part 8: Execution Order

1. Create SocialLinks component (needed by Header)
2. Modify Header (nav links + social icons + CTA)
3. Create ProblemStats section
4. Create Approach section
5. Create EngagementModels section
6. Create TargetMarket section
7. Create TeamHighlight section
8. Modify Hero with new messaging
9. Modify/create ProofOfCapability
10. Update page.tsx with new section order
11. Modify CallToAction
12. Update Footer with social row
13. Test responsive behavior
14. Run build to verify

---

Part 9: Design Decisions

Keep Dark Theme + Vortex

Why:

1. Differentiation - Most healthcare sites are sterile blue/white
2. Premium positioning - Dark = high-end, sophisticated
3. Technical credibility - "We're engineers, not marketers"
4. Memorable - Vortex creates distinctive first impression

Show Pricing Publicly

Why:

1. Transparency builds trust
2. Qualifies leads (filters wrong-fit inquiries)
3. Demonstrates confidence
4. Aligns with FDE ethos - direct, no BS

Direct Calendly (No Form)

Why:

1. Reduces friction
2. Shows availability
3. Self-service respects visitor time
4. Can add form later based on data

---

Part 10: Content Placeholders

Use these until confirmed:

// Social URLs
const SOCIAL = {
  twitter: 'https://twitter.com/daisyai',
  linkedin: 'https://linkedin.com/company/daisyai',
  substack: 'https://substack.com/@tstartz',
};

// Calendly
const CALENDLY_URL = 'https://calendar.app.google/aVV7SrwdnLTsvxyL6';

// Email
const CONTACT_EMAIL = 'thomas@daisyai.ai';

---

Part 11: Success Criteria

When complete, the homepage should:

• Lead with "We Build AI That Actually Works in Healthcare"
• Show 95%/1%/800% stats prominently with animation
• Explain Embed→Build→Scale approach clearly
• Display three engagement tiers with visible pricing
• Show product as proof of capability (not primary)
• Help visitors self-qualify with ICP section
• Feature founders with credentials and social links
• Have "Book a Call" CTA in header and footer
• Have social links (Twitter, LinkedIn, Substack) in header and footer
• Maintain dark theme and Vortex background
• Be fully responsive (mobile-first)
• Pass npm run build without errors

---

Part 12: Open Items (Need Owner Input)

Before executing, confirm:

1. Twitter URL: https://twitter.com/___________
2. LinkedIn URL: https://linkedin.com/company/___________
3. Calendly link: Is calendar.app.google/aVV7SrwdnLTsvxyL6 correct?
4. Pricing ranges: Are the three tiers accurate?
5. Stat sources: Where do 95%/1%/800% come from? (for credibility)
6. Founder details: Any additional credentials to highlight?

---

Start

Begin by exploring the codebase structure:

ls -la src/components/
ls -la src/app/

Then start with SocialLinks component. Reference existing components for styling patterns. Ask for clarification on any content or design decisions.