Ressources de marque

Les ressources de marque Kata.

L’identité, prête à l’emploi. Huit points, un cœur, sept couleurs de domaine, une typographie. Prenez le pack, ou les fichiers un à un ci-dessous.

La marque

Huit points, un cœur.

La santé n’est jamais une seule chose. L’entraînement, l’alimentation, l’eau, le sommeil, la récupération, la tête, les chiffres et le coach qui les lit. Chaque partie est réelle en soi. Aucune ne fonctionne seule.

La marque n’est donc pas une forme unique. Ce sont huit points, placés en relation les uns avec les autres, et le cœur est ce qu’ils forment ensemble. Les parties d’une personne, tenues dans un seul système.

Kata est le mot japonais pour une forme que l’on pratique jusqu’à ce qu’elle cesse d’être un effort et devienne soi. Beaucoup de répétitions, une seule forme. Les points sont ces répétitions : la journée que vous avez notée, la série que vous avez terminée, la nuit que vous avez dormie. Chacun est petit. Ensemble, ils sont la pratique, et la pratique devient la personne.

Le dégradé vivant

Une marque. Toutes les couleurs.

Ici, la couleur n’est pas un décor. Elle vous dit où vous êtes. Chaque domaine de Kata possède un dégradé, et la marque prend la couleur du domaine où vous vous trouvez.

Laissée seule, la marque parcourt tout le système : 36 secondes, une couleur qui passe dans la suivante, l’extrémité claire toujours en haut parce que la lumière vient d’en haut. Le bloc marque, le symbole et le bouton principal lisent la même horloge, donc l’identité n’est jamais déphasée avec elle-même.

Le bloc marque et le symbole, en direct sur le cycle de 36 secondes.

Ce que dit chaque couleur.

ActivitéVert

Le mouvement, les séances, ce que vous construisez. Le vert : la progression, séance après séance.

AxesBleu acier

Ce sur quoi vous travaillez, plus l’eau et les données. Net, mesuré, factuel.

SleepViolet

La nuit. Le repos a sa propre couleur.

NutritionMauve

Prune et baie. Ce qui nourrit le corps, compléments compris.

TodayAbricot

La journée devant vous. Le lever du jour, l’énergie et la première heure.

EspritAqua

Comment vous allez. Une eau fraîche, à l’écart du reste.

CoachMineral Black

C’est de là que parle le coach. De l’encre, jamais du décor.

Logo

Le bloc marque.

Le cœur en huit points et le logotype, verrouillés ensemble. Laissez une hauteur de cœur d’espace libre sur chaque côté. Ne le redessinez jamais, ne le recolorez jamais, ne l’étirez jamais.

PrimaireMarque en dégradé Kata sage, lettres Mineral Black. Par défaut, sur fonds clairs.
Sur fond sombreMarque en dégradé Kata sage, lettres blanches. Pour fonds sombres.
Monochrome blancUne seule couleur. Pour la photo et les fonds chargés.
Monochrome noirMineral Black partout. Pour l’impression et le gaufrage.

Symbole

Le cœur.

Huit points font un cœur. Il porte Kata à lui seul : icônes d’app, avatars, favicons, partout où le logotype ne tient pas. Les points sont pleins, jamais en contour.

Kata symbol, Primaire
PrimaireLe dégradé Kata sage, sur fond clair.
Kata symbol, Sur fond sombre
Sur fond sombreLe même dégradé porte un fond sombre.
Kata symbol, Monochrome blanc
Monochrome blancUne seule couleur, blanc.
Kata symbol, Monochrome noir
Monochrome noirMineral Black.

Logotype

Le nom.

Articulat CF, tracé en contours pour n’attendre aucun chargement de police. Utilisez-le là où le cœur se trouve déjà à côté.

Kata wordmark, Mineral Black
Mineral BlackPour fonds clairs.
Kata wordmark, Blanc
BlancPour fonds sombres.

Couleur

Le système de couleurs.

Deux dégradés de marque et six paires de domaine. Chaque domaine de l’app en possède une : vous savez toujours où vous êtes à la lumière qui vous entoure.

Les deux dégradés de marque.

Kata sage

Le dégradé de la marque. Il porte le symbole, les voiles et chaque surface de marque.

#96A48D · #DAE3CF
Mineral Black

L’encre, les surfaces sombres et les boutons primaires. La typo dérive du #2d3233, jamais du noir pur.

#000000 · #2D3233

Une règle vaut partout : l’extrémité forte est en bas, la claire est pleinement atteinte à 72 pour cent et tient jusqu’en haut. La lumière vient d’en haut. Les boutons la suivent aussi : la même paire, la même chute, un libellé blanc.

Les paires de domaine.

kataBrand

Le sage sur lequel repose tout le système.

#96A48D · #DAE3CFSVG
trainActivité

Le mouvement et la progression. Le vert, séance après séance.

#87A266 · #C5DBA5SVG
waterAxes

Ce sur quoi vous travaillez, plus l’hydratation et les données. Bleu acier, net et mesuré.

