Case Study / Brand System
Gideon Dynamics
A complete brand and web system for a defense company that does not exist, built to answer a question every newly funded one asks: how do we look real before we are allowed to show anything?
CONCEPT BRAND // NOT A REAL COMPANY // DESIGN DEMONSTRATION
- 5 routes
- 16 design tokens
- 3 typefaces
- 17 motion keyframes
- 1,630 lines of CSS
- 101 KB globe, one file
- 0 page builders
- 0 monthly licenses
01 / The brief
A defense company has to look credible before it is allowed to look impressive.
A newly funded defense company has no product photography it can legally publish, no customer logos it is cleared to name, and no case studies that have survived review. It still has to convince a program office, a prime, and a recruit that it is real.
That constraint drove every decision below. Not taste, and not a moodboard. When you cannot show the work, the system itself has to carry the credibility.
02 / The palette
Field green, not corporate navy.
Sixteen tokens: fourteen colours in three ramps and a status triad, plus two type families. The surface ramp gives five separable depths without ever reaching pure black, so panels can stack without hard edges. The olive is the only chromatic colour in the entire system.
Surface ramp
Text ramp
Measured against --bg #0d1410 with the WCAG relative-luminance formula. --fg at 14.1:1 and --fg-2 at 8.5:1 both clear the 4.5:1 floor for body copy at normal size, comfortably. --fg-3 at 3.9:1 does not clear that floor. It is confined to labels, captions, and other non-essential text set well above normal reading size, where it stays inside WCAG's large-text and non-text thresholds.
Olive ramp
Status triad
Instrumentation colour, borrowed from systems that report state rather than from marketing. Amber warns, red is critical, green is nominal, and nothing else in the system competes with them.
03 / The type
Three faces, each with a job.
Barlow sets display. Inter Tight sets everything you read in sentences. JetBrains Mono carries anything that is data: coordinates, counts, statuses, timestamps, and every label that has to line up in a column.
One honest note. The CSS uses eighteen discrete fixed sizes and nine more fluid clamp() sizes, which is not a modular scale by either count, and this page will not pretend otherwise. What holds it together is role, not ratio: five jobs, each with a face, a weight and a tracking value that never change.
Display / Barlow 300
Sovereign capability, fielded fast.
Heading / Inter Tight 600
Mission systems that survive contact.
Body / Inter Tight 400
Founded by a U.S. military veteran alongside engineers from sovereign-defense programs, critical-infrastructure operators, and frontier-AI labs. We left to build the defensive capability the incumbent stack will not.
Label / JetBrains Mono 500
THEATER STATUS / NOMINAL
Data / JetBrains Mono 400
NODES 5 · FWD 5 · ALLIED GOV 2
04 / Motion
Motion that reports state.
Seventeen keyframe animations and three easing curves. Ten of the seventeen are not separate effects at all: they are one boot choreography for the operations globe, firing in sequence as it comes up. Scan, ripple, cursor, dots, corner pulse, then the reveal.
None of it is decoration. Each cue maps to a state the system is actually in: acquiring, scanning, detecting, committing. A defense buyer reads a spinning logo as a spinning logo. They read a scan line as something working.
Boot choreography · 10 keyframes
Easing curves · shared trigger
05 / The globe
The hero is the capability, not a stock photo.
Most defense sites open on a photograph: a handshake, a runway, a soldier at dusk. This one opens on a working instrument. Real WebGL, real Natural Earth country geometry, live rotation, and a legend that means something.
It is one self-contained file. 2,376 lines, 101 KB, two external dependencies. No framework, no build step, and nothing to renew.
Live · drag to rotate
06 / The pages
Five pages, and one device that carries all of them.
Home, Programs, Capabilities, Mission, Contact. Three invented products, AXEHEAD, CARTOGRAPHER and REDOUBT, each with a role rather than a spec sheet.
The device worth stealing is the live operations feed on the home page. It cycles synthetic events: a perimeter sweep completing, lateral movement quarantined, a countermeasure deployed in under a second. It makes an early-stage company look operational without inventing a single customer. That is the exact line a real defense startup has to walk, and it is the reason this page exists.
07 / The point
A brand is a system, not a logo.
What is shown above is not a look. It is sixteen tokens, five type roles, three easing curves and one instrument, assembled so that any page built later stays consistent without anyone policing it. That is the difference between a design and a design system: the system keeps being right after the designer leaves.
And it is a folder of files. No page builder, no template licence, no monthly seat, nothing that stops working when an invoice goes unpaid. You own the tokens, the components, and the file.