Brief de site — AK cabinet dentaire SARL

Pour Claude Code (ou agent dev équivalent) — ce prompt est self-contained. Colle-le tel quel après avoir bootstrappé un Next.js 16. Tout le contenu, l'architecture, les images et les contraintes sont dedans.

Identifiants du projet

Contexte commercial

• Client : AK cabinet dentaire SARL
• Lieu : Penthalaz, canton de VD
• Activité : dentist
• IDE Zefix : CHE362342244
• Site actuel : —
• Template de référence : pro-cabinet-01 (cabinet pro — sobre, institutionnel)

Analyse du site existant (score 85/100)

Création complète d'un site vitrine pour AK cabinet dentaire SARL à Penthalaz. Aucun site existant — opportunité greenfield, autonomie totale sur l'identité visuelle. Mettre en avant : présentation du cabinet, services, équipe (à compléter), prise de contact (téléphone + formulaire), horaires.

Cible : Habitants de Penthalaz et environs cherchant un dentist de confiance

Pourquoi le refaire :

• Aucun site web détecté — l'entreprise n'a pas de présence en ligne propre
• Cible commerciale prioritaire (no-site = besoin maximal)
• Greenfield : autonomie totale sur le design et la stratégie SEO

Identité visuelle

Configurer Tailwind v4 dans app/globals.css :

@import "tailwindcss";

@theme {
  --color-primary: #0f3a4a;
  --color-accent: #c8a96a;
  --color-ink: #1a1a1a;
  --color-ink-soft: #4a4a4a;
  --color-paper: #fafaf7;
  --color-line: #e6e3da;

  --font-serif: var(--font-display);
  --font-sans: var(--font-body);
}

Importer les fonts via next/font/google dans app/layout.tsx.

Stack technique imposée

• Next.js 16 (App Router, React 19, RSC, Turbopack)
• TypeScript 5 strict mode
• Tailwind CSS v4 (config dans app/globals.css avec @theme)
• TinaCMS auto-hébergé pour l'édition inline du client (config tina/config.ts, content sous content/)
• Fonts via Google Fonts (next/font/google)
• Schema.org JSON-LD dans app/layout.tsx
• Sitemap + robots + llms.txt (app/sitemap.ts, app/robots.ts, public/llms.txt)
• Build static : output: 'export' dans next.config.ts
• Déploiement : rsync out/ agency:/var/www/copy-paste/previews/{slug}/ puis URL = https://{slug}.preview.mtth.agency

Standards de qualité (non négociables)

• Lighthouse mobile : perf ≥ 90, SEO ≥ 95, a11y ≥ 95
• Mobile-first, max 3 breakpoints (md, lg, parfois xl)
• Touch targets ≥ 44px
• Contraste AA partout
• Pas de shadcn/ui générique — composants custom alignés sur l'identité visuelle
• Animations Framer Motion uniquement quand intentionnelles (pas de "fade in" automatique)
• Toutes les images en <Image> (next/image) avec alt rempli

Architecture du site

Le site est composé des sections suivantes, dans cet ordre :

