Dockly / Brand guide / V1.1

Dockly Brand Foundations

A reliable publishing operation, engineered for forward motion.

Purpose

Merkdoel

Dockly helpt uitgevers hun content- en advertentieprocessen te automatiseren, zodat teams sneller kunnen werken en content opnieuw kunnen gebruiken over meerdere kanalen.

Position

Positionering

Voor uitgevers is Dockly het merk dat contentbeheer, publicatie en advertentieprocessen samenbrengt in één SaaS-oplossing.

Direction

Missie en visie

Missie

Dockly is een SaaS-product voor contentbeheer, publicatie en advertentiebeheer. Het ondersteunt het maken en beheren van digitale en fysieke magazines, kranten en drukwerk, plus het offertestellen, factureren en uitrollen van advertenties over verschillende kanalen.

Visie

Dockly helpt uitgevers om hun processen te automatiseren en content sneller en consistenter te hergebruiken.

Doelgroepen

Primaire doelgroep

Uitgevers.

Merkwaarden

Merkpersoonlijkheid

Dockly is premium, stabiel en betrouwbaar, met innovatieve functionaliteiten die moderne uitgevers vooruit helpen.

Dockly Gearwork

Het tandwiel is een functioneel merksymbool voor processen die op elkaar aansluiten: content, planning, advertenties en publicatie bewegen als één betrouwbaar systeem. Gebruik een klein, hoekig tandwielmotief als herkenbaar detail naast informatie en acties; nooit als losse, speelse decoratie.

02 / Expression

Dockly Brand Expression

Verbale identiteit

Merkbelofte

Dockly levert één SaaS-oplossing voor contentbeheer, publicatie en advertentiebeheer over meerdere kanalen.

Tone of voice

De tone of voice is premium, stabiel en vooruitstrevend. Schrijf direct, menselijk en concreet: als een ervaren collega die de uitgeefoperatie begrijpt en de volgende stap helder maakt.

Schrijfregels

  • Schrijf direct, menselijk en concreet.
  • Vermijd jargon, loze superlatieven en onbewezen claims.
  • Focus op voordelen voor uitgevers en operationele duidelijkheid.
  • Houd zinnen compact en begrijpelijk.

In de praktijk

Maak complex werk overzichtelijk zonder het kleiner te maken. Benoem wat er gebeurt, voor wie en welk resultaat dat oplevert. Kies actieve werkwoorden zoals publiceren, plannen, hergebruiken en afstemmen.

Voorkeur: “Plan advertenties en publicaties vanuit één overzicht.”

Vermijd: “Ontgrendel ongekende synergie in uw publishing-ecosysteem.”

Visuele identiteit

Kleuren

RolKleurGebruik
Kernkleur#5BBF9BDominante merkdrager en primaire acties.
Donkere variant#5F9A7CDiepte, actieve staten en contrasterende vlakken.
Oppervlaktekleur#A4E0C1Rustige basis voor editorial layouts.
Accentkleur#F59E0BHighlights, CTA-accenten en informatieve nadruk.
Tekstkleur#000000Functionele, goed leesbare content.

Gebruik kleur doelgericht: groen organiseert en verbindt, oranje markeert een volgende stap. Laat grote oppervlakken ademen en reserveer accentkleur voor betekenisvolle momenten.

Typografie

Heading font: Manrope, sans-serif
Body font: Manrope, sans-serif

H1: 64px; H2: 40px; H3: 28px; H4: 22px; H5: 18px; H6: 16px

Subkop: 18px; Body: 16px; Quote: 20px; Caption: 12px

Typische hiërarchie: H1 is een grote editoriale kop met moderne sans-serif-uitstraling; H2 structureert secties; de subkop vat samen; bodycopy blijft compact en functioneel; quotes dragen de merkbelofte; captions geven stille context.

Logo's en assets

Logo primary

Gebruik het logo zonder tekst op een lichte achtergrond. Plaats deze variant altijd zichtbaar op de cover.

Asset inventory

6418cabc47f9444e8fa9d423f9ee9547_dockly-logo-no-text.png — zwart logo zonder tekst, bedoeld voor lichte achtergronden.

