Soul Matrix Dossier v2
Dossier de direction · refonte v2

Soul Matrix

Un rituel, pas une appli de notes. Une donnée d'âme, pas un profil publicitaire.

Le concept est fort et l'art des créatures est ton meilleur atout. Ce qui date, c'est la coquille : trois langages visuels qui se télescopent, une incohérence clair/sombre, une navigation qui se perd, des assets de 4 Mo. Ce document sépare ce qui tient de ce qui casse, pose une direction artistique unique, remet le rituel d'entrée à la hauteur de son rôle narratif, et rassemble un arsenal open-source pour reconstruire, en procédural quand c'est possible.

Flutter Web + Supabase 8 éléments · œuf → alien Anti-big-data Vers l'intérieur Niche assumée
01 · Le socle non négociable

Le manifeste avant les pixels

Toute décision de design en découle. Une proposition qui contredit un de ces piliers est écartée, même si elle « convertit » mieux.

P1

Le rituel EST le produit

Le questionnaire n'est pas une étape avant l'app : c'est le rite d'entrée dans le monde, comme un test astro ou MBTI. On ne le raccourcit pas pour « réduire la friction » : on l'élève. L'expérience se vit, elle ne se traverse pas.

P2

Anti-big-data

La donnée d'âme se construit par les choix actifs de l'utilisateur, jamais par un algorithme externe. On ne branche pas Spotify/Insta pour « deviner qui tu es » : ce serait la bulle de filtre qu'on combat. Tu choisis ce que tu es.

P3

Vers l'intérieur

Une app d'introspection sur le « moi », pas une machine à engagement ni un dating déguisé. Elle va vers l'intérieur, pas vers l'extérieur. Pour certains ce sera lent, et ce ne sont pas les bons utilisateurs.

P4

Les aliens sont vivants

Pas des icônes : des entités du lore. On les adopte, on tisse un lien, ils éclosent, ils peuvent fuguer, disparaître, avoir des interactions étranges. Leurs valeurs d'énergie nourrissent le dialogue passé/futur.

P5

Lien faible, ambiant, anonyme

Le social existe mais en basse intensité : résonance d'ambiance, anonyme, sans feed ni match. On ne pousse pas à collectionner des liens. La subjectivité et les limites personnelles sont le sujet.

P6

Niche assumée

La cohérence de l'univers prime sur la croissance. Pas besoin que tout le monde aime : il suffit que le monde tienne debout, même un peu étrange. Une app de niche, pleinement.

Conséquence design : chaque écran doit renforcer l'impression d'entrer dans un monde clos et cohérent. Le moindre élément « générique » (carte Material par défaut, blob flou, collage hors-univers) casse le sortilège, et donc casse le produit.


02 · Ce qui tient déjà

Ton art n'est pas le problème. Garde-le.

L'audit visuel est net : les créatures et les œufs sont d'un vrai niveau : verre iridescent, cohérence chromatique, présence. Le « moche » vient de tout ce qu'il y a autour. Ces quatre piliers sont l'ADN à préserver.

Le bestiaire des 8 éléments

Œuf → alien, chaque élément avec sa personnalité visuelle. Art fort et déjà distinctif, le cœur affectif du produit et le pont avec le film.

Le moteur émotion → musique

32 combinaisons émotionnelles (check-in à 5 axes) × 5 variantes = 160 morceaux curatés (titre, BPM, accords), plus la génération. Un système rare et cohérent avec l'introspection.

La mécanique œuf → éclosion → lien

Une progression collectible qui donne une raison de revenir sans logique d'engagement toxique : le lien se mérite dans le temps.

Le dialogue passé / futur

Écrire à son moi futur, revisiter son passé. Rituel introspectif multimodal (texte, voix, image, musique) : la boucle centrale, à raffiner, pas à jeter.

La palette est déjà là, dans tes créatures

Huit teintes iridescentes, majoritairement froides, avec le feu comme unique contre-accent chaud. C'est ton système de couleur natif : il faut le formaliser en tokens, pas le réinventer.

Dreamrêve
Electricfoudre
Firefeu
Lightlumière
Metalmétal
Shadowombre
Watereau
Windvent

03 · Pourquoi « c'est très moche »

Le diagnostic, sans détour

Ce que la visite de l'app a révélé, classé par gravité. Le fil rouge : une belle matière première emballée dans une coquille sous-produite et incohérente.

Critique

Trois langages visuels qui se télescopent

Créatures glassy haut de gamme + « blobs » flous en guise de cartes + collage grunge d'astronautes (splash, boutique). Trois univers étrangers cohabitent : l'œil ne sait plus quel monde il regarde.

Critique

Incohérence clair / sombre

Home et dialogue en noir cosmique ; profil, composeurs, musique en cartes blanches. Passer de l'un à l'autre en un tap brise l'immersion : le sortilège tombe.

Critique

Le chrome d'UI est sous-produit

