172 lines
6.2 KiB
Markdown
172 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)
|