Kiln· Brand identity exploration · v1
Programming is a system you can touch.
Kiln teaches serious backend engineering by putting the machine in your hands. This page is the identity itself — every mark, colour, motion and rule below is live. Touch things. The kiln remembers.
IDLE — THE CHAMBER RESTS
Tap the mark to move it through focus, correct and mastery.
Fire below
The core idea
One sentence governs product, marketing, motion and voice
Knowledge is a material. Fire it — don't tell it.
A kiln does not decorate clay. It applies controlled heat until fragile material becomes permanent. Kiln treats understanding the same way: every lesson is a firing. The learner works the machine directly, feels resistance, gets it wrong in safe heat, and walks away with knowledge that keeps its shape under pressure. No videos of someone else throwing pots.
This one idea sets the temperature for everything: the mark is a chamber with a single aperture; amber is heat that must be earned; violet is the live element you may touch right now; motion is cause and effect, never ambience; the voice names mechanisms, never "simply".
- Rigorous but alive
- Print-shop discipline — hairlines, numbered chapters, tabular figures — animated only where cause meets effect.
- Serious but not corporate
- Warm bone paper and a serif with a hand in it. An instrument, not a slide deck.
- Playful but never childish
- Play lives in mechanics — predicting, tracing, firing — not in mascots or confetti.
- Technical but not terminal-themed
- Diagrams are physical objects: chambers, pipes, valves. Code appears only as evidence, never as decoration.
- Kiln, not flames
- Heat is a measurement system, not an illustration. Nothing is on fire. Everything is at a temperature.
The mark & wordmark
The Chamber is a kiln seen from above: a 45° diamond wall with exactly one opening — the spy-hole through which a firer watches transformation. It is the learner's relationship to the machine: you look inside, heat accumulates, and when the work holds, the hole glazes amber. One form carries idle, focus, correct and mastery without changing shape.
- Built on one square, rotated once. Every diagonal in the system is cut at 45°.
- The spy-hole radius is exactly 0.21 × width: large enough to read at 16 px favicon size.
- Stroke weight is uniform (0.08 W) — the same value as the wordmark's strokes and the hairline rules.
- At rest it is pure ink on bone. Amber enters only as earned heat inside the hole.
Why a chamber, not a letterA generic "K in a rounded square" says nothing. The Chamber encodes the product's promise: one controlled space, one opening, transformation you can watch.
Recognition testSilhouette alone — diamond + hole — survives at 16 px, in greyscale, and reversed on ink. Try the greyscale switch in the rail.
App icon logicFull-bleed ink tile, bone diamond, amber hole at current heat level. The icon itself becomes a live instrument.
Type & composition
Two voices, clearly cast. Fraunces speaks — warm, optical, human; it carries ideas and moments of understanding. Archivo works — a grotesk with tabular discipline for UI, labels and evidence. Composition follows print logic: numbered chapters, hairline rules instead of boxes, asymmetric margins, generous air.
opsz 144 · −1.5%
A queue is just a line that remembers who came first.
Lesson 12 — Read-through caching
Predict before you trace. The cache is cold, so someone has to walk to the database — watch which one does.
Fired · Heat 82% · Streak day 14
- Numbers are always tabular — heat, streaks and progress must never jitter.
- Chapter numerals may sit in amber-deep; amber never styles body text.
- Hairlines over cards. A box is a last resort, not a default container.
- One violet element per screen maximum — it marks the touchable thing.
Colour has jobs
Three colours, three contracts. The base world is monochrome — bone paper and warm ink — so colour can carry meaning instead of mood. Toggle Greyscale in the rail: if the identity holds without hue, hue was doing real work.
Ink #211B15
Structure and truth. All diagrams, type and rules are drawn in warm ink. Ink is what you can trust — and what you are allowed to break while learning.
never reserved — ink is free to everyone
Earned Amber #D98A2B
Heat that was earned. Fired tiles, mastered models, streaks, the glaze in the spy-hole. Amber is a receipt, not a decoration — you cannot see it unless you did the work.
never used for marketing surfaces, empty states or calls to action
Live Violet #5344E4
The signal. Exactly one violet element per screen: the thing that will respond if you touch it now — a live request, an input awaiting your answer, a focused control.
never two violet elements at once; never ambient or decorative
Motion is cause & effect
Nothing in Kiln moves for atmosphere. The mark runs a four-state machine — idle → focus → correct → mastery — that maps one-to-one onto learning: resting, attending, being right, owning it. The same machine drives the app icon, the lesson chamber, streaks and tiles. Try it:
Idle — the chamber breathes. It is waiting, patient, warm to the touch but unlit.
Rive-ready · 4 states · 5 inputs
| State | Entered by | Behaviour | Timing / ease |
|---|---|---|---|
| Idle | default · RESET | Ring breathes ±5%. Hole empty. Frame ink. | 3.8 s loop · ease-in-out |
| Focus | TOUCH_START on the live element | Ring contracts to 88%; violet signal lights at the hole; heat level holds. | 180 ms · cubic(.2,.8,.2,1) |
| Correct | ANSWER_OK | One ripple from the spy-hole; +25% heat rises like a liquid level. | ripple 650 ms out · heat 550 ms cubic(.3,.7,.2,1) |
| Mastery | MODEL_MASTERED | Stamp: frame glazes amber-deep, hole fills solid, mark settles from 113%. | 500 ms · cubic(.2,.9,.25,1.25) |
| Cooling | RESET from mastery | Heat drains downward — cause is cooling, never a fade. | 700 ms · cubic(.4,0,.6,1) |
Rules for everything that moves: durations under 650 ms; one easing family (cubic-bezier(.2–.3, .7–.9, .2–.3, 1)); nothing loops except the idle breath; and under reduced-motion every state change collapses to an instant swap — meaning survives, movement doesn't.
Character: none, on purpose
Kiln has no mascot — no owl, no blob, no robot, no flame with eyes. A mascot would stand between the learner and the machine, narrating what the learner should be experiencing first-hand. Kiln's emotional range belongs to the Chamber itself, which already behaves like a character: it waits, it attends, it celebrates quietly, and when you master something it glazes over — permanently.
If product ever needs a guiding voice, it is typeset, not embodied: short lines in Fraunces italic that name the mechanism, never praise the person. "The cache walked so you didn't have to." No face required.
The reward: Fired Tiles
When a difficult mental model becomes yours, Kiln doesn't give you points — it gives you matter. You earn a Fired Tile: a small ceramic square whose pattern is generated from the structure of the concept you mastered. A hash index tiles into a lattice; a handshake tiles into a rhythm of stripes. Tiles are permanent — they can be revisited, arranged on your wall, and shown, but never bought, skipped or gifted.
- SubstrateBone-paper ground (
--paper-2), hairline grid at 8 units. The tile is a page, shrunk. - PatternDeterministically generated from the concept's structure — same idea, same tile, forever.
- GlazeA single amber element, always the last thing placed. Earned heat, even at 120 px.
- Edge2-unit ink frame, mitred. No rounding: tiles are fired clay, not stickers.
- StampArrives at 150% scale, rotates −7°, settles. Matter lands; it never fades in.
Your wall
3 of 5 firedFired.
The concept cooled into matter. It has been placed on your wall — permanently.
Product proof: the identity under load
An identity that only works on a poster is decoration. Below are two live fragments of the actual product — a lesson question and a cache lab — built from nothing but this page's rules. Answer correctly and the kiln fires your next tile.
Lesson fragment · 01
Why does the cache lie?
A client reads the same key twice in quick succession and gets different values. What is the most honest name for what happened?
Lab fragment · 02
Warm the cache yourself
- RDYPick a request. Watch where the work actually goes.
Decision ledger
Every rule above was chosen against a real alternative. The ledger records the choices and their prices, so future decisions argue with history instead of taste.
- Mark
- The Chamber, not a mascot. A machine with a spy-hole can hold every emotion the product has. Price: it demands a motion system to stay alive — paid in Chapter 05.
- Palette
- Bone paper + warm ink + one amber. Violet is reserved for the single live element per view. Price: no gradients, no photographic colour. The system stays legible in newsprint.
- Type
- Fraunces speaks, Archivo works. Two voices, no third. Price: display headlines must be set short — Fraunces at length goes syrupy.
- Motion
- Heat is conserved. Nothing fades in or out; warmth rises, cools, drains. Under reduced motion everything collapses to an instant swap. Price: animators lose the easy trick of opacity.
- Reward
- Matter over points. Fired Tiles are permanent and structural, never purchasable. Price: every lesson needs a generative pattern designed for it — slow to make, impossible to fake.
- Voice
- Name the mechanism, never praise the person. “The cache walked so you didn't have to.” Price: no exclamation marks survive review. Fine.