talas-group/05_EXPERIENCE_UTILISATEUR/IDENTITE_VISUELLE.md
senke 66471934af Initial commit: Talas Group project management & documentation
Knowledge base of ~80+ markdown files across 14 domains (00-13),
Logseq graph, hardware design files (KiCAD), infrastructure configs,
and talas-wiki static site.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-04 20:10:41 +02:00

171 lines
6.2 KiB
Markdown

# Brief d'identite visuelle — Talas
> Derniere mise a jour : 27 mars 2026.
> Direction validee : **lavis japonais interactif** — voir [[DIRECTION_ARTISTIQUE_TALAS]].
---
## Direction artistique
### Le langage
L'interface de Talas/Veza est un **lavis japonais interactif** (sumi-e numerique).
L'ecran est du papier washi. Les elements sont des traces d'encre. Le cyan est
la seule touche de couleur — comme un pigment rare dans un lavis monochrome.
### Mots-cles de la marque
- Lavis, encre, eau, papier, geste
- Brut, artisanal, vivant, en mouvement
- Contraste, diffusion, couches, profondeur
- Independant, anti-corporate, singulier
- Durable, solide, silencieux
### Ce que Talas N'EST PAS
- Pas premium/luxe (pas de dore, pas de serif elegant)
- Pas cheap/discount (pas de rouge promo, pas de clipart)
- Pas corporate (pas de bleu LinkedIn, pas de stock photos)
- Pas "eco-friendly cute" (pas de vert pastel avec des feuilles)
- Pas industriel/steampunk (pas de cuivre, pas d'engrenages)
- Pas neon/cyberpunk (pas de noir + neon partout)
---
## Logo
### Direction : logotype + symbole separes
Le logo existe en deux formes independantes qui peuvent etre associees.
**Le logotype :**
- Le mot "TALAS" en Space Grotesk Bold (ou custom a terme)
- MAJUSCULES, letter-spacing large (~0.12em)
- Sobre, inscrit — comme grave dans la pierre ou frappe sur metal
- Fonctionne seul, sans le symbole
**Le symbole :**
- Un geste dessine a la main, calligraphique
- Evoque a la fois l'onde sonore et le trait de pinceau
- Irregulier volontairement (pas lisse par logiciel)
- Fonctionne en 16x16 (favicon) comme en grand
- Monochrome — pas de couleur dans le symbole
### Contraintes techniques
- Fonctionne en monochrome (gravure sur metal, serigraphie)
- Lisible en tres petit (favicon, marquage produit)
- Fonctionne sur fond sombre ET clair
- Reconnaissable sans le texte (symbole seul = suffisant)
### Versions necessaires
- [ ] Logotype seul (horizontal)
- [ ] Symbole seul (carre)
- [ ] Logotype + symbole (horizontal)
- [ ] Logotype + symbole (vertical — symbole au-dessus)
- [ ] Favicon (symbole simplifie, 16x16 et 32x32)
- [ ] Version monochrome noir
- [ ] Version monochrome blanc
- [ ] Version pour gravure/marquage metal
- [ ] Version pour broderie sur tissu
---
## Palette de couleurs
### Palette principale — le lavis
| Role | Couleur | Code |
|------|---------|------|
| **Papier (jour)** | Blanc casse washi | #F2EDE6 |
| **Papier (nuit)** | Noir encre | #0D0D0F |
| **Encre (jour)** | Noir sumi | #1A1A1E |
| **Encre (nuit)** | Blanc creme | #E8E3DB |
| **Encre diluee** | Gris chaud | #9A958D |
| **Cyan (accent)** | Bleu cyan | #0098B5 |
| **Cyan hover** | Cyan clair | #00B4D8 |
| **Cyan muted** | Cyan dilue | rgba(0, 152, 181, 0.15) |
| **Cyan profond (nuit)** | Teal sombre | #006B7F |
### Couleurs fonctionnelles (pastel diffuse)
| Role | Couleur | Code | Regles |
|------|---------|------|--------|
| Succes | Vert sauge dilue | rgba(90, 140, 100, 0.60) | Ligne fine, petit point |
| Erreur | Rouge brique dilue | rgba(180, 80, 70, 0.55) | Trait fin, bordure legere |
| Warning | Ambre dilue | rgba(190, 150, 60, 0.55) | Point discret |
| Info | Cyan | #0098B5 | = accent |
**Regles :** jamais en aplat, toujours dilue, jamais plus fort que le cyan.
---
## Typographie
### Choix valides
| Usage | Police | Poids |
|-------|--------|-------|
| Titres | Space Grotesk | Bold (700) |
| Corps | Inter | Regular (400), Semi-Bold (600) |
| Code/specs | JetBrains Mono | Regular (400) |
### Regles
- Titres en MAJUSCULES, letter-spacing 0.1-0.15em
- Corps en casse normale, interligne 1.6-1.8
- Le texte flotte dans le papier — padding genereux
- Texte secondaire en gris doux (#9A958D), pas en gris moyen
- Open-source uniquement, format woff2, font-display: swap
- Max 2 fichiers font charges au chargement initial
---
## Applications
### Packaging
- Boite : carton kraft non blanchi (= le "papier" du lavis)
- Impression : logo noir seul, comme un hanko (sceau japonais)
- Livret : papier recycle, schemas en style trait de pinceau
- Sticker : logo monochrome (encre sur papier ou transparent)
- Pochette tissu : noire avec logo brode en **cyan** (seule touche de couleur)
- Numero de serie : frappe a froid (pas imprime)
### Web (Veza)
- Le design system SUMI v3 implemente la direction lavis
- Fond = texture washi, elements = couches d'encre, accent = cyan
- Voir [[SUMI_V3_SPECIFICATION]] pour l'implementation technique
### Reseaux sociaux
- Avatar : symbole sur fond papier washi (ou fond noir encre)
- Banniere : photo d'atelier traitee en noir & blanc avec grain, style lavis
- Videos : sous-titres en Space Grotesk, fond = lavis diffus
- Le style visuel des posts evoque le lavis sans l'imiter lourdement
### Produit physique
- Marquage du symbole sur le corps du micro (gravure laser)
- Le mot TALAS grave en petit sous le symbole
- Finition mate du boitier (pas de brillant — coherent avec le papier)
---
## Prochaines etapes
1. [ ] **Dessiner le symbole** (croquis papier/tablette → vectorisation Inkscape)
2. [ ] **Tester le logotype** (Space Grotesk Bold en MAJUSCULES, espacement)
3. [ ] **Creer la texture washi** (photo d'un vrai papier, desature, 512x512)
4. [ ] **Tester la palette cyan** sur un mock de page produit
5. [ ] **Dessiner les 10 premieres icones** dans le style geste/pinceau
6. [ ] **Implementer SUMI v3** dans Veza (palette + grain + base)
7. [ ] **Creer les declinaisons logo** (toutes les versions listees ci-dessus)
---
## Voir aussi
- [[05_EXPERIENCE_UTILISATEUR/CHARTE_GRAPHIQUE_TALAS]] — Charte graphique complete (regles d'application)
- [[05_EXPERIENCE_UTILISATEUR/GUIDE_CREATION_LOGO]] — Guide pratique de creation du logo
- [[05_EXPERIENCE_UTILISATEUR/DIRECTION_ARTISTIQUE_TALAS]] — Direction artistique complete (le "pourquoi")
- [[05_EXPERIENCE_UTILISATEUR/SUMI_V3_SPECIFICATION]] — Design system SUMI v3 (le "comment")
- [[05_EXPERIENCE_UTILISATEUR/CONCEPTS_INNOVANTS_VEZA]] — Concepts innovants UX
- [[07_CONTENUS_MARKETING/STRATEGIE_CONTENU]] — Strategie de contenu (style RS)
- [[07_CONTENUS_MARKETING/Storytelling/MANIFESTE_TALAS]] — Manifeste Talas
- [[00_META/TALAS_IDENTITE_PROJET]] — Valeurs et identite du projet
- [[02_PRODUITS_PHYSIQUES/Microphone/FICHE_PRODUIT]] — Fiche produit micro (design physique)