Les cartes-réponses du questionnaire sont de simples halos flous sans structure ; le héros « SoulMatrix » est une forme noir-sur-noir illisible ; des fonds sont de plats ovales blancs. Ces composants trahissent l'ambition de l'art.

Élevé

Navigation et routing incohérents

Le retour navigateur et le rechargement désynchronisent URL et vue. Pas de navigation persistante, pas de menu : les features majeures sont enfouies derrière des icônes sans libellé et une scène 3D.

Élevé

Le rituel d'entrée est sous-produit, pas trop long

Le vrai reproche n'est pas la durée, c'est le manque de mise en scène. Un rite d'adoption mérite mieux que des cartes floues et une barre de progression anxiogène. ~6 questions théâtralisées valent mieux que N questions plates.

Élevé

Poids des assets

4,3 Mo par alien, 3,3 Mo pour le splash, PNG partout. Chargement lourd pour aboutir à une UI de la taille d'un téléphone sur desktop. C'est précisément là que le procédural (vecteur, shader, Rive) change tout.

Moyen

Zéro responsivité desktop + accessibilité

Canevas mobile figé centré dans un océan de marges ; zoom bloqué (user-scalable=no) ; contrastes faibles (gris sur noir) ; rendu 100 % canvas sans sémantique pour les lecteurs d'écran.

Moyen

Coquille non alignée à la marque

Métadonnées Flutter par défaut (« startup_app », favicon générique) alors que la marque in-app est soignée. Détails qui trahissent le beta.

Aujourd'hui

  • Cartes = halos flous sans bord ni structure
  • Héros noir sur noir, illisible
  • Collage astronaute hors-univers
  • Clair et sombre qui alternent
  • Icônes muettes, pas de nav
  • PNG 4 Mo

Cible v2

  • Verre iridescent sur le vide, un seul monde
  • Héros lumineux : l'alien vivant est la star
  • Tout l'art dérive du bestiaire
  • Sombre assumé, de bout en bout
  • Nav claire à 5 pôles, icônes lisibles
  • Vecteur / shader / Rive, léger et animé

04 · La direction artistique v2

Un seul monde : verre iridescent sur le vide

Une seule loi visuelle, tenue partout. Le vide profond comme scène, le verre iridescent comme matière, l'aura violet→cyan comme signature, la lumière comme récompense. On bannit le collage grunge et le mode clair.

Le composant, version v2

Verre translucide, bord lumineux fin, halo iridescent contenu, texte à contraste réel. La profondeur naît de la lumière, pas d'ombres portées lourdes.

Energie · Ombre Adopter

Cet œuf qui respire est dessiné en CSS pur, zéro image. C'est la démonstration du pilier procédural : ce que tu chargeais en 4 Mo peut vivre en quelques lignes, animé et net à toute taille.

Couleur

Vide bleu-violet (pas un noir pur), verre translucide, aura violet→cyan en signature, feu comme unique chaleur. La couleur d'accent d'un écran = l'élément de ton alien.

--void #07060D--violet #9B8CFF--cyan #5FE9E0

Typographie

Trois voix, pas six polices : un display sobre et large pour les titres, un texte lisible et calme, une mono technique pour l'heure, les données d'énergie, les libellés rituels. La mono porte le côté « instrument ».

DisplayTexteMono · données

Matière & profondeur

Glassmorphism cohérent (flou + bord 1px lumineux), halos radiaux contenus, grain fin universel pour souder les aplats, aucune ombre « Material ». La lumière est la seule récompense.

blurbord 1pxgrain

Mouvement

Ambiance qui respire (nébuleuse, particules lentes), micro-interactions tactiles, et un grand moment orchestré : l'éclosion. Jamais d'animation gratuite. prefers-reduced-motion respecté.

ambientmicroéclosion

Iconographie

Un seul jeu d'icônes au trait, cohérent et labellisé au premier lancement. On abandonne les « boutons verre » disparates au profit d'une grammaire unique.

line-iconslabels

Assets procéduraux

Fonds, auras, œufs, particules, la « matrice » 3D : générés (Canvas/WebGL/shader/Rive), pas des PNG. Les créatures restent en art rendu, mais exportées en Rive/sprite optimisé, pas en 4 Mo.

canvasshaderrive

05 · Le rite d'entrée

Réinaugurer le questionnaire comme cérémonie

Objectif : plus immersif, pas plus court. On garde ~6 questions, mais chacune devient une scène. On ne demande rien d'administratif avant la récompense. La donnée d'âme naît des choix, jamais d'un verdict imposé.

  1. I

    Le seuil

    Le film t'a amené ici. Un plan noir, une voix, une lumière lointaine : tu entres dans le monde.

  2. II

    L'éveil

    Un œuf réagit à ta présence (tap, souffle micro, gyroscope). Rien à remplir : juste un contact.

  3. III

    Les 6 épreuves

    Une question par écran plein. Chaque réponse fait réagir l'univers (couleur, son, particules).

  4. IV

    La résonance

    Plusieurs éléments te correspondent. On te le montre visuellement, sans score froid.

  5. V

    Le choix

    Tu adoptes activement ton alien parmi ceux qui résonnent. Tu n'es pas assigné : tu décides.

  6. VI

    L'éclosion

    Le moment cinématique. L'œuf s'ouvre. Le lien commence. C'est la première mémoire partagée.

  7. VII

    Le nom

    Tu nommes ton alien et le monde. Le compte se crée ici, après le don, jamais avant.

