Brandbook · Richting D

De Verfijnde Vakwinkel

Het visuele systeem achter de Huissteden-redesign: een vertrouwde, deskundige naaimachinespecialist met heldere informatie-architectuur. Wit als basis, navy als anker, brand-rood als accent en een fijn stiksel-motief dat het vakmanschap doortrekt.

Figtree Navy #1F3A5F Rood #AE1B21 Lichtblauw #EFF5FB
Positionering

Waar het systeem voor staat

Richting D is de toegankelijke basis: rustiger en breder bruikbaar dan de andere richtingen, gebouwd rond de machinezoeker (in 2 stappen het juiste onderdeel) en een nette productgrid. De toon is die van een ervaren vakwinkel in Barneveld, niet van een schreeuwerige webshop.

Vertrouwd

Echte mensen, echte showroom. Portretten en namen (Annemarie, naaispecialist) in plaats van stockmodellen. Officieel dealer van de topmerken.

Deskundig

De machinezoeker en heldere categorieën staan centraal. Het bezit helpt kiezen; het verkoopt niet door te duwen.

Verfijnd

Rustige witruimte, fijne hairlines, het stiksel-motief en de ruit-patch geven detail zonder drukte. Eén heldere kleur-hiërarchie.

Kleur

Palet & rollen

Wit draagt de pagina. Navy is de chrome- en ankerkleur (topbar, navigatie, footer, koop-CTA). Rood is het accent voor links en aandacht. Lichtblauw zijn de zachte sectie-tints. Elke kleur heeft één rol, dat houdt de hiërarchie leesbaar.

Kernkleuren

Paper
#FFFFFF
Pagina-basis, kaarten.
Ink / Navy
#1F3A5F
Chrome: topbar, nav, footer, badges, de enige solide koop-CTA.
Action / Rood
#AE1B21
Brand-accent: links, eyebrows, ruit-patch, NEW-badge.
Sand / Lichtblauw
#EFF5FB
Sectie-tint achter inhoud.

Ondersteunend

Ink deep
#162B47
Footer-diepte, navy-hover.
Ink text
#16263D
Koppen op licht.
Action dark
#8E161B
Rode hover-staat.
Sand 2
#EAEFF6
Tegels, fotowells, knop-hover.
Accent soft
#FCEDED
Rode-tint vullingen (avatars, chips).
Body
#545D70
Bodytekst, 6,6:1 op wit.
Muted
#6B7385
Bijschriften, doorgestreepte prijs.
Stock
#1E7A3D
Op voorraad-groen.

Lijnen & goud

Line
#D0D5DD
Hairlines.
Red line
#E7C2C4
Zacht rood stiksel (seam--red).
Star
#D2AA1C
Review-sterren op navy.
Star light
#996515
Sterren op wit/licht (4,5:1).
Typografie

Figtree, één familie

Eén lettertype voor display en body, vastgezet op klantverzoek. Koppen 600–700, body 400. Italic in rood voor nadruk in de hero. De eyebrow-labels staan in uppercase met ruime letterspatiëring.

H1 / Hero
clamp 26–33px · 700
Vind het juiste onderdeel voor uw Babylock
H2 / Sectie
28px · 700
Best verkochte machines
H3 / Kaart
18–21px · 600
Brother CS70S Naaimachine
Eyebrow
13px · 700 · .16em
Machines
Body
16px · 400 · 1.6
Het complete assortiment naaimachine-onderdelen en accessoires vindt u op voorraad.
Prijs
25px · 700
€ 189,00 € 219,00
Knoppen

Eén solide CTA-regel

Klantregel: de sales-CTA (koop, conversie) is de enige solide navy knop. Alle andere knoppen staan op wit met een navy-, rode- of lichtblauwe rand. Zo trekt de koopactie altijd het oog, en blijft de rest rustig. Pill-vorm (border-radius 999px), min-hoogte 48px.

In winkelwagen
Sales-CTA · navy solide
De enige gevulde knop. Koopactie / conversie (.btn-sale, .btn-cart).
Toon onderdelen
Primair · wit + navy rand
Machinezoeker-CTA. Hover: lichtblauwe vulling.
Aanmelden
Accent · wit + rode rand
Nieuwsbrief / kleuraccent. Hover: rode vulling.
Bekijk alles
Secundair · ghost
Navigatie binnen secties. Hover: lichtblauwe vulling.
Motieven

Het naai-detail

Een fijn stiksel-motief uit richting C trekt het vakmanschap door de pagina: de roterende rode ruit als label-accent, en onderbroken stiksel-lijnen als dividers (grijs of zacht rood).

Ruit-patch

Roterende rode ruit (9×9px, 45°). Markeert eyebrows en labels.

Stiksel-divider

Onderbroken lijn als sectiescheiding (.seam), in hairline-grijs.


Rood stiksel

Zachte rode variant (.seam--red) voor nadruk onder labels.


Labels & status

Badges

Korte status-labels met een vaste kleurrol: rood voor nieuw, groen voor voorraad, goud voor beoordelingen, navy voor chrome-context.

NEW ✓ Op voorraad Actie Officieel dealer ★★★★★ 9,5 · Feedback Company
Toon

Voice & tone

Nederlands, u-vorm, behulpzaam en concreet. De vakwinkel die meedenkt, geen marketingmachine.

Wel

  • “Vind binnen 2 stappen uw accessoire of onderdeel.”
  • “Weet u het type niet zeker? Bel (0342) 49 15 91, wij zoeken het samen uit.”
  • Concreet en geruststellend (voorraad, levertijd, dealer-status benoemen)
  • Komma, punt of haakjes voor adempauze in een zin

Niet

  • Geen em-dashes in microcopy (leest als AI, klantregel)
  • Geen schreeuwerige superlatieven of urgentie-druk
  • Geen jij-vorm of jargon zonder uitleg
  • En-dash (–) alleen in getalsranges, bv. 13–50 mm