#4E6391 · #A1B1CESVG
sleepSleep

La nuit. Le violet possède le repos.

#9E79D3 · #BBA6DDSVG
fuelNutrition

Prune et baie. Ce qui nourrit le corps, compléments compris.

#9E6A7F · #CCAEBESVG
todayToday

La journée devant vous. L’abricot : le lever du jour, l’énergie et la première heure.

#E2845A · #F2DAC9SVG
mindEsprit

Aqua. Une eau fraîche, à l’écart du reste.

#4B8599 · #A3C5CESVG
coachCoach

Mineral Black. C’est de là que parle le coach.

#000000 · #2D3233SVG
alertAlert

Terre cuite. Réservé à ce qui supprime. Jamais décoratif.

#CD7966 · #F3D5C9SVG

Les boutons, la paire elle-même.

Brand#96A48D · #DAE3CF1.60
Activité#87A266 · #C5DBA51.79
Axes#4E6391 · #A1B1CE2.87
Sleep#9E79D3 · #BBA6DD2.50
Nutrition#9E6A7F · #CCAEBE2.52
Today#E2845A · #F2DAC91.65
Esprit#4B8599 · #A3C5CE2.31
Coach#000000 · #2D323315.87
Alert#CD7966 · #F3D5C91.76

La seule chose qu’un écran vous invite à presser. Un bouton plein porte sa paire de domaine elle-même : l’extrémité forte en pied, la claire pleinement atteinte à 72 pour cent, et le libellé est blanc, jamais noir. Le nombre à droite est le blanc contre le milieu de cette chute, là où un libellé se pose vraiment. Dit honnêtement : seul Mineral Black atteint 4.5, et c’est pourquoi le bouton par défaut est partout la paire noire. Une page qui possède une couleur porte sa propre paire et accepte un nombre plus doux.

Étiquettes et sélection, plus clair encore.

Brand#EEF2E9 · #626F594.70
Activité#E5EFD7 · #5B6E434.70
Axes#D5DCE9 · #4A5E8A4.68
Sleep#E0D7F0 · #743FC04.71
Nutrition#E8DBE2 · #8154664.62
Today#F9EEE7 · #B24C1F4.67
Esprit#D6E5E9 · #3B69784.67
Alert#FAECE7 · #A5503A4.78

Une étiquette de surtitre n’est pas un bouton, un sélecteur segmenté et une pastille de langue non plus. Tout ce qui indique un état prend un lavis clair de l’extrémité claire de sa famille et s’écrit dans l’encre de cette même famille. Le nombre à droite est cette encre sur ce lavis. Seul ce que vous pressez est saturé.

Les neutres.

PaperLe fond continu, unique.#FAFAF8
PanelLes surfaces surélevées.#FFFFFF
Panel 2Les aplats légers, un souffle de sage.#F2F4F0
HairlineLes filets.#E7EAE4
InkLe texte courant et les lettres.#2D3233
Ink dimLe texte secondaire.#5C6360
Ink faintLes libellés et le texte tertiaire.#8A918C
PositiveLes bonnes données. Les données négatives passent en terre cuite.#87A266

Typographie

Articulat CF.

Une seule famille, trois rôles. Rien d’autre.

Medium 500

ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz 0123456789

Racontez votre journée à Kata.

Les titres. Approche serrée : -0.032em en taille hero, jusqu’à -0.012em à 18px.

Regular 400

ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz 0123456789

Racontez votre journée à Kata.

Le texte courant et l’interface.

DemiBold 600

ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz 0123456789

Racontez votre journée à Kata.

Les accents, les chiffres et les libellés de boutons.

Usage

Comment l’utiliser.

La lumière vient d’en haut

L’extrémité claire d’un dégradé est en haut ou sur le côté. Les boutons la gardent : deux teintes à plat, tête plus claire, pied plus profond, et aucun reflet nulle part.

Mineral Black, pas noir

L’encre est le #2d3233. Le noir pur n’apparaît que dans la rampe des surfaces sombres.

La physique des boutons

Le primaire est une pastille Mineral Black à libellé blanc. Le secondaire est une pastille gris clair à libellé gris. Les deux en rayon pastille complet.

L’espace libre

Une hauteur de cœur autour du bloc marque. Le bloc marque ne descend jamais sous 88px à l’écran ni sous 22mm à l’impression.

À ne pas faire.

  • Écrire KATA. La marque, c’est Kata.
  • Recolorer le symbole, le passer en contour ou lui ajouter des effets.
  • Étirer, faire pivoter ou recadrer le bloc marque.
  • Inverser un dégradé pour mettre l’extrémité profonde en haut.
  • Composer les titres dans autre chose qu’Articulat CF Medium.
  • Utiliser la marque pour suggérer une recommandation ou un partenariat.

Prenez tout le kit.

Le pack contient chaque variante de logo, de symbole et de logotype en SVG et PNG, les neuf dégradés, une planche de couleurs et un readme.

Télécharger le pack complet