# Structura — Brief prototype commercial

> Prototype web front-end pour démo prospect (AO "Refonte ergonomique pour diffusion de programmes techniques python"). Pas de backend, données factices, reset au F5.

## Contexte client (depuis l'AO)

- Entreprise de prestations d'analyse de **structure de bâtiments et de ponts** à partir d'enregistrements faits avec des **capteurs** (mesures vibratoires / accélérométriques / statiques).
- Tous les outils de traitement et d'interprétation ont été développés en **Python**, fiables techniquement.
- Objectif : **diffuser ces outils à des partenaires** (bureaux d'études, ingénieurs externes) → besoin de les rendre ergonomiques et professionnels.
- Demandes explicites :
  1. **Revue des programmes Python** (agencement, modularité)
  2. **Création d'un environnement graphique complet**
  3. **Confidentialité du code source** (éviter d'envoyer les `.py` un peu partout)
- Budget annoncé : 1 000 € à 10 000 €
- Type d'outil : **B2B interne / partenaires** → desktop only, pas de version mobile.

## Nom commercial du prototype

**Structura** — plateforme d'analyse structurelle par capteurs (nom fictif retenu pour la démo).

## Effet commercial visé

"Vous avez vos outils Python. Nous les emballons dans une interface pro que vos partenaires peuvent installer en 2 clics, utiliser sans connaissance Python, et dont le code source reste confidentiel."

Le prospect doit regarder le proto et penser : **"c'est exactement ce qu'on imaginait"**.

## Hypothèses EXPLICITES (à valider avec le prospect ensuite)

- Les partenaires sont des bureaux d'études ou ingénieurs qui installent l'outil localement.
- Le code Python tourne en local chiffré (non exposé à l'utilisateur), l'UI Structura est la couche de confort autour.
- Les types d'analyses montrées (amplitudes, FFT/fréquences, détection d'anomalies, timeline) sont représentatifs du domaine monitoring structurel — à confirmer avec le client réel.
- Les structures analysées : ponts (tablier + piliers + câbles) et bâtiments (étages + poteaux). Le proto en montre 1 de chaque.

## Public de la démo

- Un décideur technique (probablement le porteur de projet Python, fiabilité technique déjà validée côté code).
- Peut-être aussi un dirigeant business (celui qui signe le budget).

## 5 écrans du prototype

1. **Dashboard accueil** — KPI globaux (projets actifs, capteurs en ligne, alertes), derniers événements, mini-preview 3D d'une structure, hero animé.
2. **Projets** — liste des projets (ponts, bâtiments), filtres (type, statut, criticité), stats agrégées, cartes animées à l'entrée.
3. **Détail projet** — viz 3D de la structure (react-three-fiber), capteurs cliquables avec tooltip, panneau latéral avec infos et mesures en temps réel (ticker animé).
4. **Analyses** — graphs SVG animés : courbes d'amplitude, spectre fréquentiel (FFT), heatmap des anomalies détectées, timeline des événements. Tabs entre les types d'analyse.
5. **Diffusion partenaires** — liste partenaires (logos, adresses, statut licence), bouton "Secure Deploy" qui anime l'envoi d'un build chiffré avec logs de déploiement en temps réel, gestion des accès (read-only/full).

## Ton / palette secteur

- **Secteur** : ingénierie civile / monitoring structurel / IoT industriel / data scientifique.
- **Références visuelles** : Autodesk Tandem, Siemens Teamcenter, Palantir Foundry, Bentley Acute3D, Sentry.
- **Palette** : sombre techy + accent (bleu technique ou cyan électrique ou orange safety). Pas de pastel, pas de gradient flashy, pas de glassmorphism.
- **Typo** : sans-serif technique (Inter ou Geist) + mono pour les valeurs numériques (JetBrains Mono ou Geist Mono).
- **Motion** : smooth, 200-400ms, easing naturel, transitions sur les valeurs numériques (counter animé), entrée en cascade (stagger) des listes. Jamais d'overkill (pas de particle, pas de parallax lourd).

## User stories (priorité 1)

- US1. En tant que partenaire, je vois d'un coup d'œil le statut global de mes projets (dashboard).
- US2. Je filtre la liste des projets par type (pont/bâtiment) et statut.
- US3. J'ouvre un projet pont, je vois la structure en 3D et je clique sur un capteur pour voir ses mesures récentes.
- US4. Je passe aux analyses de ce projet et je switche entre amplitude / FFT / anomalies.
- US5. J'ouvre l'onglet partenaires et je déploie une nouvelle version chiffrée chez un partenaire (animation de la procédure).

## Composants UI partagés à créer dans [6] (contrat)

- **Shell** : `Sidebar`, `Topbar`, `PageHeader`, `Breadcrumbs`
- **UI primitives** : `Button`, `Card`, `Badge`, `Stat`, `Panel`, `Modal`, `Tabs`, `Input`, `Select`, `Tooltip`, `StatusDot`, `CounterValue` (valeur numérique animée)
- **Charts** : `LineChart`, `BarChart`, `Heatmap`, `SparkLine`, `RingMeter`
- **Three** : `SceneWrapper` (dynamic ssr:false), `Loader`

Chaque écran consomme ces composants sans les redéfinir.

## Périmètre NON inclus

- Aucun backend, aucune auth réelle, aucun cookie session.
- Pas de responsive mobile (outil interne partenaires pros).
- Pas d'intégration aux outils Python existants (proto seulement).
- Pas de rapport PDF téléchargeable réel (bouton présent mais non fonctionnel).

## Critères de réussite

- L'URL HTTPS est publique : `https://structura.cortex.out-scale.io`
- Chaque écran charge en < 2s, zéro erreur console.
- Les animations sont smooth, aucune saccade perceptible.
- Un prospect qui navigue pendant 3 min pense "c'est prêt" (hors F5).