# HOT MOTOR MOTION — référence complète

> Ce fichier développe `llms.txt`. Il décrit ce que fait l'application, le format de
> projet qu'elle lit et écrit, et les chemins exacts à utiliser. Il est écrit pour être
> lu par une machine : chaque affirmation correspond à un comportement implémenté.

Version 1.1.0 · Licence MIT · Auteur : Simon Dupont (zigmoon)
Web : https://app.zigmoon.com/motion/ · Code : https://github.com/zigmoon/HOTMOTORMOTION

---

## 1. Ce qu'est le logiciel

HOT MOTOR MOTION est un éditeur de motion design local-first. L'application complète
tourne dans un navigateur ; une coquille Tauri fournit la même application en `.dmg`,
`.exe`/`.msi`, `.deb`/`.AppImage`.

Ce qu'il n'est pas : ni un éditeur vidéo (pas de piste audio, pas de découpe), ni un
outil de compositing 3D (les rotations X/Y sont des projections approchées), ni un
service (aucun compte, aucun stockage côté serveur).

## 2. Modèle temps / courbes

- Durée de projet : 3 s à 5 min.
- Une propriété animée porte un tableau d'images clés `{ t, v, e }`, trié par `t`.
- `e` s'applique au segment **dont cette image clé est le début**. La dernière image clé
  d'une propriété n'a donc pas besoin de courbe.
- Courbes disponibles et comportement :
  - `linear` — vitesse constante.
  - `sineIn`, `sineOut`, `sineInOut` — sinusoidal, sans dépassement.
  - `cubicIn`, `cubicOut`, `cubicInOut` — la valeur sûre.
  - `expoIn`, `expoOut`, `expoInOut` — départ ou arrivée très rapides.
  - `backOut`, `backInOut` — anticipation / léger dépassement.
  - `elasticOut` — oscillation amortie.
  - `spring` — amorti critique approché, court dépassement.
- Les courbes modifient le rendu final : elles ne sont pas « cuites » dans les images
  clés, donc modifier une courbe change l'animation sans retoucher les images clés.

## 3. Format de projet

```json
{
  "app": "HOT MOTOR MOTION",
  "version": "1.0",
  "name": "HOT MOTOR MOTION Project",
  "created": "2026-10-26T00:00:00.000Z",
  "duration": 10,
  "canvas": { "width": 800, "height": 450 },
  "bgColor": "#121212",
  "shapes": [
    {
      "id": 1,
      "type": "Circle",
      "name": "Dot",
      "x": 120, "y": 225, "z": 0,
      "radius": 6,
      "fill": "#f5c518",
      "opacity": 0.9,
      "keyframes": {
        "x": [
          { "t": 2.0, "v": 120, "e": "sineInOut" },
          { "t": 3.2, "v": 680, "e": "sineInOut" },
          { "t": 4.4, "v": 120 }
        ]
      }
    }
  ]
}
```

Règles de lecture :

- Un champ absent prend la valeur par défaut suivante : `x` 400, `y` 225, `z` 0,
  `width` 100, `height` 100, `radius` 50, `fill` `#ffffff`, `opacity` 1, `scaleX`/`scaleY` 1,
  `rotation`/`rotationX`/`rotationY`/`skewX`/`skewY` 0, `blur` 0, `glow` 0,
  `hue` 0, `saturation` 100, `brightness` 100, `contrast` 100, `fontSize` 30,
  `fontFamily` `JetBrains Mono`, `fontWeight` 500.
- Les champs inconnus sont ignorés : un projet écrit à la main doit s'ouvrir.
- Une image clé dont `t` ou `v` n'est pas numérique est écartée silencieusement à
  l'ouverture — un `NaN` dans une courbe casse tout le rendu.
- Une courbe inconnue retombe sur `linear`.
- Les SVG voyagent en data URL dans `imageSrc`, ce qui garde un projet autonome.

## 4. Exports

