Brand Book | Collective Jiu-Jitsu

Sectie 01

Merkfundament

1.1 Merkidentiteit

Merknaam

Collective Jiu-Jitsu

"Collective" verwijst naar de gemeenschap: samen groeien, samen leren. Jiu-Jitsu verwijst naar de Braziliaanse Jiu-Jitsu (BJJ), de discipline waar alles om draait. De naam communiceert direct dat dit geen solo-reis is, maar een gedeeld pad.

Kernbelofte

Wij maken je een denker op de mat, niet alleen een uitvoerder.

Merkpersoonlijkheid

Archetype: De Expert met hart

Collective Jiu-Jitsu combineert de diepgang en autoriteit van De Expert met de warmte en toegankelijkheid van De Verzorger. De dojo weet waar ze het over hebben en delen die kennis zonder arrogantie, met oprechte aandacht voor elke beoefenaar.

5 karaktereigenschappen: Kennisgedreven, toegankelijk, respectvol, inspirerend, principe-gericht.

Missie

Iedereen leren begrijpen waarom technieken werken, zodat ze op de mat hun eigen oplossingen creëren.

Visie

De meest toegankelijke en kennisgedreven BJJ-school van de regio Nijkerk worden, met een eigen locatie als thuisbasis.

1.2 Positionering

Doelgroep

Nieuwsgierige mensen van 13 tot 50 jaar

Van de tiener die op zoek is naar een uitdaging, tot de volwassene die iets nieuws wil leren. Ze willen niet alleen bewegen, maar ook snappen wat ze doen. Ze waarderen een omgeving waar vragen stellen wordt aangemoedigd en iedereen welkom is.

Wat ons onderscheidt

Principes boven technieken: we leren je het waarom, niet alleen het hoe.

Redzaamheid op de mat: je wordt je eigen probleemoplosser.

Inclusieve cultuur: van 13 tot 50, van witte band tot gevorderd.

Wat wij NIET zijn

Geen tough-guy cultuur: geen agressie, geen ego, geen intimidatie.

Geen techniekverzamelaars: we draaien niet om hoeveel technieken je kent.

Geen elitaire club: we sluiten niemand uit.

Sectie 02

Kleurenpalet

#1C4356

Deep Teal | Primair

RGB: 28, 67, 86

Ankerkleur voor achtergronden, headings, navigatie en primaire UI. Straalt vertrouwen, diepgang en rust uit.

#EC6429

Burn Orange | Accent

RGB: 236, 100, 41

Energiekleur voor CTA's, highlights en actieve staten. Brengt warmte en dynamiek.

#F2EBDB

Warm Cream | Neutraal

RGB: 242, 235, 219

Warme achtergrondkleur voor secties en cards. Zachter dan wit, verwelkomend gevoel.

#F9F8F0

Off White | Neutraal

RGB: 249, 248, 240

Lichte paginakleur en ruimtevuller. Nét niet klinisch wit. Body-achtergrond.

Kleurverhouding

Deep Teal (primair): 35%. Navigatie, headings, hero-secties, donkere blokken.

Burn Orange (accent): 10%. CTA-knoppen, links, hover-staten, icoon-highlights.

Cream + Off White (neutraal): 55%. Achtergronden, witruimte, contentvlakken.

Sectie 03

Typografie

Display / Headline Font

Begrijp het principe

Barlow Condensed · Bold 700

Krachtig maar niet agressief. Gecondenseerde vorm geeft een atletische uitstraling. Altijd uppercase voor headings.

fonts.google.com/specimen/Barlow+Condensed

Body Font

Bij Collective Jiu-Jitsu leer je niet alleen hoe een techniek werkt, maar vooral waarom. Dat maakt je redzaam op de mat.

Barlow · Regular 400

Helder en leesbaar, met een lichte warmte. Zelfde familie als display voor visuele samenhang.

fonts.google.com/specimen/Barlow

Accent / UI Font

WO 20:15 - 21:30 | GI ALL LEVELS | OPEN MAT

Space Mono · Regular 400

Labels, roostertijden, badges, metadata en technische details.

fonts.google.com/specimen/Space+Mono

Typografische Schaal