Les principes qui rendent la cérémonie « stylée »

Une question, un écran, un souffle. Plein cadre, jamais une liste. Le rythme est lent et tenu.
L'univers répond. Chaque choix modifie la couleur d'ambiance, le son, le mouvement. La réponse est ressentie.
Agency, pas verdict. On ne « te dit pas qui tu es ». Quand plusieurs aliens matchent, tu choisis visuellement : c'est le pilier P2 rendu tangible.
Progression métaphorique. Remplacer la barre anxiogène par une constellation qui se complète, ou un œuf qui mûrit.
Différer l'administratif. Date de naissance optionnelle, plus tard. Aucun compte, aucun mail avant l'éclosion.
Récompense d'abord. On donne l'alien avant de demander quoi que ce soit. Le don crée le lien, pas l'inverse.
Rejouable, jamais figé. Le rite peut se revisiter comme un souvenir, sans réécraser brutalement le type (leçon de bug vue en prod).
Anonyme par défaut. Cohérent avec le lien faible : entrer dans le monde n'exige pas d'exister publiquement.


07 · L'arsenal open-source

De quoi reconstruire, par besoin réel

Ta stack est Flutter. La plupart des libs « à la mode » sont React : elles servent de référence visuelle ou pour un éventuel web, pas d'import direct. Ci-dessous, chaque ressource est étiquetée pour éviter le piège. Priorité au procédural, puisque tu recréeras les assets en HTML / Python.

Flutter · direct Web · réf visuelle Procédural · assets Son A11y Inspiration Méthode

Créatures vivantes & 3D · tuer les PNG de 4 Mo

Le levier n°1. Animer les aliens et générer la « matrice » sans images lourdes. Rive tourne nativement en Flutter : c'est ton pont pour des créatures qui bougent, éclosent, réagissent.

Rive

Animation vectorielle temps réel, state machines. Runtime Flutter officiel. L'outil pour faire vivre œufs et aliens (éclosion, fugue, humeurs) en Ko, pas en Mo.

Flutter · directProcédural
Spline

3D interactive dans le navigateur, export web/temps réel. Idéal pour reconstruire la « matrice de l'âme » en objet 3D lisible et vivant plutôt qu'un PNG noir.

Web · réfProcédural
three.js

Le standard WebGL. Nébuleuses, particules, verre, la matrice 3D. Base pour un site/film compagnon et pour prototyper les shaders.

Web · réfProcédural
The Book of Shaders

Apprendre les fragment shaders (bruit, iridescence, aura). Flutter lit des shaders .frag via Impeller : réutilisable directement dans l'app.

ProcéduralFlutter · direct
Shadertoy

Milliers de shaders open à disséquer : nébuleuses, plasma, verre. Banque d'effets pour le fond ambiant et les auras.

ProcéduralInspiration
flutter_animate

Micro-interactions et enchaînements d'animation en Flutter, syntaxe simple. Pour les transitions rituelles et les états vivants.

Flutter · direct

Génération d'assets · HTML & Python procédural

Ton plan : recréer les visuels en HTML/CSS/Canvas ou en Python. Pipeline conseillé : générer en procédural → exporter en Rive/Lottie/sprite/shader → intégrer en Flutter. Léger, net, animable, et cohérent.

p5.js

Croquis génératifs rapides (particules, champs de bruit, constellations). Parfait pour prototyper le fond ambiant et la métaphore de progression du rite.

ProcéduralWeb · réf
PixiJS

2D WebGL ultra-rapide : nuées de particules, auras, effets de verre pour un web compagnon ou l'export de séquences.

ProcéduralWeb · réf
Pillow + NumPy

Génération d'images par script Python (gradients, bruit, textures d'œufs, cartes d'aura) en batch reproductible. Le cœur de ton pipeline Python.

Procédural
Blender + bpy

Rendre les 8 œufs/aliens par script, en série, avec un look verre cohérent et des exports optimisés (sprites, tournettes) au lieu de 4 Mo par vue.

Procédural
react-three-fiber + drei

Si un site/film compagnon en web : three.js déclaratif, matériaux verre et transmission prêts à l'emploi pour l'univers.

Web · réfProcédural
Squoosh / AVIF-WebP

Quand une image reste indispensable : compresser en AVIF/WebP. Diviser par 10 le poids des rares assets rasterisés conservés.

Méthode

Mouvement & micro-interactions · vocabulaire à traduire en Flutter

