{ "schemaVersion": 2, "id": "34", "slug": "hand-drawn-desk", "name": "Hand Drawn Desk", "brand": "Explain It Slowly", "family": "Playful & material", "status": "ready", "thesis": "Show thought developing through explanation, annotation, and revision.", "suitableFor": [ "Education", "Reading" ], "character": "Expressive", "traits": { "composition": "Numbered illustrated steps with attached callouts and a practice question", "navigation": "Step index, diagram labels, and answer feedback", "typography": "Space Grotesk + DM Sans + Caveat", "density": "Medium", "imagery": "Original SVG diagrams and illustrations", "surface": "Cream notebook paper, handwritten annotations and mechanical diagrams", "motion": "Minimal" }, "effort": "Medium", "definingFeatures": [ "Diagram-led teaching", "Callouts attached to mechanics", "A prediction followed by explanation" ], "adaptableChoices": [ "Brand and content", "Accent colour with verified contrast", "Equivalent licensed typefaces" ], "entryRoute": "/preview/34-hand-drawn-desk/start", "states": [ { "key": "practice", "label": "Predict the movement", "route": "/preview/34-hand-drawn-desk/practice" }, { "key": "index", "label": "Lesson index", "route": "/preview/34-hand-drawn-desk/index" } ], "referenceImages": [ { "file": "/previews/34/desktop.jpg", "url": "https://drew-site-design-library.t3.tigrisfiles.io/references/34/ddc9f36dc5c5c6b6-desktop.jpg", "route": "/preview/34-hand-drawn-desk/start", "viewport": { "width": 1440, "height": 1000 }, "state": "start", "fixture": "deterministic-2026-11-v1", "sourceRevision": "sha256:a5dd3c2c51dda64772e9ecdde1560eec1a541284b0dd0059bff6624447f39903", "sha256": "ddc9f36dc5c5c6b6d2e742407ad5b6c8ebb73032c51e42136e7e125596371675", "fullPage": false }, { "file": "/previews/34/mobile.jpg", "url": "https://drew-site-design-library.t3.tigrisfiles.io/references/34/8005b9d1051a7161-mobile.jpg", "route": "/preview/34-hand-drawn-desk/start", "viewport": { "width": 390, "height": 844 }, "state": "start", "fixture": "deterministic-2026-11-v1", "sourceRevision": "sha256:a5dd3c2c51dda64772e9ecdde1560eec1a541284b0dd0059bff6624447f39903", "sha256": "8005b9d1051a71614aa903b388f5ae2c0463e4e2b447941c66b577b31e3a55fa", "fullPage": false }, { "file": "/previews/34/detail.jpg", "url": "https://drew-site-design-library.t3.tigrisfiles.io/references/34/a920173bb1db0e2e-detail.jpg", "route": "/preview/34-hand-drawn-desk/practice", "viewport": { "width": 1440, "height": 1000 }, "state": "practice", "fixture": "deterministic-2026-11-v1", "sourceRevision": "sha256:a5dd3c2c51dda64772e9ecdde1560eec1a541284b0dd0059bff6624447f39903", "sha256": "a920173bb1db0e2e1f1f10204421fdf3973de208227565b07eda897812cbb8ce", "fullPage": false }, { "file": "/previews/34/full-page.jpg", "url": "https://drew-site-design-library.t3.tigrisfiles.io/references/34/2b73a52d018ee6c9-full-page.jpg", "route": "/preview/34-hand-drawn-desk/start", "viewport": { "width": 1440, "height": 1000 }, "state": "start", "fixture": "deterministic-2026-11-v1", "sourceRevision": "sha256:a5dd3c2c51dda64772e9ecdde1560eec1a541284b0dd0059bff6624447f39903", "sha256": "2b73a52d018ee6c91c0246b39231c3fa459321191e5aeb03803e360ef12cf3bb", "fullPage": true } ], "sourcePath": "src/designs/34-hand-drawn-desk", "neighbours": [ "05", "35" ], "palette": { "page": "#f7f0de", "surface": "#ffffff", "ink": "#37414a", "accent": "#315b9a" }, "fonts": [ "Space Grotesk", "DM Sans", "Caveat" ], "brief": "**Philosophy and fit.** Show thought developing through explanation, annotation, and revision. Fits tutorials, workshop materials, personal teaching sites, and approachable technical writing.\n\n**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.\n\n**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.\n\n**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.\n\n**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.**\n\n**Distinctive composition.** Handwritten labels belong to the sketchbook, making its annotations distinct from the paper archive and playful geometric references.", "scope": "An expansive sample page with representative local interactions; no production business backend.", "discovery": { "industries": [ "Illustration", "Creative studio" ], "visitorGoals": [ "Explore a portfolio" ], "conversionActions": [ "Enquire about a project" ], "siteSize": "Portfolio & enquiry", "interactionTypes": [ "Sketchbook", "Project details" ], "keywords": [ "Education", "Reading", "Diagram-led teaching", "Callouts attached to mechanics", "A prediction followed by explanation" ] }, "patterns": [ "Diagram-led teaching", "Callouts attached to mechanics", "A prediction followed by explanation" ], "downloadUrl": "/downloads/34-hand-drawn-desk.zip" }