Element	Grootte	Gewicht	Font
H1	clamp(2rem, 8vw, 3.5rem)	700	Barlow Cond.
H2	clamp(1.5rem, 5vw, 2.25rem)	700	Barlow Cond.
H3	clamp(1.15rem, 3.5vw, 1.5rem)	600	Barlow Cond.
Body	clamp(0.9rem, 2.5vw, 1rem)	400	Barlow
Small	0.8rem	400	Space Mono
Line-height	1.65 (body) / 1.1 (headings)

Sectie 04

Logo-richtlijnen

Logo-concept

Genestelde driehoeken: fundament, groei, gemeenschap

Drie concentrische driehoeken die van buiten naar binnen kleiner worden. De buitenste twee in Deep Teal, de binnenste in Burn Orange. De driehoek symboliseert fundament en stabiliteit, de genestelde opbouw vertegenwoordigt groei en gelaagdheid. Het oranje centrum is de kern: de individuele beoefenaar binnen het collectief.

Specificaties

Minimale breedte: 40px (icoon) / 120px (met woordmerk)

Vrije ruimte: Min. 1.5x de driehoek-hoogte rondom

Formaten: SVG (primair), PNG transparant (web), EPS (drukwerk)

Verboden gebruik

1. Nooit de verhoudingen veranderen (niet uitrekken of samendrukken)

2. Nooit in niet-merkkleuren gebruiken

3. Nooit op drukke achtergronden zonder contrast

4. Geen schaduw, gloed, 3D-effect of gradient toevoegen

5. Nooit roteren of delen afknippen

Sectie 05

Beeldtaal

Fotografie-stijl

Sfeer

Warm, authentiek en community-gedreven. Beelden als een eerlijke blik in de les, niet een geregisseerde fotoshoot.

Onderwerpen

Trainende paren, groepsfoto's na de les, close-ups van grips, de instructeur die uitlegt, lachende gezichten.

Lichtgeving

Natuurlijk en warm. Beschikbaar licht waar mogelijk. Mag contrastrijk zijn maar nooit hard of kil.

Kleurbewerking

Licht desatureerd met warme ondertoon. Schaduwen naar teal, highlights warm. Geen harde filters.

Verboden in beeldgebruik

Stockfoto's van vechtsport of fitness

Agressieve poses, gebalde vuisten, intimiderende blikken

Bloed, verwondingen of pijn als beeldmotief

Overmatig gefilterde of kunstmatig verzadigde beelden

Beelden zonder mensen (het gaat om de community)

AI-beeldgeneratie prompt

"Candid photography of Brazilian Jiu-Jitsu training in a warm, welcoming dojo environment. Natural warm lighting, slightly desaturated with teal shadows. People of mixed ages training together on mats, wearing gis. Focus on connection, technique details, and genuine smiles. Community atmosphere, no aggression, no staged action poses. Warm color temperature, soft contrast, documentary style. Shot on 35mm, f/2.8, golden hour ambient light."

Sectie 06

Vormgeving-principes

Border-radius

Klein: 4px

Net genoeg afronding om niet scherp te voelen, strak genoeg om serieus te blijven.

Grid

Modulair, 12-koloms

Strakke basis met ruimte voor asymmetrische composities.

Witruimte

Royaal

Laat het ontwerp ademen. Ruime marges geven een rustige, zelfverzekerde uitstraling.

Icoonstijl

Line icons, 2px stroke

Schone lijn-iconen in Deep Teal of Burn Orange. 24px standaard.

Animatie

Subtiel en functioneel

Scroll-reveal met fade-up (300ms ease). Hover-staten op knoppen (200ms).

Knoppen

Burn Orange / Deep Teal

Primaire CTA: Burn Orange, witte tekst, 4px radius. Secundair: Teal outline. Uppercase Barlow Condensed 600.

Sectie 07

Tone of Voice

7.1 Merkpersoonlijkheid in taal

Formeel

Informeel

Zakelijk

Persoonlijk

Serieus

Humor

Bescheiden

Zelfverzekerd

7.2 Schrijfregels

Altijd

Spreek de lezer aan met "je" en "jij""Je leert hier niet alleen technieken, maar ook waarom ze werken."

Leg uit in begrijpelijke taal"We oefenen controle vanuit je rug" i.p.v. "closed guard retention drills"

Sluit af met een uitnodiging"Kom gerust een proefles proberen. Osu!"

