Réalisations / 04 · Toiture · Concept
Ardoise
Un site de couvreur traité comme un dossier de plans : cotes, repères et cartouche.
Concept C/26 — Projet fictif créé pour démontrer notre approche.

- Projet
- Ardoise
- Secteur
- Couvreur : toiture, zinguerie, charpente et isolation
- Nature
- Concept C/26, projet fictif
- Typographies
- Archivo (axe de largeur) · Titres condensés et gras, textes en largeur normale, chiffres tabulaires
- Interactions
- Demande de devis en trois étapes avec indicateur et validation par étape
- Filtre des chantiers par type de travail
- Coupe de toiture qui se trace à l’apparition
- Barre de devis et d’urgence fixe sur mobile
Le concept
Un bon couvreur mesure avant de chiffrer. Le site reprend ce geste : chaque page est une feuille du dossier, et la toiture est expliquée couche par couche, comme sur une coupe d’architecte. On y trouve vite les trois réponses attendues : ce qui est fait, où, et comment demander un devis.
La direction artistique
Un plan technique de tradition suisse : trame de plan en fond, grille stricte, lignes de cote fléchées et numéros de repère cerclés. Archivo condensée et grasse pour les titres, gris ardoise et bleu de Prusse sur blanc froid, un orange de sécurité réservé à l’action principale. Les photos passent en cyanotype ou en noir et blanc, sauf sur les fiches de chantier.
- Plans d’architecte
- Cyanotype
- Graphisme suisse
- Dessin technique
- Ardoise
- Zinc
- Cartouches de plan
- Blanc froid#f3f5f7
- Gris ardoise#2f3640
- Bleu de plan#1f4e8c
- Orange sécurité#ff7a1a
- Gris de cote#5a6572
Aperçu du site
Un site réel, navigable.
Sections représentatives

La coupe de toiture
Un dessin technique à sept repères, de l’ardoise à la gouttière, avec sa légende.

Les chantiers
Des fiches techniques filtrables : matériaux, surface, durée.

La demande de devis
Trois étapes, un indicateur, et un numéro d’urgence toujours à côté.
L’approche C/26
La demande de devis se fait en trois étapes courtes, avec un indicateur d’étape et une validation au fil des étapes ; sans JavaScript, tout reste lisible sur une seule page. Le bouton de devis reste à portée de main : dans l’en-tête sur grand écran, dans une barre fixe sur mobile. Un encart d’urgence donne le numéro à appeler en cas de fuite ou de tempête.
Concept C/26 — Projet fictif créé pour démontrer notre approche.