1. Header sticky — logo (AK Cabinet Dentaire), nav (#about, #services, #team, #contact), CTA "Prendre rendez-vous"
2. Hero — headline + subtitle + CTA primaire + téléphone visible
3. À propos (#about) — narrative en 2-3 paragraphes
4. Services (#services) — grid de cartes (6 services)
5. Équipe (#team) — 2 membres avec rôle
6. Témoignages — 2 citations
7. Contact (#contact) — adresse, téléphone, email, horaires
8. Footer — copyright + lien discret mtth.agency

Contenu complet (à utiliser tel quel)

{
  "brand": {
    "name": "AK Cabinet Dentaire",
    "tagline": "Cabinet dentaire à Penthalaz",
    "primary_color": "#0f3a4a",
    "accent_color": "#c8a96a"
  },
  "seo": {
    "title": "AK Cabinet Dentaire SARL — Dentiste à Penthalaz",
    "description": "Cabinet dentaire à Penthalaz (VD). Soins, prévention, esthétique et urgences. Une équipe attentive pour prendre soin de votre sourire au quotidien.",
    "schema_type": "Dentist",
    "language": "fr"
  },
  "hero": {
    "title": "Votre cabinet dentaire à Penthalaz",
    "subtitle": "Des soins dentaires modernes dans une ambiance calme et bienveillante.",
    "cta_label": "Prendre rendez-vous",
    "cta_href": "#contact"
  },
  "about": {
    "title": "Le cabinet",
    "body": "AK Cabinet Dentaire est installé à Penthalaz, au cœur du district de Morges-Cossonay. Nous accueillons enfants, adultes et seniors pour l'ensemble des soins dentaires, de la consultation de routine aux traitements plus complexes.\n\nNotre approche est simple : prendre le temps d'écouter, expliquer chaque geste et proposer un plan de traitement clair. Le cabinet est équipé de matériel récent et applique des protocoles d'hygiène stricts.\n\nNous travaillons en français et nous adaptons aux besoins de chaque patient, que ce soit pour un contrôle annuel, un traitement orthodontique ou une urgence."
  },
  "services": [
    {
      "name": "Contrôles et prévention",
      "description": "Examens réguliers, détartrage et conseils personnalisés pour préserver vos dents sur la durée.",
      "icon": "🦷"
    },
    {
      "name": "Soins conservateurs",
      "description": "Traitement des caries, obturations esthétiques et restaurations adaptées à chaque situation.",
      "icon": "🩺"
    },
    {
      "name": "Esthétique dentaire",
      "description": "Blanchiment, facettes et soins pour retrouver un sourire harmonieux et naturel.",
      "icon": "✨"
    },
    {
      "name": "Prothèses et implants",
      "description": "Solutions fixes ou amovibles pour remplacer une ou plusieurs dents manquantes.",
      "icon": "🔧"
    },
    {
      "name": "Endodontie",
      "description": "Traitements de racine réalisés avec précision pour conserver vos dents naturelles.",
      "icon": "🔬"
    },
    {
      "name": "Urgences dentaires",
      "description": "Prise en charge rapide en cas de douleur, traumatisme ou complication.",
      "icon": "🚨"
    }
  ],
  "team": [
    {
      "name": "Dr. méd. dent.",
      "role": "Médecin-dentiste responsable",
      "bio": "Praticien à Penthalaz, à l'écoute de chaque patient pour proposer des soins adaptés."
    },
    {
      "name": "Assistante dentaire",
      "role": "Hygiène et accueil",
      "bio": "Accompagne les patients tout au long de leur visite et assure le suivi des rendez-vous."
    }
  ],
  "testimonials": [
    {
      "quote": "Accueil chaleureux et explications claires avant chaque soin. On se sent vraiment en confiance.",
      "author": "Patiente",
      "role": "Penthalaz"
    },
    {
      "quote": "Cabinet propre, moderne et équipe attentive. Je recommande sans hésiter.",
      "author": "Patient",
      "role": "Cossonay"
    }
  ],
  "contact": {
    "phone": "À COMPLÉTER",
    "email": "À COMPLÉTER",
    "address": "À COMPLÉTER, 1305 Penthalaz",
    "hours": "Lu-Ve 8h-18h",
    "google_maps_url": null
  },
  "city": "Penthalaz",
  "canton": "VD"
}

Pour chaque section, le texte ci-dessus est définitif : copie-le tel quel dans le code (échappage HTML/JSX près des apostrophes). Pas de paraphrase, pas de "version courte". Si quelque chose te semble trop long, demande-moi avant de couper.

SEO et métadonnées

À inclure dans app/layout.tsx ou pages dédiées :

• <title> + <meta name="description">
• Open Graph (og:title, og:description, og:image, og:locale=fr_CH)
• Twitter Card summary_large_image
• JSON-LD LocalBusiness (cf. structure ci-dessous)

{
  "@context": "https://schema.org",
  "@type": "Dentist",
  "name": "AK cabinet dentaire SARL",
  "description": "Cabinet dentaire à Penthalaz (VD). Soins, prévention, esthétique et urgences. Une équipe attentive pour prendre soin de votre sourire au quotidien.",
  "url": "https://ak-cabinet-dentaire-sarl.preview.mtth.agency",
  "address": {
    "@type": "PostalAddress",
    "streetAddress": "À COMPLÉTER, 1305 Penthalaz",
    "addressLocality": "Penthalaz",
    "addressRegion": "VD",
    "addressCountry": "CH"
  },
  "telephone": "À COMPLÉTER",
  "email": "À COMPLÉTER",
  "openingHours": "Lu-Ve 8h-18h"
}

Fichiers obligatoires :

• app/sitemap.ts listant la home + ancres principales
• app/robots.ts : Allow * pour la version live, Disallow tout pour la preview (X-Robots-Tag est déjà géré par Caddy)
• public/llms.txt : description courte + adresse + horaires (pour les LLM crawlers)

Images à utiliser

Logo

• Aucun logo détecté sur le site original
• Solution : composer un wordmark typographique avec la font display, lettres espacées, couleur primary

Image hero

• Pour cabinet pro : pas d'image hero photographique, le titre seul + un fond paper suffit (cf. template pro-cabinet-01)
• Si tu insistes pour une image : photo d'intérieur de cabinet (lumière naturelle, pas de visage), Unsplash query "dental clinic clean modern interior natural light"

OG image

• Générer un /opengraph-image.tsx (Next.js convention) qui rend une carte 1200×630 avec :
  • le nom de marque en grand (font display)
  • la tagline en petit dessous
  • couleur de fond paper, accent en bordure ou trait

Contenu détecté sur le site original (pour référence)

{
  "team": [],
  "hours": null,
  "contact": {},
  "has_blog": false,
  "services": [],
  "languages": [
    "fr"
  ],
  "has_booking": false
}

Workflow de livraison

Identifiants à respecter exactement — utilisés par tout le pipeline (DB, Caddy wildcard, dashboard).

• Repo name : ak-cabinet-dentaire-sarl-y6dxmx
• Local path : ~/sites/clients/ak-cabinet-dentaire-sarl-y6dxmx
• Deploy target (sur VPS agency) : /var/www/copy-paste/previews/ak-cabinet-dentaire-sarl/
• Preview URL : https://ak-cabinet-dentaire-sarl.preview.mtth.agency

# 1. Bootstrap le projet (utilise EXACTEMENT ce nom de dossier)
mkdir -p ~/sites/clients/ak-cabinet-dentaire-sarl-y6dxmx
cd ~/sites/clients/ak-cabinet-dentaire-sarl-y6dxmx
npx create-next-app@latest . --typescript --tailwind --app --no-src-dir --import-alias '@/*'

# 2. Lance Claude Code et colle ce PROMPT.md tel quel
claude

# 3. Une fois le site généré, configure le static export dans next.config.ts:
#    output: 'export'
# Puis build et déploie sur le VPS:
npm run build
rsync -az --delete out/ agency:/var/www/copy-paste/previews/ak-cabinet-dentaire-sarl/

# 4. Vérifier en live
open https://ak-cabinet-dentaire-sarl.preview.mtth.agency

Le sous-domaine ak-cabinet-dentaire-sarl.preview.mtth.agency est déjà routé vers le VPS via wildcard Caddy + on-demand TLS — aucun config DNS à faire. Caddy émet le cert Let's Encrypt automatiquement à la première requête.

Checklist de revue avant livraison client

• Lighthouse mobile perf ≥ 90, SEO ≥ 95, a11y ≥ 95
• Test mobile réel (iPhone + Android) — pas juste DevTools
• Tous les CTA mènent quelque part (ancre, mailto, tel:, Cal.com)
• Schéma JSON-LD validé sur https://search.google.com/test/rich-results
• Pas de référence à mtth.agency visible (sauf footer discret)
• Favicon SVG + PNG fallback
• Toutes les images ont alt rempli en français
• X-Robots-Tag: noindex, nofollow sur la preview (Caddy le fait, mais vérifier)
• Form de contact si présent → POST vers Resend ou mailto:

Brief généré par mtth.agency — pipeline copy-paste. Données issues de l'analyse Claude Sonnet 4.6 (vision) sur (site original).