Ces librairies React montrent le langage d'animation viser (reveal, magnétisme, halos). On les regarde, on reproduit l'intention en Flutter (flutter_animate / Rive).

Motion (motion.dev)

La référence d'animation web/JS. Courbes, gestes, layout animations. Le manuel mental des transitions du rite.

Web · réf
Motion Primitives

Composants animés prêts (texte qui apparaît, morphing, tilt). Banque d'idées pour les écrans-questions plein cadre.

Web · réf
React Bits

Effets « waouh » (aurora, particules, gradients animés) très proches de ton univers. À imiter pour le fond ambiant.

Web · réfInspiration
fancy

Composants expérimentaux et physiques : idéal pour la sensation « matière vivante » des aliens.

Web · réf
Aceternity UI

Aurora backgrounds, spotlight, verre. Exactement la grammaire glass-on-void, à traduire, pas copier.

Web · réfInspiration
Magic UI

Effets de particules, meteors, shimmer. Bibliothèque d'ambiances cosmiques à reproduire.

Web · réf

Système & composants · structure et accessibilité

Pour la grammaire (espacements, états, focus, tokens). En Flutter, viser les ports type shadcn ; en réf, la rigueur de Radix / React Aria pour l'accessibilité qui manque aujourd'hui.

forui

Composants Flutter minimalistes façon shadcn : base propre pour reconstruire le chrome (cartes, champs, sliders) avec cohérence.

Flutter · direct
shadcn_ui (Flutter)

Port Flutter du langage shadcn. Système de tokens et composants sobres, l'antidote aux « blobs ».

Flutter · direct
Radix Primitives

La référence de comportement accessible (focus, clavier, états). À imiter dans tes widgets custom.

Web · réfA11y
React Aria

Modèles d'accessibilité de référence (Adobe). Guide pour rendre l'app utilisable au clavier/lecteur d'écran.

A11yWeb · réf
Tweakcn

Éditeur visuel de thèmes/tokens. Pour figer ta palette 8-éléments en variables et l'exporter proprement.

Méthode
Fonttrio

Trouver le trio display / texte / mono cohérent (à self-host, jamais en CDN). Réduire tes 3 polices actuelles qui jurent à un système voulu.

Méthode

Son, musique & icônes · la couche sensorielle

Le son est central (cosmic radio, émotion→musique). Et un jeu d'icônes unique remplace les « boutons verre » hétérogènes.

ElevenLabs UI

Composants d'interface audio/musique (players, waveforms, voix). Réf directe pour le studio et la radio.

SonWeb · réf
Tone.js

Audio génératif/interactif dans le navigateur : prototyper des ambiances sonores réactives au rite avant portage.

SonProcédural
Freesound

Banque sonore Creative Commons : nappes, textures, drones pour le seuil et l'éclosion.

Son
just_audio

Lecture audio robuste en Flutter (gapless, streaming). Socle propre pour cosmic radio et les 160 morceaux.

Flutter · directSon
Lucide

Jeu d'icônes au trait, cohérent et libre. Package Flutter dispo. Base d'un système d'icônes labellisées.

Flutter · direct
Phosphor

Alternative d'icônes flexible (poids variables) si un trait plus fin colle mieux au verre. Package Flutter dispo.

Flutter · direct

Inspiration & galeries · nourrir l'œil

Pour caler le niveau « cinéma » avec ton designer londonien. Mobbin surtout : patterns mobiles réels, ton terrain.

Mobbin

Bibliothèque de parcours mobiles réels. La meilleure source de patterns d'onboarding et de navigation.

Inspiration
Godly

Le haut du panier du web éditorial et sombre. Pour la barre esthétique et le site/film compagnon.

Inspiration
Codrops

Démos WebGL/transitions à la pointe. Mine d'idées pour l'ambiance et l'éclosion.

InspirationProcédural
Dark Mode Design

Galerie 100 % sombre. Utile puisque ton monde est mono-thème dark assumé.

Inspiration
GSAP Showcase

Références d'animation narrative et cinématique. Pour le seuil et les transitions rituelles.

Inspiration
The FWA

Expériences immersives primées. La bonne altitude pour un univers-film interactif.

Inspiration

Méthode & garde-fous · tenir la ligne

Pour cadrer le process design, et surtout ancrer techniquement le pilier anti-big-data.

DESIGN.md

Spécifier une direction design en un document vivant, versionnable. Le squelette de ce dossier, en continu.

Méthode
Frontend Design (skills)

Guides open sur les fondamentaux de design d'interface. Base commune avec ton designer.

Méthode
Local-first

Le pilier P2 rendu technique : la donnée d'âme vit d'abord côté utilisateur. Anti-big-data par l'architecture, pas seulement par le discours.

MéthodeFlutter · direct
awesome-design-skills

Collection de méthodes/prompts design. Piocher des cadres de critique pour itérer vite.

Méthode
awesome-ui-libraries

