feat: enable GH Pages stable plus deploy externe Vercel/Netlify

2026-03-02 09:06:42 +01:00
parent ca0904824a
commit 58a94001f8
128 changed files with 84617 additions and 400 deletions
@@ -0,0 +1,70 @@
+# DA-00 — Home page Figma capture log (2026-03-02)
+
+## Scope exécuté
+- Objectif: capturer la home page statique `index.html` avec style `styles.css` pour DA-00 (Desktop/Mobile)
+- Branchement cible: `http://127.0.0.1:4174/`
+- Typo/Palette: conforme aux tokens déjà en place dans :
+  - `notes-interne/creative-direction-brief.md`
+  - `specs/site-github-pages-spec.md`
+
+## Fichier créé (obligatoire)
+1. Capture 390 (`newFile`) — Team utilisée: `team::1358840601337404242` (Full seat)
+   - `captureId`: `d42b3736-86a0-4317-aba3-db38e3fd8081`
+   - Viewport exécuté: `390x2600`
+   - Résultat: **completed**
+   - Claim URL: `https://www.figma.com/integrations/claim/fnqOdDOU97v7E27LxkV7cn`
+2. Capture 390 de secours (réémission initiale) :
+   - `captureId`: `8e837489-b410-4fe6-bcd9-164cfc06ea28`
+   - Viewport exécuté: `390x2600`
+   - Résultat: **completed**
+   - Claim URL: `https://www.figma.com/integrations/claim/ZKgr7hsRPsU9FxZ1D3C9CC`
+3. Capture 768 (`newFile`) :
+   - `captureId`: `a592d67e-df53-427a-bbc1-451b2cd00072`
+   - Viewport exécuté: `768x2600`
+   - Résultat: **completed**
+   - Claim URL: `https://www.figma.com/integrations/claim/zAedZvfZMYMxY1UfnKftGr`
+4. Capture 1024 (`newFile`) :
+   - `captureId`: `e5039698-8d12-4fbb-b67c-556cc3af48be`
+   - Viewport exécuté: `1024x2600`
+   - Résultat: **completed**
+   - Claim URL: `https://www.figma.com/integrations/claim/6ZP1SHZVN5rgWrig10Lh9i`
+5. Capture 1440 (`newFile`) :
+   - `captureId`: `b7aa2fbd-d715-4522-8b22-acdd6d058b28`
+   - Viewport exécuté: `1440x2600`
+   - Résultat: **completed**
+   - Claim URL: `https://www.figma.com/integrations/claim/ZMeMDAbbfYnDMgfXOeIDA4`
+
+## Etat actuel
+- Le fichier Figma de base est bien créé.
+- `existingFile` pour regrouper plusieurs tailles dans le même fichier reste bloqué côté accès MCP (message: `This figma file could not be accessed`) avec `fileKey` de claim.
+
+## Blocage détecté
+- Les appels `existingFile` pour:
+  - `ZKgr7hsRPsU9FxZ1D3C9CC`
+  - `fnqOdDOU97v7E27LxkV7cn`
+  - `zAedZvfZMYMxY1UfnKftGr`
+  - `6ZP1SHZVN5rgWrig10Lh9i`
+  - `ZMeMDAbbfYnDMgfXOeIDA4`
+  retournent systématiquement:
+  - `This figma file could not be accessed.`
+- Docs Figma: mode probable “claim non consommé / résolution du vrai fileKey et permissions” en cours.
+
+## TODO d’exécution prêt à lancer
+1. Réclamer les 4 claims ci-dessus depuis la session Figma connectée (ou les ouvrir en parallèle).
+2. Pour chaque claim, nommer l’artboard:
+   - `Home 390`
+   - `Home 768`
+   - `Home 1024`
+   - `Home 1440`
+3. Fusionner les 4 captures dans un seul fichier Figma (ou en garder un fichier par breakpoint si la contrainte de claim persiste).
+4. Structurer selon la logique DA-00:
+   - `Header`
+   - `Hero + Identité`
+   - `Systèmes`
+   - `Production`
+   - `Conversion`
+   - `Footer`
+5. Vérifier `#a-propos`, `#projets`, `#contact` visuellement.
+6. Ajouter composants + variantes (`default`, `hover`, `focus-visible`, état lab collapsed/expanded si utilisé).
+7. QA finale visuelle: overflow, lisibilité mobile, contraste CTA.
+8. Archiver la preuve (captures + noms d’artboards + lien final) dans `artifacts/figma-capture/2026-03-02`.
@@ -0,0 +1,36 @@
+# G3 — Vérification DA / Responsive / Accessibilité (v8)
+
+Date: 2026-03-01
+
+## Scope
+- Validation de la passe DA studio pour la page d'accueil Astro (`src/pages/index.astro` + sections).
+- Vérification visuelle/UX locale (sans exécution de tests automatisés dans cette étape).
+
+## Changes appliqués
+1. Consolidation tokens visuels globaux
+- Nouveau tokenset électrique dans `src/styles/global.css`.
+- Classes sémantiques studio (`studio-panel`, `studio-link`, `studio-chip*`, `studio-muted`, etc.).
+
+2. UI systémique alignée
+- `src/components/ui/button.tsx` et `src/components/ui/card.tsx` sur tokens.
+- Header/nav/footer dans `src/pages/index.astro`.
+- Refonte visuelle et copy de toutes les sections: `Hero`, `About`, `Projects`, `Contact`.
+
+3. Gouvernance DA
+- Conformité maintenue au brief interne (experimental/noise, électrique, priorité lisibilité/impact).
+
+## Vérifications documentées
+- Aucune référence couleur violette dominante restante dans classes Tailwind des sections.
+- Contrat tracking préservé (mêmes `data-track` et événements).
+- `prefers-reduced-motion` conservé dans `global.css`.
+- Classes d’accessibilité clavier conservées (focus-visible).
+
+## Checklist métier
+- [x] Direction artistique visuelle uniforme (accroche hero + side card + sections).
+- [x] CTA lisibles et conservés: projets, contact, profil.
+- [x] Références externes conservées: LinkedIn / Malt / Bandcamp avec tracking.
+- [ ] Revue responsive 390/768/1024/1440 (audit visuel à réaliser en session de dev).
+- [ ] Revue accessibilité complète (focus order + contraste réel sur composants interactifs).
+
+## Prochaine action QA
+- Exécuter Lighthouse prod + revue GA4/SS to close P2 sprint.
@@ -0,0 +1,24 @@
+# G3 Verification v9 - Production Readiness (local + external gates)
+
+Date: 2026-03-01
+Owner: QA/Test
+
+## Local gates
+- [x] `npm run typecheck` passe (0 erreur)
+- [x] `npm run build` passe (site statique genere)
+- [x] `public/robots.txt` present et coherent
+- [x] `public/sitemap.xml` present et coherent
+- [x] Contrat tracking front present (`src/lib/tracking.ts`)
+- [x] GTM default present (`GTM-5SLM67QF`)
+- [x] Canonical + OG/Twitter tags presents (`src/layouts/BaseLayout.astro`)
+
+## External gates (a valider en prod)
+- [ ] GA4 Realtime: events recus apres clic CTA
+- [ ] GA4 DebugView: `event_category/event_label/destination` corrects
+- [ ] GA4 conversions configurees (LinkedIn primaire, Malt secondaire)
+- [ ] Search Console: propriete verifiee + sitemap soumis
+- [ ] Social previews: LinkedIn/Facebook debug passes
+
+## Notes
+- QA Playwright locale effectuee sur 390/768/1024/1440 avec themes dark/light/high-contrast.
+- Pipeline logo prepare (`notes-interne/logo-prompts-electron-rare.md`, `tmp/imagegen/electron-rare-logo-batch.jsonl`), generation finale en attente de cle API.
@@ -0,0 +1,34 @@
+# G0 DA-00 - Brief + Wireflow Conversion
+
+Date: 2026-03-02
+Owner: Codex
+Status: READY FOR DA-01
+
+## Scope covered
+- Consolidation brief DA v2.0.0
+- Guidelines DA enrichies (zoning + matrice arbitrage)
+- Spec projet alignee DA-00
+- Wireflow conversion documente (desktop 1440 + mobile 390 + user flow CTA)
+- Backlog DA-01 decision-complet
+
+## Files delivered
+- notes-interne/creative-direction-brief.md
+- notes-interne/creative-direction-guidelines.md
+- specs/site-github-pages-spec.md
+- docs/wireflow-conversion-da00.md
+- docs/da-01-implementation-backlog.md
+
+## Decisions locked
+- readability_priority: balanced
+- anchors core preserved: #a-propos, #projets, #contact
+- DA axis: atelier premium (ivoire/encre/cuivre) + accents techniques mesurés
+- CTA primary: LinkedIn; secondary: Malt
+
+## Validation notes
+- Figma MCP not detected in this environment at planning time.
+- Fallback applied: decision-complete wireflow documentation ready for manual Figma execution.
+
+## Next gate (DA-01)
+- Implement full structural/UI refactor from wireflow
+- Preserve tracking/SEO contracts
+- Run QA responsive/accessibility/build gates
@@ -0,0 +1,46 @@
+# G1 Logo Selection + Integration
+
+Date: 2026-03-02
+Status: PASS
+
+## Source and selection
+- Source officielle: `output/VALIDE DA`
+- Note de selection: `notes-interne/logo-selection-2026-03-02.md`
+- Winner: `001-create-a-vector-logo-for-electron-rare-with-an-er-monogram-b.png`
+- Backup A: `010-produce-a-favicon-first-hazard-signal-icon-for-electron-rare.png`
+- Backup B: `005-generate-a-minimal-industrial-logo-with-telemetry-data-frame.png`
+
+## Freeze working set
+- `tmp/brand-selection/001-create-a-vector-logo-for-electron-rare-with-an-er-monogram-b.png`
+- `tmp/brand-selection/010-produce-a-favicon-first-hazard-signal-icon-for-electron-rare.png`
+- `tmp/brand-selection/005-generate-a-minimal-industrial-logo-with-telemetry-data-frame.png`
+
+## Assets generated
+- `public/assets/brand/logo-mark.png` (1024x1024)
+- `public/assets/brand/logo-lockup.png` (1400x700)
+- `public/assets/brand/logo-mark.svg` (derived)
+- `public/assets/brand/logo-lockup.svg` (derived)
+- `public/favicon.svg`
+- `public/favicon.ico`
+- `public/favicon-32x32.png`
+- `public/favicon-16x16.png`
+- `public/apple-touch-icon.png`
+- `public/assets/og-cover.jpg` (1200x630)
+
+## Code integration
+- `src/lib/site.ts`: BRAND_ASSETS paths -> final brand PNG assets
+- `src/layouts/BaseLayout.astro`: favicon link set completed (svg/png/ico/apple)
+- `src/styles/global.css`: header brand mark path updated to `/assets/brand/logo-mark.png`
+
+## Regression contract checks
+- Anchors core unchanged: `#a-propos`, `#projets`, `#contact`
+- Tracking contract untouched (events/params)
+- SEO public resources preserved (`robots.txt`, `sitemap.xml`, canonical/OG/Twitter)
+
+## Build checks
+- `npm run typecheck`: PASS (0 errors)
+- `npm run build`: PASS
+
+## Notes
+- SVG outputs are derived wrappers from PNG source (no native vector source available).
+- Fallback behavior maintained: display relies on PNG quality; SVG kept for compatibility.
@@ -0,0 +1,35 @@
+# G2 DA-01 P0 — Structure layout control-room
+
+Date: 2026-03-02  
+Scope: finalisation P0 layout/tokens pour structure `index.astro` (sans changement des contrats publics)
+
+## Changements appliques
+- `src/styles/global.css`
+  - ajout des regles structurelles DA-01:
+    - `nav-main-row`, `nav-tools`, `nav-sub-row`, `nav-sub-chip`
+    - `studio-structure`, `structure-grid`, `structure-cell`
+    - variantes de grille: `--hero`, `--systems`, `--production`, `--conversion`
+    - `footer-grid`, `footer-title`, `footer-copy`, `footer-links`, `footer-link`
+  - ajout des breakpoints de composition:
+    - mobile `<768`
+    - tablette `>=768`
+    - desktop large `>=1140`
+    - micro-ajustements `<=390`
+
+## Contrats verifies (non modifies)
+- Anchors core conserves:
+  - `#a-propos`
+  - `#projets`
+  - `#contact`
+- Tracking conserve:
+  - events `TRACK_EVENTS` inchanges
+  - attributs `data-track` / `data-destination` inchanges
+- SEO/GTM non touches dans ce lot.
+
+## Verification technique
+- `npm run typecheck` -> OK (0 erreur)
+- `npm run build` -> OK (build Astro statique complet)
+
+## Notes
+- Ce lot couvre la stabilisation layout/tokens P0.
+- Les validations visuelles navigables (390/768/1024/1440) et QA accessibilite fine restent dans P1 QA.
@@ -0,0 +1,68 @@
+# G3 DA-01 P1 — Harmonisation sections + footer + references GitHub
+
+Date: 2026-03-02  
+Scope: harmoniser les sections conversion-first et intégrer les references projets GitHub fournies.
+
+## Changements appliques
+
+- `src/components/sections/SystemPipeline.tsx`
+  - labels pipeline harmonises (framing pro/automatisme).
+  - ajout intro section + chips de signaux.
+
+- `src/components/sections/FlowDiagram.tsx`
+  - ajout intro section + chips narratifs du flux mission.
+
+- `src/components/sections/About.tsx`
+  - titre et lead alignes sur le positionnement "profil systeme".
+
+- `src/components/sections/Contact.tsx`
+  - ajout lead conversion orientee cadrage mission.
+
+- `src/components/sections/Projects.tsx`
+  - harmonisation du bloc projets.
+  - ajout panel de references GitHub:
+    - `KomplexKapharnaum/KXKM_ESP32_Audio_Battery_hardware`
+    - `KomplexKapharnaum/LEDcurtain_hardware`
+    - `KomplexKapharnaum/kxkm_Ve.direct`
+    - `KomplexKapharnaum/KXKM_Batterie_Parallelator`
+    - `KomplexKapharnaum/STM32_ESP32_firmware`
+    - `KomplexKapharnaum/LEDcurtain`
+    - `electron-rare/`
+
+- `src/components/sections/ProjectsTimeline.tsx`
+  - ajout entree timeline "Open repos references" vers GitHub.
+  - ajustement wording des liens de preuve.
+
+- `src/components/sections/LabNotes.tsx`
+  - ajout lead de debrief technique.
+
+- `src/components/sections/TrustStrip.tsx`
+  - enrichissement des preuves avec details et mention GitHub.
+
+- `src/pages/index.astro`
+  - footer passe en mode knowledge/protocoles/links externes (LinkedIn, Malt, Bandcamp, GitHub).
+
+- `src/styles/global.css`
+  - ajout classes de coherence P1:
+    - `section-lead`, `section-signal-row`, `section-signal-chip`
+    - `project-stage`, `project-reference-*`
+    - `trust-pill-detail`
+    - `footer-column-title`, `footer-protocol-list`, ajustements `footer-grid`
+
+## Contrats verifies (non modifies)
+
+- Anchors core conserves:
+  - `#a-propos`
+  - `#projets`
+  - `#contact`
+- Contrat tracking conserve (events existants conserves; aucune suppression d'event).
+- Contrat SEO/GTM conserve.
+
+## Verification technique
+
+- `npm run typecheck` -> OK (0 erreur)
+- `npm run build` -> OK (build Astro statique complet)
+
+## Notes
+
+- QA responsive/accessibilite fine (visuelle cross-breakpoints) reste a confirmer en revue manuelle finale.
@@ -0,0 +1,55 @@
+# G4 — Recherche UI/UX + QA responsive DA
+
+Date: 2026-03-02  
+Owner: Design/QA
+
+## Decisions appliquees
+
+1. References GitHub dans Projets:
+- mode retenu: **top 3 + lien "voir plus"**
+
+2. Tracking GitHub:
+- events GA4 dedies ajoutes:
+  - `outbound_github_project`
+  - `outbound_github_contact`
+
+3. QA immediate:
+- passe responsive effectuee en local sur 390/768/1024/1440
+
+## Verifications locales
+
+### Build/qualite
+- `npm run typecheck` -> OK
+- `npm run build` -> OK
+
+### Captures responsive
+- `artifacts/qa-test/2026-03-02/home-390.png`
+- `artifacts/qa-test/2026-03-02/home-768.png`
+- `artifacts/qa-test/2026-03-02/home-1024.png`
+- `artifacts/qa-test/2026-03-02/home-1440.png`
+
+### Lighthouse (local preview)
+- mobile: `artifacts/qa-test/2026-03-02/lighthouse-home-mobile-v5.json`
+  - Performance: **54**
+  - Accessibility: **100**
+  - Best Practices: **100**
+  - SEO: **100**
+- desktop: `artifacts/qa-test/2026-03-02/lighthouse-home-desktop-v5.json`
+  - Performance: **90**
+  - Accessibility: **100**
+  - Best Practices: **100**
+  - SEO: **100**
+
+## Etat P1
+
+- Harmonisation sections: OK
+- Footer knowledge/protocoles: OK
+- QA responsive/accessibilite/perf: **partiel**
+  - responsive + accessibilite: OK local
+  - perf mobile: sous cible (objectif >= 90 non atteint)
+
+## Prochain levier anti-blocage
+
+1. Reduire l'hydration client sur zones non critiques (objectif: baisse TBT mobile)
+2. Confirmer en prod les mesures Lighthouse (environnement GitHub Pages)
+3. Passer a Storybook P2 une fois perf mobile stabilisee
@@ -0,0 +1,24 @@
+PASS,home-1024,1024,1024,2239
+PASS,home-1440,1440,1440,2074
+PASS,home-390,390,390,2941
+PASS,home-768,768,768,2562
+PASS,home-contact-1024,1024,1024,2239
+PASS,home-contact-1440,1440,1440,2074
+PASS,home-contact-390,390,390,2941
+PASS,home-contact-768,768,768,2562
+PASS,home-projets-1024,1024,1024,2239
+PASS,home-projets-1440,1440,1440,2074
+PASS,home-projets-390,390,390,2941
+PASS,home-projets-768,768,768,2562
+PASS,lab-1024,1024,1024,900
+PASS,lab-1440,1440,1440,900
+PASS,lab-390,390,390,844
+PASS,lab-768,768,768,1024
+PASS,lab-prototypes-1024,1024,1024,900
+PASS,lab-prototypes-1440,1440,1440,900
+PASS,lab-prototypes-390,390,390,844
+PASS,lab-prototypes-768,768,768,1024
+PASS,lab-signals-1024,1024,1024,900
+PASS,lab-signals-1440,1440,1440,900
+PASS,lab-signals-390,390,390,844
+PASS,lab-signals-768,768,768,1024
@@ -0,0 +1,100 @@
+# P1 QA Report - Responsive + Storybook + Prod Checklist
+
+- Date: 2026-03-02
+- Scope: Home statique (`/`) + module interactif (`/lab/`)
+- Environment: local server `http://127.0.0.1:4173`
+
+## 1) Passe visuelle responsive (390/768/1024/1440)
+
+### Captures generees
+- Home: `home-*.png`
+- Home ancre projets: `home-projets-*.png`
+- Home ancre contact: `home-contact-*.png`
+- Lab overview: `lab-*.png`
+- Lab signals (hash route): `lab-signals-*.png` via `/lab/#/signals`
+- Lab prototypes (hash route): `lab-prototypes-*.png` via `/lab/#/prototypes`
+
+Dossier: `artifacts/qa-test/2026-03-02/responsive-p1/`
+
+### Controle overflow (proxy technique via largeur image)
+- Regle: largeur image capturee == largeur viewport attendue
+- Resultat: `24/24 PASS`
+- Preuve: `image-dimensions.csv`
+
+### Resultat visuel
+- 390: navigation et CTA lisibles, cartes projets en colonne, section contact accessible.
+- 768: grille home stable, hierarchy typographique correcte, lab lisible.
+- 1024: grille projets en 3 cartes stable, pas de debordement.
+- 1440: layout home + lab coherent, densite visuelle conforme DA v2.
+
+### Observation
+- Les sections avec `data-reveal` ne deviennent visibles qu'au scroll (normal), d'ou besoin de captures ancrees (`#projets`, `#contact`) pour la verification complete.
+- Routing statique module C corrige: passage de `BrowserRouter` a `HashRouter` pour eviter les 404 directs en hebergement GitHub Pages.
+
+## 2) Storybook coverage P2
+
+Commande executee:
+```bash
+npm run storybook:build
+```
+
+Resultat:
+- Status: PASS
+- Output: `storybook-static/`
+- Warnings non bloquants:
+  - directives `"use client"` ignorees dans `framer-motion` lors du bundling
+  - chunk size warning > 500kB (storybook docs bundle)
+
+## 3) Checklist prod GA4 / Search Console
+
+### GA4/GTM (verifiable localement)
+- [x] Container GTM present (`GTM-5SLM67QF`) dans `index.html`
+- [x] Push `dataLayer` actif
+- [x] Events hero existants conserves:
+  - `cta_hero_projets`, `cta_hero_contact`, `cta_hero_profile`
+- [x] Events GitHub dedies actifs:
+  - `outbound_github_project_rtc_bl_phone`
+  - `outbound_github_project_zacus`
+  - `outbound_github_project_site`
+  - `outbound_github_lab_more`
+  - `cta_lab_interactif_open`
+- [x] Legacy fallback conserve via `data-track-legacy` pour compatibilite historique
+
+### Search Console / SEO (verifiable localement)
+- [x] `robots.txt` a la racine
+- [x] `sitemap.xml` a la racine
+- [x] Sitemap maj au 2026-03-02 avec:
+  - `/`
+  - `/lab/`
+- [x] Canonical + OG + Twitter tags presents dans `index.html`
+
+### A faire en prod (manuel)
+- [ ] GA4 DebugView: verifier reception de tous les events dedies GitHub
+- [ ] GA4 Realtime: verifier session + events sur domaine public
+- [ ] Search Console: soumettre `https://electron-rare.github.io/sitemap.xml`
+- [ ] Search Console: verifier indexation de `/` et `/lab/`
+- [ ] Validation preview sociale LinkedIn/Facebook
+
+## Verdict P1
+- Responsive QA: PASS
+- Storybook coverage build: PASS
+- Prod checklist locale: PASS
+- Actions manuelles restantes: GA4 DebugView + Search Console en environnement public
+
+## 4) Preflight et pipeline pages
+
+Commande executee:
+```bash
+npm run preflight:pages
+```
+
+Resultat:
+- Status: PASS
+- Etapes validees:
+  - `lab:build`
+  - `tracking:check`
+  - `storybook:build`
+- Warnings non bloquants identiques sur Storybook/framer-motion.
+
+Mise a jour CI:
+- Workflow `.github/workflows/deploy-pages.yml` migre vers publication statique + module `/lab/` via artifact `.pages-dist`.