Design reference 34 · Playful & material
Hand Drawn Desk
Show thought developing through explanation, annotation, and revision.
Download design ZIP · Open interactive specimen
Design specification
Philosophy and fit. Show thought developing through explanation, annotation, and revision. Fits tutorials, workshop materials, personal teaching sites, and approachable technical writing.
Visual grammar. Make numbered illustrated steps the main structure: a large diagram, a short explanation, and a practice prompt. Attach callouts to parts of the drawing rather than maintaining a prose annotation margin. Warm paper, graphite, blue ink, and a red correction accent support a readable sans body face. Handwriting appears only in short secondary notes; a compact step index supplies navigation.
Specimen and flow. *Explain It Slowly* teaches an original simple mechanism. Inspect a diagram, reveal labelled forces or moving parts, and predict the next step. Supporting views include the illustrated lesson index and answer feedback that connects the prediction to the diagram. The reader can toggle annotations without losing their position.
Responsive behaviour. Drawing callouts become a numbered explanation below each diagram. Diagrams include captions and text accounts; animation never replaces the written explanation of how a mechanism works.
Identity rules. Preserve explanatory annotation and visible thinking. Avoid fake handwritten paragraphs, random scribbles with no meaning, and confusing a teaching notebook with an archival card cabinet. Effort: medium.
Distinctive composition. Handwritten labels belong to the sketchbook, making its annotations distinct from the paper archive and playful geometric references.
Files for a coding model
Reference images
- Desktop — 1440 × 1000 viewport
- Phone — 390 × 844 viewport
- Supporting state — 1440 × 1000 viewport
- Full page — 1440 × 1000 viewport
Supporting routes
Reuse
Use and adapt the original code and specifications for personal or commercial work under MIT. Keep applicable font and photo notices. The ZIP includes the complete runnable reference and its local assets.