Gebruik "Osu" als respectvolle groet"Bedankt voor een goede training. Osu!"

Schrijf vanuit de community"Samen worden we beter" i.p.v. "Wij maken jou beter"

Nooit

Agressieve of intimiderende taalGeen "destroy", "smash", "killer instinct"

Scheldwoorden of grove taalAltijd respectvol, ook in informele posts

Neerbuigend over beginners of andere scholenGeen "de meeste scholen leren het fout"

Overdreven reclametaal of hypeGeen "de BESTE school", "NU of NOOIT"

Engels waar Nederlands kan"Trainen" i.p.v. "rolling session"

Zinsstructuur

Gemiddelde zinslengte: Kort tot middel (10-18 woorden).

Alinealengte: 40-80 woorden.

Opsommingen: Ja bij roosters en praktische info. In lopende tekst liever niet.

7.3 Woordenlijst

Merkwoorden (altijd gebruiken):

principes redzaam begrijpen samen welkom respect groeien community fundament Osu

Verboden woorden:

vernietigen killer smash destroy agressief vechten beuk domineren knokken de beste

7.4 Tone-voorbeelden

Website Headline

Begrijp het principe. Creëer je eigen techniek.

Social Media Post

Vanavond op de mat: waarom werkt een armbar eigenlijk? Niet welke armbar, maar waarom je elleboog die kant op niet wil. Woensdag 20:15, iedereen welkom. Osu! 🤙

E-mail Opening

Hey! Leuk dat je interesse hebt in Collective Jiu-Jitsu. Hieronder vind je alles wat je moet weten voor je eerste les.

Klantenservice

Goeie vraag! Je hoeft niks mee te nemen behalve sportkleding. We hebben gi's beschikbaar om te lenen. Tot op de mat!

CTA-knoptekst

Probeer een gratis les

Sectie 08

Toepassingen

8.1 Digitaal

Website

Hero-secties in Deep Teal met wit of crème tekst. Contentsecties afwisselend Off White en Warm Cream. CTA-knoppen in Burn Orange. Navigatie in Deep Teal met wit woordmerk.

Social Media

Instagram: 1080x1080 en 1080x1920. Quote-cards op Deep Teal met Barlow Condensed wit. Foto's met warme bewerking. Accent oranje voor swipe-indicators en CTA-overlays.

E-mail

Header: Deep Teal balk met wit logo. Body op Off White. Links en knoppen in Burn Orange. Max 1 CTA per mail, boven de vouw.

8.2 Print

Visitekaartje

Voorzijde: Deep Teal met wit icoon. Achterzijde: Off White met contactgegevens in Barlow. Accent lijn in Burn Orange bovenaan.

Flyers & Posters

Sterke foto als basis. Deep Teal overlay (70%) met headline in Barlow Condensed wit. Burn Orange CTA-blok onderaan.

Kleding & Merchandise

Gi-patches en rashguards: logo in wit of oranje op donkere stof. T-shirts: icoon klein op borst, volledige logo op achterkant.

Sectie 09

CSS Custom Properties

Kopieer onderstaande variabelen direct in je stylesheet.

/* COLLECTIVE JIU-JITSU | CSS VARIABLES */

:root {

  /* Kleuren */
  --color-primary: #1c4356;
  --color-primary-rgb: 28, 67, 86;
  --color-primary-light: #2b6a84;
  --color-accent: #ec6429;
  --color-accent-rgb: 236, 100, 41;
  --color-cream: #f2ebdb;
  --color-light: #f9f8f0;
  --color-black: #111111;
  --color-white: #ffffff;
  --color-grey: #6b7280;

  /* Typografie */
  --font-display: 'Barlow Condensed', sans-serif;
  --font-body: 'Barlow', sans-serif;
  --font-mono: 'Space Mono', monospace;

  /* Schaal */
  --h1: clamp(2rem, 8vw, 3.5rem);
  --h2: clamp(1.5rem, 5vw, 2.25rem);
  --h3: clamp(1.15rem, 3.5vw, 1.5rem);
  --body: clamp(0.9rem, 2.5vw, 1rem);
  --line-height: 1.65;

  /* Vormgeving */
  --radius: 4px;
  --transition: 200ms ease;
}