Toepassingsregels

  • Gebruik het logo op rustige, lichte oppervlakken en houd voldoende witruimte rondom het logo.
  • Gebruik de kleurcombinatie bewust en consistent.
  • Combineer verbindingen en node-achtige patronen met compacte, hoekige tandwielen die gekoppelde processen zichtbaar maken.
  • Gebruik tandwielen als secundair, functioneel motief: als framing, statusdetail of overgang tussen modules. Vermijd grote, speelse clipart of een druk herhaald patroon.

Visuele toon

Editorial precision

Dockly combineert de rust van een goed opgemaakte publicatie met de scherpte van een operationeel dashboard. Gebruik sterke uitlijning, informatieve labels, duidelijke contrasten en ritme in plaats van decoratie.

Connected gearwork

Gebruik lijnen, schakels, node-achtige patronen en een klein tandwiel als subtiele signatuur. Samen verbeelden ze de overdracht tussen content, teams, kanalen en advertentieprocessen. Teken tandwielen met weinig, stevige tanden en een open kern; laat ze alleen op betekenisvolle raakpunten aangrijpen.

03 / Applications

Dockly Applications

Web UI foundations

Radius

Gebruik standaard 2px. Houd compacte UI-elementen subtiel en technisch; vermijd afgeronde, zachte vormen.

Borders

Gebruik dunne 1px-borders voor cards, formulieren, tabellen en statuscomponenten.

Schaduw

Gebruik alleen subtiele, functionele schaduw voor interactie, layering of zwevende panelen.

Spacing

Werk met een compacte, ritmische schaal: ruimte tussen secties, zonder overdreven luchtigheid.

Bootstrap-grid

Gebruik een mobile-first 12-koloms grid dat gecontroleerd opschaalt naar tablet en desktop.

Knoppen

Heldere hiërarchie, compact en actiegericht.

Formulieren

Labels zijn altijd zichtbaar; focus, validatie en fouten zijn helder.

Controleer de publicatiedatum.

Cards

In planning

Weekendbijlage

24 artikelen · 3 advertenties

Gearwork detail

Workflow gekoppeld

Gebruik een compact tandwiel als statusmarker voor automatisering, gekoppelde workflows of instellingen. Combineer altijd met een zichtbaar label.

Tabellen

PublicatieStatusVolgende actie
OchtendeditieGereedPubliceren
WeekendbijlageIn planningAdvertenties afstemmen

States

Maak hover, active, focus, disabled en error herkenbaar zonder visuele drukte.

Toegankelijkheid

Gebruik voldoende contrast, toetsenbordfocus, semantische structuur en heldere statusinformatie.

Animatie

Gebruik korte, subtiele beweging alleen voor feedback, overgang of statusverandering.

Application principles

Information first

Maak status van content, planning en advertenties in één oogopslag scanbaar. Kleur vult heldere labels, volgorde en structuur aan; het is nooit de enige drager van betekenis.

Operational confidence

Ontwerp interfaces die teams vooruit helpen: een zichtbare volgende actie, voorspelbare feedback en een rustige route terug naar overzicht.

04 / Operations

Dockly Brand Operations

Governance

Eigenaarschap en gebruik

Brand owner

Sjoerd Franssen, Eigenaar.

Versiehistorie

V1 aangemaakt via de brand wizard op 2026-07-27.

V1.1: Gearwork-motief toegevoegd op 2026-07-27.

Beheerafspraak

Deze vier Markdown-bestanden zijn de versieerbare bron van de brand guide. Werk inhoudelijke wijzigingen eerst hier bij en genereer daarna de HTML en CSS opnieuw.

Motiefbeheer

Gebruik voor nieuwe tandwielillustraties uitsluitend de vastgelegde geometrische lijnstijl en merkpalet. Controleer bij publicatie dat een tandwiel betekenis draagt, voldoende contrast heeft en nooit als navigatie-element wordt ingezet.

Component showcase

Buttons and status

  1. Publicaties
  2. Juli
  3. Ochtendeditie
Gereed Controle nodig

Alerts

Informatie: Planning bijgewerkt.
Succes: Editie opgeslagen.
Waarschuwing: Advertentie wacht op akkoord.
Fout: Kies een publicatiedatum.

Formulier

✓ Geldige titel.

Vul een geldige datum in.

Modal

Loader and skeleton

Publicatie wordt geladen

Tabel

StatusVolgende actie
OchtendeditieActueelPubliceren
WeekendbijlageIn planningAfstemmen