Every abstraction has a shape.
Engineers work blind. You write code against a machine you can't see, and expertise is really just the quality of that invisible picture. Kiln draws the picture — then lets you move it with your thumb.
The mark is not a picture of a kiln
tap itThe K is a diagram from the product. Stem = the process. The upper arm ends in a solid node — fired material coming out. The lower arm ends in a hollow slot — raw material waiting to go in. Unfold it and you get the engine's transform family, the same layout that draws escape analysis and query planning inside real lessons.
Why this, and not "transformation"
The brief's premise — programming is a system you can touch — is right about the verb and silent about the noun. Touch what? Every learning product on earth claims transformation; almost none can say what shape the thing is. Kiln can, because the engine already compiles meaning into twelve named figure families. That vocabulary is the moat, so the brand adopts the product's illustration system instead of inventing a second one beside it.
What the idea governs
One form, from 16px up.
Drawn on a 100-unit grid at 45° only, with flat terminals. The asymmetry is deliberate and it is the whole idea: raw is open, fired is closed. There is no second file for small sizes — the same geometry survives because the hollow slot is the only fine detail and it sits at the widest part of the form.
Size ladder
16 · 24 · 32 · 48 · 96 pxTwo states, one form
raw · firedFiring closes the open terminal and lays an amber edge under it. The mark goes from asymmetric to symmetric — legible at a glance, with no new element introduced and no colour needed to tell the two apart.
Monochrome is the master
never load-bearingThe lockup's K is the mark itself at text weight, set against Gabarito 700 at −5% tracking. Logo and wordmark are one object at two scales, so they cannot drift apart.
Violet is now. Amber is kept.
The product already forbids coloured text — ink only, with state carried by tinted chips, 6px dots and a fill on the one element being taught. The brand adds a rule the product didn't have: the two hues are tenses. Violet marks what is live under your thumb this second. Amber only ever touches something you have already earned. Amber on an unearned object is a bug, not a style choice.
- the CTA you are about to press
- the one figure element being taught
- the segment you are currently inside
- a value caught mid-change
- the flat edge under a fired tile
- the glaze line on a mastered shape
- a module you have completed
- nothing else, ever
One violet element per view, maximum. If two things are live at once, the screen is lying to the learner about where their attention belongs.
Two faces. No third.
Gabarito carries voice; Spline Sans Mono carries evidence. The split is absolute — if it is a claim it is Gabarito, and if it is a measurement, an identifier or a line of code it is mono. Adding a display serif would be the fastest possible way to look like every other deck.
Hierarchy for technical learning
specimenTwo variables, one home. Change it through either name and both see it.
Nothing moves without a cause.
No idle loop, no ambient drift, no particles, no logo that breathes. A Rive state machine with five inputs, driven by real learner state — so the mark is structurally unable to celebrate something that didn't happen.
Play the states
artboard · markrest — perfectly still. The mark never animates to attract attention; that is what a banner does, not a tool.
Rive hand-off
state machine · inputsOne artboard serves the app icon, the course-home node and the reward tile as a nested artboard. If a surface needs its own new animation, the system has failed.
A material, not a creature.
The other three directions all answered "no character" — the safe answer, which quietly leaves onboarding, empty states and completion to generic UI. A mascot would patronise this audience. So Kiln's entire cast is one faceless object: the Blank, an unfired form that is the learner's understanding of the idea in front of them. Its whole emotional range is material state. No eyes, no voice, no opinions.
You earn the shape you learned from.
Not a badge, a gem, a streak or an invented trophy. When a mental model becomes yours, you keep the compressed glyph of the engine family that taught it — the same form you just spent twenty minutes manipulating, reduced to something you can read at a glance. Your profile is a shelf of diagrams you can now decode. That is capability made visible; a number never was.
The shelf
3 of 8 firedlayout
view
frames
dist.
plan
seq.
matrix
A fired tile takes an amber flat edge — the product's own keycap depth, now carrying meaning. Unfired tiles are hairline and hard to read, which is honest: you cannot yet read that diagram either.
One learning moment. One mastery moment.
The identity has to survive contact with a real screen at 390×844. Notice what the brand does not do on the left: no mark, no character, no amber. Inside a lesson the diagram is the truth, and violet marks only the element you are working on.
Lesson · one violet element, ink everywhere else
layout
Mastery · the only place amber is allowed