| Sortie | Format | Remarque |
|---|---|---|
| HTML autonome | `.html` | lecteur complet : données, courbes, styles, contrôles. Aucune dépendance réseau. |
| JavaScript | `.js` | le même lecteur, à insérer dans une page existante. |
| JSON | `.json` | le projet, relisible par l'éditeur et par `motion-cli`. |
| WebM | `.webm` | capture temps réel via `MediaRecorder`, 640 × 360 → 3840 × 2160, 24/30/60 i/s. Au-delà de 4K, le canevas dépasse ce qu'un navigateur alloue. |
| SVG | `.svg` | une image fixe à un instant donné, produite par le moteur Rust (`motion-cli render`). |

## 5. Assistant IA

- Fournisseurs et points d'entrée :
  - OpenAI `https://api.openai.com/v1/chat/completions`
  - Anthropic `https://api.anthropic.com/v1/messages`
  - Gemini `https://generativelanguage.googleapis.com/v1beta/models/{model}:generateContent`
  - xAI `https://api.x.ai/v1/chat/completions`
  - DeepSeek `https://api.deepseek.com/chat/completions`
  - Groq `https://api.groq.com/openai/v1/chat/completions`
  - OpenRouter `https://openrouter.ai/api/v1/chat/completions`
  - Mistral `https://api.mistral.ai/v1/chat/completions`
  - Cohere `https://api.cohere.com/v2/chat`
  - Ollama `http://127.0.0.1:11434/v1/chat/completions` (local, sans clé)
- Découverte des modèles : `GET /models` chez chaque fournisseur, `/api/tags` pour
  Ollama. Les modèles non conversationnels (embeddings, transcription, génération
  d'images, modération) sont écartés ; les familles majeures passent avant les modèles
  de niche ; à famille égale, le plus récent d'abord. Un identifiant absent de la liste
  peut être saisi à la main.
- Conversation : les douze derniers messages sont transmis, ce qui permet de demander
  « rends-le rouge » après une première génération.
- Réponse attendue : `{ "message": "...", "action": "add|modify|replace", "shapes": [...] }`.
  Toute édition est une étape d'annulation.
- Le relais serveur refuse tout hôte absent de sa liste blanche (protection SSRF).

## 6. Plateformes

- Navigateurs : Chrome, Edge, Firefox, Safari récents. `MediaRecorder` est nécessaire
  pour l'export vidéo ; son absence n'empêche pas le reste.
- Bureau : macOS 10.15+ (Apple Silicon et Intel), Windows 10/11 x64, Linux x64.
- Le moteur Rust compile sans dépendance externe (`cargo test` hors ligne).

## 7. Fichiers et points d'entrée utiles

- `index.html` — application de référence, sans build.
- `js/bundle.js` — moteur (courbes, éditeur, timeline, IA, sauvegarde automatique).
- `js/presets.js` — bibliothèque (`window.HMMPresets`).
- `js/shell.js` — thème, panneaux, service worker.
- `astro/` — génération de la page 404 et de l'aperçu social ; le site déployé est
  l'application elle-même, sans page marketing.
- `rust/` — `motion-core` (modèle, courbes, SVG, HTML) et `motion-cli`.
- `desktop/` — coquille Tauri et pont d'enregistrement natif.
- `proxy.php` — relais IA pour hébergement PHP.
- `scripts/build-icons.mjs` — jeu d'icônes dérivé du logo.

## 8. API JavaScript exposée

```js
window.editor.addShape('Rect');
window.editor.serializeProject();
window.editor.generateExportJS('full');   // 'full' | 'js' | 'data'
window.editor.undo();
window.editor.exportWebM(1920, 1080, 60, 10_000_000);
window.editor.timeline.seek(1.5);
window.HMMPresets.get('logoLockup');
window.HMMPresets.categories;
window.HMMAutosave.restore();             // restaure l'instantané local
window.HMMAutosave.saveNow('manual');
window.aiAssistant.connect();             // après configuration du fournisseur
```

## 9. Accessibilité et vie privée

- Interface en français, thème sombre par défaut, thème clair en un clic.
- `prefers-reduced-motion` est respecté.
- Aucune télémétrie, aucun cookie publicitaire, aucun envoi de projet.
- La clé d'API ne quitte pas l'onglet : elle n'est ni journalisée ni stockée.
- Le seul appel réseau externe est celui que déclenche l'utilisateur (IA) ou le
  chargement des polices Google Fonts.