La liste source (celle de ta co-créatrice). Le catalogue complet dont ce dossier extrait l'utile pour Soul Matrix.

InspirationMéthode
UIVerse

Composants CSS libres (boutons, cartes, loaders) à décortiquer pour du chrome procédural léger.

ProcéduralWeb · réf

08 · Sans IA externe

Générer l'image et la musique sans dépendre d'un tiers

La règle est ciblée : la génération d'image (le « miroir ») et de musique ne passe par aucune IA externe, ni Midjourney, ni DALL·E, ni Suno. C'est le pilier anti-big-data rendu concret : la matière de l'âme ne part pas dans le cloud d'un tiers. Deux pistes, dans cet ordre.

Piste A : procédural (0 ML)

Aucun modèle. On génère par le code : shaders, bruit, systèmes de particules pour l'image ; théorie musicale, séquenceurs et soundfonts pour le son. Le plus léger, le plus sûr, le plus cohérent avec un monde fait main. À privilégier partout où c'est suffisant.

Piste B : souverain (modèle ouvert, ton GPU)

Si le génératif « riche » est vraiment voulu : des modèles ouverts que tu héberges sur ta propre machine. Souverain, hors-ligne possible, aucune donnée qui fuit. Ce n'est pas « sans IA » : c'est « sans IA externe ».

FonctionPiste A : procédural (0 ML)Piste B : souverain (auto-hébergé)
Image « miroir » Shaders GLSL + bruit + collage génératif à partir des propres médias de l'utilisateur ; filtres p5/WebGL. L'image devient une signature de tes choix, pas une image de stock. Stable Diffusion (SDXL/SD3, poids ouverts) via ComfyUI ou Fooocus, sur ton GPU. LoRA entraînée sur ton propre univers pour un style maison.
Musique Moteur émotion → musique déjà en place (32 combi × 160 pistes) + génératif algorithmique (Tone.js, Sonic Pi, Pure Data, soundfonts FluidSynth). Musique de règles, jamais de cloud. MusicGen / AudioCraft ou Stable Audio Open auto-hébergés. Rendu asynchrone côté serveur souverain, jamais une API tierce.
Voix (cosmic radio) eSpeak-NG (synthèse formant) pour une voix « machine » assumée, 100 % locale et minuscule. Piper (rapide, local) ou Coqui XTTS pour une voix neurale de qualité, exécutés sur ta machine.
Texte d'ouverture Banque de gabarits écrits à la main, tirage pondéré par l'élément/énergie. Cohérent avec « tu choisis qui tu es », pas un LLM qui parle à ta place. Petit LLM local (llama.cpp/Ollama) seulement si nécessaire, sinon s'en passer sert mieux la philosophie.

