Daman Al Bayanat · Website · Visual direction

Five ways to build the same board

Every direction below is cut from the same 55 pins you saved to the Daman board. They share a spine — dark, engineered, one violet accent — but each commits to a different illustration language, and that choice cascades into type, components and page layout. Pick one; the other four become the "don't" list.

55Pins reviewed

#1A09C6Brand indigo

#62627FBrand slate

14Domains to illustrate

EN · ARBilingual, RTL-ready

Direction 01SchematicThe engineering drawing Direction 02Obsidian HardwareThe appliance Direction 03Signal GlowThe product Direction 04Chapter & BlockThe dossier Direction 05Paper LabThe report

DIRECTION 01 / 05

Schematic

The website as an engineering drawing. Hairline grids, crosshairs, dashed construction lines and monospace annotations — the language of someone who has actually mapped the attack surface.

Illustration1px line art on a visible grid. Node graphs, radial hubs, measurement marks. No fills, no photos.

Feels likePalantir, Vercel docs, an ISO 27001 control map drawn by hand

Pins14 · 28 · 52 · 12 · 18 · 49 · 09 · 41

Reference pins

Four schematic cards with crosshair and grid drawings — **PIN 14**The core of it — crosshair, isometric grid, waveform. Each domain gets one of these.

Radial line clock diagram beside hero copy — **PIN 12**Hero: copy left, radial diagram right. Swap the clock for the 14-domain hub.

Grid of dark line-art hardware icons — **PIN 28**Icon set logic: same stroke, same cell, same light source.

DNA sample landing page with circular instrument graphic — **PIN 18**Instrument-dial motif for Delivery Platform / SOC.

Grid of small feature cards with thin line illustrations — **PIN 52**Feature-card density — 14 domains in one screen without noise.

UI widgets with thin connector lines on dark — **PIN 49**Connector lines between UI fragments — Delivery Platform architecture.

Radial dot network on white — **PIN 09**Same graph, inverted — the light-page variant for Industries.

QR system with dashed tracing lines — **PIN 41**Dashed trace lines for "how data flows into the SOC".

Illustration · Design system · Layouts

Illustration style

Every drawing is a figure: a grid, a stroke of one weight, a caption in mono. Domains become instruments (dial, waveform, cross-section). Photos are never used as illustration — only as evidence (SOC room, offices).

Stroke 1px at 1×, violet on dark, ink on paper
Dashed = planned / boundary, solid = live
Corner ticks and “FIG.” labels on every graphic
Motion: line-draw on scroll, 600ms, ease-out

Design system basics

#0A0B0FGround

#101218Surface

#262A38Grid / line

#7C6CFFAccent (violet)

#1A09C6Brand indigo

#E9EAF1Text

— Domain 02 · Blue team Defensive · SOC / MDR 24×7 SOC-as-a-Service with tiered analysts Use-case engineering, SIEM content and detection-as-code. Every red-team finding becomes a detection the blue team runs. 24×7SOC · MDR Archivo 500/600 · JetBrains Mono 400/500

NCA ECCSAMA CSF

GRC & ComplianceProvable compliance against NCA, SAMA, PCI and ISO.

Basic layouts

Visible 48px grid on dark sections. Hero = copy left, figure right. Services as a dense 4×4 figure-card grid. Domain pages get a sticky left index (like the profile's section nav).

Fit for Daman

Why it works

Reads as rigor — exactly what a SAMA / NCA buyer wants to feel
Cheapest illustration system to scale to 14 domains + 8 industries
Inverts cleanly to the profile's light pages
RTL-safe: lines have no direction

Risks

Can feel cold or “developer tool” if type isn't warm enough
Needs discipline — one sloppy stroke weight breaks the whole system
Less “premium” than 3D at first glance

Best used for

A site whose main audience is technical evaluators and compliance officers, and a team that will keep adding services. Long-lived and easy to hand over.

Scores

Trust9

Distinctive7

Premium7

Build effort4

Scales to 149.5

DIRECTION 02 / 05

Obsidian Hardware

Security as a physical appliance. Matte-black 3D objects — chips, modules, sealed boxes — lit by a single violet edge. The site feels like unboxing something expensive that protects you.

IllustrationRendered 3D objects (Blender / Spline), isometric or ¾ view, one rim light. Each domain = one object.

Feels likeApple silicon pages, Vauban, Agent Systems, the KTM pin

Pins02 · 16 · 17 · 19 · 36 · 43 · 50 · 01

Reference pins

Four dark cards with isometric 3D device renders — **PIN 02**The template: object top, short copy bottom, dark card.

Exploded isometric hardware module in orange and white — **PIN 17**Exploded-view hero. Swap orange → violet. Perfect for Delivery Platform.

Dark render of stacked black modules with copy — **PIN 16**Matte black + one glowing seam. This is the light rig.

Isometric stack of dark hexagonal layers with stat labels — **PIN 19**Layered stack with callouts — the 14 domains as layers of one system.

Isometric building blocks illustration on dark — **PIN 36**Isometric “building blocks” for the two engines (services / products).

Grid of dark 3D chart widgets — **PIN 43**3D data widgets — SLA dashboards, SOC metrics.

Vauban platform hero with row of line icons — **PIN 01**Hero rhythm: one line, product, icon strip.

Isometric server room banner with blue lighting — **PIN 50**Only for the scene, not the neon — an isometric SOC as a hero object.

Illustration · Design system · Layouts