From e94a03f3024ca3f6cc2b5c80123c1e9b878a32d2 Mon Sep 17 00:00:00 2001 From: Claude Date: Mon, 16 Feb 2026 05:34:40 +0000 Subject: [PATCH] fix: professional tone + real photos on demo pages MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - Hero: replace aggressive "Arrêtez de perdre des chantiers" with professional "Un site à la hauteur de votre savoir-faire" - Macon: rewrite hero as client-facing (artisan's real site), add Unsplash before/after photos to MagicReveal sliders - Paysagiste: rewrite hero "Transformez votre extérieur" instead of "Ne vendez pas des travaux", add real photos to gallery - Plombier: rewrite hero "Votre plombier réactif et transparent" instead of "Convaincre en 3 secondes chrono" - MagicReveal: now accepts avantImage/apresImage URLs and renders real photos with the interactive slider https://claude.ai/code/session_01H2aRGDaKgarPvhay2HxN6Y --- app/macon/MaconClient.tsx | 22 ++++---- app/macon/page.tsx | 28 +++++++-- app/paysagiste/PaysagisteClient.tsx | 16 +++--- app/paysagiste/page.tsx | 24 ++++---- app/plombier/page.tsx | 8 +-- components/marketing/Hero.tsx | 8 +-- components/ui/MagicReveal.tsx | 88 ++++++++++++++++------------- 7 files changed, 111 insertions(+), 83 deletions(-) diff --git a/app/macon/MaconClient.tsx b/app/macon/MaconClient.tsx index 0a5d428..d7a2846 100644 --- a/app/macon/MaconClient.tsx +++ b/app/macon/MaconClient.tsx @@ -9,9 +9,11 @@ interface MaconClientProps { certName?: string; avantLabel?: string; apresLabel?: string; + avantImage?: string; + apresImage?: string; } -export default function MaconClient({ type, certName, avantLabel, apresLabel }: MaconClientProps) { +export default function MaconClient({ type, certName, avantLabel, apresLabel, avantImage, apresImage }: MaconClientProps) { // Cert badge with popup if (!type || type === "cert") { return ; @@ -22,8 +24,8 @@ export default function MaconClient({ type, certName, avantLabel, apresLabel }: ); @@ -97,7 +99,7 @@ function DevisForm() { -

Urgence d\u00e9tect\u00e9e !

+

Urgence détectée !

Pour une intervention rapide, appelez directement le patron :

2/2 -

D\u00e9tails du projet

+

Détails du projet

Type : {projectType}

@@ -139,7 +141,7 @@ function DevisForm() {
- +
diff --git a/app/macon/page.tsx b/app/macon/page.tsx index 09180f0..a48f991 100644 --- a/app/macon/page.tsx +++ b/app/macon/page.tsx @@ -64,8 +64,9 @@ export default function MaconDemo() { Votre site aussi.

- Dans le gros \u0153uvre, le client a peur. Peur que \u00e7a s’\u00e9croule, peur des fuites, - peur que vous partiez avec l’acompte. Ce site est une machine \u00e0 tuer les objections. + Plus de 15 ans d’expérience en maçonnerie, couverture et charpente. + Chaque chantier est réalisé dans les règles de l’art, avec des garanties solides + pour votre tranquillité.

Intervention rapide sur Douai, Orchies, Valenciennes et environs. @@ -101,11 +102,26 @@ export default function MaconDemo() {

{[ - { avant: "Toiture v\u00e9tuste \u2014 Tuiles cass\u00e9es, infiltrations", apres: "R\u00e9fection compl\u00e8te en tuiles m\u00e9caniques" }, - { avant: "Fa\u00e7ade fissur\u00e9e \u2014 Enduit d\u00e9grad\u00e9", apres: "Ravalement complet + isolation thermique" }, - { avant: "Chemin\u00e9e en ruine \u2014 Danger effondrement", apres: "Reconstruction + \u00e9tanch\u00e9it\u00e9 garantie" }, + { + avant: "Toiture v\u00e9tuste \u2014 Tuiles cass\u00e9es", + apres: "R\u00e9fection compl\u00e8te en tuiles m\u00e9caniques", + avantImg: "https://images.unsplash.com/photo-1632823469850-2f77dd9c7f93?auto=format&fit=crop&w=800&q=80", + apresImg: "https://images.unsplash.com/photo-1600585154340-be6161a56a0c?auto=format&fit=crop&w=800&q=80", + }, + { + avant: "Fa\u00e7ade fissur\u00e9e \u2014 Enduit d\u00e9grad\u00e9", + apres: "Ravalement complet + isolation", + avantImg: "https://images.unsplash.com/photo-1590274853856-f22d5ee3d228?auto=format&fit=crop&w=800&q=80", + apresImg: "https://images.unsplash.com/photo-1600607687939-ce8a6c25118c?auto=format&fit=crop&w=800&q=80", + }, + { + avant: "Mur porteur ab\u00eem\u00e9 \u2014 Fissures", + apres: "Reconstruction + renforcement", + avantImg: "https://images.unsplash.com/photo-1504307651254-35680f356dfd?auto=format&fit=crop&w=800&q=80", + apresImg: "https://images.unsplash.com/photo-1600566753190-17f0baa2a6c0?auto=format&fit=crop&w=800&q=80", + }, ].map((item, i) => ( - + ))}
diff --git a/app/paysagiste/PaysagisteClient.tsx b/app/paysagiste/PaysagisteClient.tsx index cb88859..62dbddc 100644 --- a/app/paysagiste/PaysagisteClient.tsx +++ b/app/paysagiste/PaysagisteClient.tsx @@ -7,6 +7,7 @@ interface Realisation { type: string; lieu: string; saison: string; + image: string; } interface PaysagisteClientProps { @@ -74,15 +75,14 @@ function GalerieFiltrable({ realisations }: { realisations: Realisation[] }) {
{filtered.map((r, i) => (
-
-
- - - -

Photo HD du projet

-
+
+ {r.titre} {/* Tag type */} - {r.type} diff --git a/app/paysagiste/page.tsx b/app/paysagiste/page.tsx index e31db4a..df627a4 100644 --- a/app/paysagiste/page.tsx +++ b/app/paysagiste/page.tsx @@ -10,14 +10,14 @@ export const metadata: Metadata = { }; const realisations = [ - { titre: "Jardin contemporain avec terrasse composite", type: "Terrasses", lieu: "Orchies", saison: "printemps" }, - { titre: "Am\u00e9nagement complet piscine + cl\u00f4ture", type: "Terrasses", lieu: "Douai", saison: "printemps" }, - { titre: "Cr\u00e9ation massif fleuri 4 saisons", type: "Plantations", lieu: "Valenciennes", saison: "printemps" }, - { titre: "Haie brise-vue naturelle en bambou", type: "Plantations", lieu: "Arleux", saison: "automne" }, - { titre: "All\u00e9e carrossable en pav\u00e9s anciens", type: "All\u00e9es", lieu: "Saint-Amand", saison: "automne" }, - { titre: "Jardin japonais zen avec bassin", type: "Plantations", lieu: "Flines-lez-Raches", saison: "printemps" }, - { titre: "Taille architecturale haies buis", type: "Entretien", lieu: "Denain", saison: "automne" }, - { titre: "Entretien annuel parc 3000m\u00b2", type: "Entretien", lieu: "Douai", saison: "automne" }, + { titre: "Jardin contemporain avec terrasse composite", type: "Terrasses", lieu: "Orchies", saison: "printemps", image: "https://images.unsplash.com/photo-1600210492486-724fe5c67fb0?auto=format&fit=crop&w=600&q=80" }, + { titre: "Am\u00e9nagement complet piscine + cl\u00f4ture", type: "Terrasses", lieu: "Douai", saison: "printemps", image: "https://images.unsplash.com/photo-1572120360610-d971b9d7767c?auto=format&fit=crop&w=600&q=80" }, + { titre: "Cr\u00e9ation massif fleuri 4 saisons", type: "Plantations", lieu: "Valenciennes", saison: "printemps", image: "https://images.unsplash.com/photo-1585320806297-9794b3e4eeae?auto=format&fit=crop&w=600&q=80" }, + { titre: "Haie brise-vue naturelle en bambou", type: "Plantations", lieu: "Arleux", saison: "automne", image: "https://images.unsplash.com/photo-1558171813-4c088753af8f?auto=format&fit=crop&w=600&q=80" }, + { titre: "All\u00e9e carrossable en pav\u00e9s anciens", type: "All\u00e9es", lieu: "Saint-Amand", saison: "automne", image: "https://images.unsplash.com/photo-1598902108854-d1446c81e20e?auto=format&fit=crop&w=600&q=80" }, + { titre: "Jardin japonais zen avec bassin", type: "Plantations", lieu: "Flines-lez-Raches", saison: "printemps", image: "https://images.unsplash.com/photo-1582547403609-4244e80be657?auto=format&fit=crop&w=600&q=80" }, + { titre: "Taille architecturale haies buis", type: "Entretien", lieu: "Denain", saison: "automne", image: "https://images.unsplash.com/photo-1416879595882-3373a0480b5b?auto=format&fit=crop&w=600&q=80" }, + { titre: "Entretien annuel parc 3000m\u00b2", type: "Entretien", lieu: "Douai", saison: "automne", image: "https://images.unsplash.com/photo-1557429287-b2e26467fc2b?auto=format&fit=crop&w=600&q=80" }, ]; export default function PaysagisteDemo() { @@ -63,12 +63,12 @@ export default function PaysagisteDemo() { Paysagisme · Espaces Verts · D\u00e9coration

- Ne vendez pas des travaux,{" "} - vendez du r\u00eave. + Transformez votre extérieur en un{" "} + espace de vie unique.

- Pour un jardin ou un int\u00e9rieur, votre client n’ach\u00e8te pas de la technique, - il ach\u00e8te une « ambiance ». Ce site est votre galerie d’art. + Création de jardins, terrasses et aménagements paysagers sur-mesure. + Chaque projet est conçu pour sublimer votre environnement et valoriser votre bien.

Cr\u00e9ations à Douai, Orchies, Valenciennes, Saint-Amand et environs. diff --git a/app/plombier/page.tsx b/app/plombier/page.tsx index d3d9ec8..e286d48 100644 --- a/app/plombier/page.tsx +++ b/app/plombier/page.tsx @@ -72,12 +72,12 @@ export default function PlombierDemo() { Disponible 7j/7 — Intervention rapide

- Convaincre en{" "} - 3 secondes chrono. + Votre plombier{" "} + réactif et transparent.

- Quand un client a une fuite d’eau ou une panne de courant, il ne veut pas lire - votre histoire. Il veut un num\u00e9ro, un prix, et une arriv\u00e9e rapide. + Fuite d’eau, panne de chauffe-eau, canalisation bouchée ? + Intervention rapide avec devis gratuit. Disponible 7j/7 dans le Douaisis.

D\u00e9pannage Douai · Orchies · Valenciennes · Denain · Saint-Amand · Arleux diff --git a/components/marketing/Hero.tsx b/components/marketing/Hero.tsx index e21ecc6..ca04cdf 100644 --- a/components/marketing/Hero.tsx +++ b/components/marketing/Hero.tsx @@ -21,10 +21,10 @@ export default function Hero() { {/* Subtitle */}

- Couvreurs, Maçons, Paysagistes : Arrêtez de perdre des chantiers - à cause d’une image « bricolée ». Depuis Flines-lez-Raches, je vous - construis une forteresse numérique inviolable qui filtre les curieux - et attire les vrais projets à Douai, Orchies et Valenciennes. + Un site professionnel à la hauteur de votre savoir-faire. + Depuis Flines-lez-Raches, je conçois des vitrines numériques + performantes qui inspirent confiance et génèrent des demandes + qualifiées à Douai, Orchies et Valenciennes.

{/* CTA */} diff --git a/components/ui/MagicReveal.tsx b/components/ui/MagicReveal.tsx index 77c3899..331c841 100644 --- a/components/ui/MagicReveal.tsx +++ b/components/ui/MagicReveal.tsx @@ -5,16 +5,16 @@ import { useState, useRef, useCallback } from "react"; interface MagicRevealProps { avantLabel: string; apresLabel: string; - avantColor?: string; - apresColor?: string; + avantImage: string; + apresImage: string; height?: string; } export default function MagicReveal({ avantLabel, apresLabel, - avantColor = "bg-red-50", - apresColor = "bg-green-50", + avantImage, + apresImage, height = "h-64", }: MagicRevealProps) { const [position, setPosition] = useState(50); @@ -45,47 +45,57 @@ export default function MagicReveal({ }, []); return ( -
- {/* Apr\u00e8s (fond complet) */} -
-
-

Apr\u00e8s

-

{apresLabel}

-
-
- - {/* Avant (clip\u00e9 \u00e0 gauche) */} +
-
-

Avant

-

{avantLabel}

+ {/* Après (fond complet) */} + {apresLabel} + + {/* Avant (clipé à gauche) */} +
+ {avantLabel}
+ + {/* Barre de séparation */} +
+
+ + + +
+
+ + {/* Labels gauche/droite */} +
AVANT
+
APRÈS
- {/* Barre de s\u00e9paration */} -
-
- - - -
+ {/* Légendes sous l'image */} +
+ {avantLabel} + {apresLabel}
- - {/* Labels gauche/droite */} -
AVANT
-
APR\u00c8S
); }