Recommandation : viser la piste A pour le lancement (léger, offline, zéro coût d'infra), garder la piste B en option pour les utilisateurs qui veulent du génératif riche, sur ton infra, jamais ailleurs.

La stack, couche par couche

L'analyse de ressources élargie, organisée par couche d'architecture, de l'app au GPU. Tout est open-source ; les libs React servent de référence, les équivalents Flutter sont marqués Flutter · direct.

1 · Socle app & rendu · garder Flutter, exploiter les shaders

Impeller lit des fragment shaders .frag : l'iridescence, l'aura et le fond nébuleux vivent dans le moteur de rendu, pas en PNG.

Flutter + Dart

Le socle actuel, à conserver. Un seul codebase mobile + web.

Flutter · direct
Fragment shaders

Shaders GLSL natifs dans Flutter : auras, verre, nébuleuse, sans image.

Flutter · directProcédural
Flame

Moteur 2D/particules Flutter : parfait pour les interactions vivantes des aliens (fugue, humeurs).

Flutter · directProcédural
flutter_animate

Micro-interactions et enchaînements d'animation, syntaxe concise.

Flutter · direct

2 · Système de design & tokens · tuer les « blobs »

Une grammaire unique glass-on-void, des tokens versionnés, un atelier de composants pour tenir la cohérence avec ton designer.

forui

Composants Flutter minimalistes façon shadcn : base propre du chrome.

Flutter · direct
shadcn_ui (Flutter)

Port Flutter du langage shadcn : tokens + composants sobres.

Flutter · direct
Widgetbook

Le « Storybook » de Flutter : catalogue vivant de composants, revue design partagée.

Flutter · directMéthode
Style Dictionary

Générer thème Dart, CSS, Figma depuis une seule source de tokens (tes 8 éléments).

Méthode
Lucide

Jeu d'icônes au trait, cohérent, libre. Package Flutter dispo.

Flutter · direct
Fontsource

Polices libres à self-host (jamais en CDN). Pour figer ton trio display/texte/mono.

Méthode

3 · Bestiaire vivant & 3D procédural · aliens qui bougent, 0 PNG lourd

Le levier n°1. Rive tourne nativement en Flutter : créatures animées, éclosion, fugue, en Ko.

Rive

Animation vectorielle + state machines, runtime Flutter officiel. Le pont pour des aliens vivants.

Flutter · directProcédural
Spline

3D interactive : reconstruire la « matrice de l'âme » lisible et vivante.

Web · réfProcédural
three.js

WebGL standard pour un site/film compagnon et le prototypage shaders.

Web · réfProcédural
The Book of Shaders

Apprendre l'iridescence/bruit en GLSL, réutilisable direct dans Flutter.

ProcéduralFlutter · direct

4 · Génération d'assets · HTML & Python, ton pipeline

Générer en procédural → exporter en Rive/sprite/shader → intégrer en Flutter. Reproductible, léger, cohérent.

Blender + bpy

Rendre les 8 œufs/aliens par script, en série, look verre cohérent, exports optimisés.

Procédural
Pillow + NumPy + noise

Textures d'œufs, cartes d'aura, gradients par script Python en batch.

Procédural
p5.js / Processing

Croquis génératifs (constellations, champs de bruit) pour fonds et progression du rite.

ProcéduralWeb · réf
ModernGL

GLSL en Python : rendre des séquences shaders en assets, hors ligne.

Procédural
Squoosh · AVIF/WebP

Quand une image raster reste nécessaire : diviser le poids par ~10.

Méthode

5 · Musique & audio sans IA externe · procédural d'abord

Le moteur émotion→musique existe déjà. On l'enrichit par du génératif algorithmique (piste A) ; la piste B reste sur ton GPU.

just_audio

Lecture robuste (gapless, streaming) en Flutter : socle cosmic radio + 160 pistes.

Flutter · directSon
Tone.js

Musique générative interactive (web) : prototyper des ambiances réactives au rite.

SonProcédural
Sonic Pi / SuperCollider

Composition algorithmique par le code : générer des variantes sans aucun ML.

SonProcédural
Pure Data / libpd

Moteur DSP embarquable dans l'app : synthèse générative embarquée, offline.

SonProcédural
MusicGen / AudioCraft

Piste B : génération musicale par modèle ouvert, auto-hébergé sur ton GPU.

SouverainSon
Piper / Coqui XTTS

Voix neurale locale pour la cosmic radio : rapide, souveraine, hors-ligne.

SouverainSon

6 · Génération d'image sans IA externe · procédural ou ton GPU

Le « miroir » sans API tierce. Piste A par défaut ; piste B si tu veux du photoréaliste, sur ta machine.

Shadertoy (GLSL)

Banque de shaders : générer l'image « miroir » comme une aura procédurale unique.

Procédural
ComfyUI

Pipeline Stable Diffusion en nœuds, auto-hébergé. Contrôle total, API locale.

Souverain
Fooocus

SDXL clé en main, simple à héberger. Bon point de départ souverain.

Souverain
InvokeAI

Studio SD complet auto-hébergé, gestion de modèles/LoRA pour un style maison.

Souverain

7 · Backend souverain · self-host, anti-big-data

Supabase est open-source et auto-hébergeable. Pour un indie local-first, PocketBase est un candidat sérieux (un seul binaire).

Supabase (self-host)

Garder l'existant mais l'héberger toi-même : Postgres + RLS + Auth + Storage.

BackendSouverain
PocketBase

Backend en un binaire Go (SQLite, auth, realtime, storage). Idéal local-first et niche.

BackendSouverain
Directus

Couche data/headless souple sur ta base, si besoin d'un back-office.

BackendSouverain
PostgREST

API REST auto-générée depuis Postgres (ce que Supabase utilise déjà).

Backend

8 · Local-first & souveraineté de la donnée · le pilier P2, technique

La donnée d'âme vit d'abord sur l'appareil. La sync devient un détail, pas le centre. Anti-bulle par l'architecture.

Drift

SQLite typé et réactif pour Flutter : la mémoire locale du soul matrix.

Flutter · directSouverain
Isar

Base NoSQL locale ultra-rapide pour Flutter, alternative à SQLite.

Flutter · directSouverain
ElectricSQL

Sync local-first sur Postgres, résolution de conflits. Offline-first natif.

Souverain
PowerSync

Sync SQLite ↔ Postgres avec SDK Flutter. Bon compromis pour garder Supabase.

Flutter · directSouverain
Automerge / Yjs

CRDT pour des données qui fusionnent sans serveur autoritaire. Souveraineté maximale.

Souverain
SQLCipher + libsodium

Chiffrement de la base locale et des secrets : la donnée d'âme reste privée, même sur l'appareil.

Souverain

9 · Auth, identité & anonymat · entrer sans exister publiquement

Cohérent avec le lien faible anonyme : l'identité forte est optionnelle. Passkeys pour éviter les mots de passe.

GoTrue (Supabase Auth)

Auth self-host déjà en place. Activer la vérification email, désactiver l'auto-confirm.

Souverain
Passkeys / WebAuthn

Connexion sans mot de passe (déjà amorcé dans l'app). À finaliser côté serveur.

Souverain
Ory Kratos

Système d'identité open, si tu quittes GoTrue pour plus de contrôle.

Souverain
Authentik / Zitadel

IdP auto-hébergés complets, alternatives souveraines à Auth0.

Souverain

10 · Stockage média & optimisation · S3 chez toi

Les médias (photos, audio, œufs) hébergés souverainement, servis légers.

MinIO

S3 compatible auto-hébergé : le stockage média sous ton contrôle.

Souverain
Garage

Stockage objet distribué léger, pensé auto-hébergement modeste.

Souverain
imgproxy

Redimensionnement/format à la volée (AVIF/WebP) : servir léger sans stocker 10 tailles.

Souverain
ThumbHash / BlurHash

Placeholders flous minuscules : chargement élégant sans écran vide.

Procédural

11 · Infra, déploiement & GPU · ton terrain

Remplacer Vercel par un PaaS auto-hébergé ; réserver le GPU aux pistes B (image/musique souveraines).

Coolify

PaaS auto-hébergé (le « Vercel/Heroku chez toi ») : déployer app web, back, services.

Souverain
Caddy / Traefik

Reverse-proxy avec TLS automatique pour tes services souverains.

Souverain
OpenTofu + Ansible

Infra-as-code souveraine (fork Terraform), provisionnement reproductible.

Souverain
k3s / Docker Compose

Orchestration légère pour héberger back, GPU workers (ComfyUI, MusicGen).

Souverain

12 · Notifications, analytics privacy & i18n · cohérence anti-big-data

Mesurer sans pister, notifier sans Google/Apple qui lisent tout, parler la langue de l'utilisateur.

Aptabase

Analytics privacy-first avec SDK Flutter, auto-hébergeable. Mesurer sans profiler.

SouverainFlutter · direct
ntfy / UnifiedPush

Push souverain sans dépendre entièrement de FCM/APNs. Notifs d'ambiance discrètes.

Souverain
GlitchTip

Suivi d'erreurs compatible Sentry, auto-hébergé. Qualité sans télémétrie tierce.

Souverain
slang

i18n type-safe pour Flutter (l'app a déjà un champ langue). Weblate pour gérer les traductions.

Flutter · direct

13 · CI/CD, tests & qualité · tenir la barre dans le temps

Automatiser build/tests, verrouiller le rendu visuel (golden tests), tester les parcours réels.

Forgejo + Woodpecker CI

Git + CI auto-hébergés, souverains, pour builds et tests.

Souverain
Patrol / Maestro

Tests E2E des parcours (rite d'entrée, éclosion) sur device réel.

Flutter · direct
Alchemist (golden tests)

Verrouiller l'apparence des composants : plus de régression visuelle silencieuse.

Flutter · direct
Fastlane

Automatiser signature et publication stores (iOS/Android).

Méthode

09 · De A à Z

Roadmap de développement

Deux tracks de dev avancent en parallèle et se rejoignent à des jalons de convergence. Aucun déploiement ici : on développe en local, le packaging et l'envoi vers le serveur se font tout à la fin, hors roadmap. La contrainte « sans IA externe » (image & musique) est portée par le Track B.

Track A · Univers & Interface
A1

Design system « glass-on-void »

Tokens, composants verre, icônes uniques, typo self-host, shell de nav à 5 pôles. Un seul monde sombre.

→ J1 avec B1
A2

Fond ambiant & motion

Nébuleuse en shader partagée, micro-interactions, un seul grand moment : l'éclosion. Reduced-motion respecté.

A3

Bestiaire vivant

Pipeline procédural + Blender → Rive : 8 œufs/aliens animés (idle, humeurs, éclosion) en Ko, plus de PNG 4 Mo.

→ J2 avec B3
A4

Le rite d'entrée

Les 7 temps en cérémonie, une question par écran plein, univers réactif. Immersif, pas court.

A5

Écrans du noyau

UI des 5 pôles : Aujourd'hui, Dialogue, Studio, Alien, Toi.

→ J3 avec B4/B5
A6

La place ambiante

Résonance anonyme : fragments d'âme sans profils, sans likes, sans match.

→ J4 avec B2/B6
Track B · Noyau & Données
B1

Architecture & routing

Corriger la désynchro URL/vue, poser navigation, state management, structure, tests de base.

→ J1 avec A1
B2

Local-first & souveraineté

Base locale chiffrée, modèle de données de l'âme, sync secondaire. Pilier anti-big-data, technique.

B3

Logique du rituel

Questionnaire → résonance → choix actif de l'alien → type. Date optionnelle, anonyme par défaut.

→ J2 avec A3/A4
B4

Moteur émotion → musique

Check-in 5 axes → 32 combinaisons → lecture des 160 pistes. Cosmic radio.

→ J3 avec A5
B5

Génération sans IA externe

Miroir image (shaders/collage), musique générative (Tone.js/Pure Data), voix (eSpeak/Piper). Local d'abord ; modèle ouvert auto-hébergé en option.

Aucune API tierce : procédural par défaut, ton GPU sinon.
B6

Dialogue passé/futur & énergie

Messages passé/futur, énergie de l'alien qui évolue, texte d'ouverture par banque de gabarits.

→ J4 avec A6
JalonTrack ATrack BRésultat
J1A1 design systemB1 architectureUn écran vertical de bout en bout, dark et routé
J2A3 bestiaire + A4 riteB3 logique du riteLe rituel d'entrée jouable (adoption + éclosion)
J3A5 écrans + StudioB4 musique + B5 générationCréation multimodale fonctionnelle, sans IA externe
J4A6 place ambianteB2 data + B6 dialogueNoyau introspectif + social en lien faible anonyme

Détail séquencé · référence (mono-fil)

Phase 0 · Fondations

Décider la souveraineté et poser le socle

Verrouiller la stack (Flutter conservé), trancher self-host vs Supabase managé, initialiser le dépôt, la CI et l'atelier de composants. Écrire les tokens des 8 éléments comme source unique.

Livrable dépôt, pipeline CI, fichier de tokens, décision d'hébergement actée.
Phase 1 · Peau

Design system & shell « glass-on-void »

Un seul monde sombre. Composants verre, navigation à 5 pôles labellisée, jeu d'icônes unique, trio typographique self-host, fond nébuleux en shader partagé. On supprime les écrans blancs et le routing incohérent.

Livrable app cohérente en dark de bout en bout, nav claire, ambiance vivante.
Phase 2 · Bestiaire

Les aliens deviennent vivants

Pipeline Blender → export → Rive : les 8 œufs/aliens animés (idle, humeurs, éclosion) en Ko. On retire les PNG de 4 Mo. La « matrice de l'âme » repensée en objet lisible (Spline/shader).

Livrable bestiaire animé léger + états d'éclosion, poids d'assets divisé par ~20.
Phase 3 · Rituel

Le rite d'entrée comme cérémonie

Les 7 temps (seuil → éclosion → nom), une question par écran plein, univers réactif, progression métaphorique. Identité créée après le don. Aucune donnée administrative avant la récompense.

Livrable onboarding-cérémonie jouable, ~6 questions mises en scène, éclosion cinématique.
Phase 4 · Noyau

Le cœur introspectif, en local-first

Dialogue passé/futur, journal (private_entries), valeurs d'énergie de l'alien. La donnée d'âme vit d'abord sur l'appareil, chiffrée. La sync est secondaire : pilier anti-big-data rendu technique.

Livrable boucle passé/futur complète, journal local chiffré, énergie liée à l'alien.
Phase 5 · Musique

La couche sonore sans IA externe

Le moteur émotion→musique (32 combi / 160 pistes) raffiné, enrichi par du génératif algorithmique (piste A). Lecture audio robuste. La piste B (MusicGen) reste optionnelle, sur ton GPU.

Livrable check-in émotionnel → musique, variations génératives, cosmic radio.
Sans IA externe : règles + génératif algorithmique par défaut ; modèle ouvert auto-hébergé en option, jamais une API tierce.
Phase 6 · Miroir & voix

Image & voix sans IA externe

Le « miroir » génère une image comme aura procédurale (shaders + médias propres de l'utilisateur). Voix de la radio en synthèse locale. Option souveraine (SD auto-hébergé / Piper) pour aller plus loin.

Livrable miroir procédural + voix locale, zéro appel à une IA tierce.
Sans IA externe : procédural par défaut ; Stable Diffusion sur ton GPU si tu veux du riche, hors-ligne possible.
Phase 7 · La place

Le social, en lien faible anonyme

L'interaction mirror devient un espace de résonance ambiant : on croise des fragments d'âme sans profils, sans likes, sans match. Présence sans pression : le social introverti, pas un feed.

Livrable place ambiante anonyme, modération légère, aucun mécanisme d'engagement.
Phase 8 · Souveraineté

Auto-hébergement & GPU souverain

Backend self-host, sync local-first, stockage média chez toi, workers GPU pour les pistes B. Toute la donnée d'âme sous ton contrôle. C'est la promesse anti-big-data, tenue par l'infra.

Livrable stack souveraine déployée, sauvegardes, GPU dédié aux générations riches.
Phase 9 · Sortie

Qualité, accessibilité & univers

Golden tests, E2E des parcours, a11y, i18n, analytics privacy-first. Alignement avec le film et la marque : store, page d'univers, distribution. Le monde tient debout, prêt à accueillir.

Livrable v2 testée, accessible, mesurée sans pister, publiée et raccord au film.

Le geste central de la v2 tient en une phrase : remplacer le PNG par le procédural, le formulaire par la cérémonie, et l'IA externe par ton propre atelier. Cohérence sombre, navigation, tokens et souveraineté servent ces trois mouvements.