# Notre nouvelle marque : la Mosaïque

> Le produit s’appelle joli.studio, et son symbole est une grille de quatre carrés dont un seul est une braise. Voici comment il est construit, et ce qu’il a le droit de faire.

Publié le 2026-09-17

Le nom et le logo d’origine étaient provisoires, et on le savait ; le symbole, dessiné sur un carré en dégradé, ne tenait plus la route à seize pixels. On a tout repris : le nom, le symbole, les couleurs.

## Un nom qui tient dans une adresse

Le produit s’appelle **joli.studio**, comme son nom de domaine. Toujours en minuscules, sans espace, jamais traduit : dans une phrase, c’est du texte normal, « Ouvrir joli.studio », « Exporté par joli.studio le… ». Quand la place manque — un onglet de navigateur, une barre étroite — la marque courte prend le relais : « Calendrier · joli », « Calendar · joli ».

L’application vit sur `super.joli.studio`, le site que vous lisez sur l’apex.

## Quatre carrés, une braise

Le symbole est une grille de deux carrés sur deux. Trois modules sont en graphite. Le quatrième, en haut à droite, est devenu une braise : un cercle Feu, plein, sans dégradé.

Toute la géométrie tient en une mesure, le module **m** : gouttière de 0,1 m, rayon des modules de 0,3 m, braise d’un diamètre exactement égal à m, encombrement de 2,1 m. Ce carré de 2,1 m sert de boîte de référence pour les marges, l’alignement et la zone de protection — un module libre tout autour, où rien n’entre.

*La construction du symbole, et le logo sur ses trois surfaces : clair, sombre, Feu.*

Entre 16 et 31 pixels, le dessin change légèrement : gouttière à 0,21 m, rayon à 0,26 m, pour que les modules restent visiblement séparés à l’écran. Le composant choisit tout seul selon la taille demandée ; en dessous de 16 pixels, on n’affiche plus le symbole.

Le nom écrit suit la même discipline : « joli » en Bricolage Grotesque 700, « .studio » en 500 et en retrait, interlettrage de −2 %. Les fichiers SVG contiennent le nom vectorisé, à la taille optique 32 — ils ne dépendent d’aucune police installée.

## Trois couleurs, et pas de bleu

Le logo n’a que trois rôles de couleur, tenus par trois jetons du design system : l’encre des modules et de « joli », la braise, et le gris de « .studio ». Sur fond clair, l’encre est Graphite 950 et la braise Feu 600 ; sur fond sombre, Graphite 50 et Feu 500 ; sur un grand aplat de marque, les modules passent en encre et la braise en blanc.

> Le bleu est réservé à l’IA. La braise, elle, dit la marque.

C’est la règle la plus stricte de la charte, et elle vient du design system Braise : le Feu appartient aux actions et à la marque, la flamme bleue n’apparaît que là où l’IA travaille. Une braise bleue mélangerait les deux vocabulaires d’un coup.

## Ce que la braise a le droit de faire

Elle a le droit de tourner. Pendant un chargement de l’application, la braise fait le tour des modules dans le sens horaire : un pas toutes les 0,6 seconde, soit un tour complet en 2,4 secondes, chaque passage durant environ 170 millisecondes. Les cellules, elles, ne bougent pas. Le tour est calé sur l’horloge de la page : un chargeur qui en remplace un autre reprend au même point plutôt que de repartir en arrière.

Il y a aussi l’apparition, réservée aux entrées : les modules arrivent en cascade de 35 millisecondes, la braise surgit, puis le nom entre.

> **Le tour de la braise n’est pas un décor**
>
> Il est réservé aux chargements de l’application — écran de démarrage, lecture de la session, ouverture d’un projet. Une génération IA garde ses indicateurs bleus : si le logo tournait pendant qu’un modèle écrit, on ne saurait plus qui attend quoi.

Le reste est interdit, et la liste est courte : déplacer la braise, l’inverser avec un module, étirer ou faire pivoter le symbole, lui ajouter un dégradé, une ombre ou un relief, poser la version claire sur un fond sombre, recomposer le nom dans une autre police ou en majuscules.

---

Source : https://joli.studio/journal/notre-nouvelle-marque-la-mosaique/