Socratic Workshop
By Noa Katana, creative technologist in Munich.
Learn an idea by explaining it to your AI tutor. It works for any subject: math and machine learning, a new language, or an unfamiliar codebase.
The tutor asks one question at a time and gives a small hint when you get stuck. You work through the gap and explain it again. Bring your own book, course, paper, or codebase.
When a picture helps, ask for a compact interactive HTML visualization. Explore it, make a prediction, and explain what changed.
Directly inspired by Miles Cranmer's How to Avoid AI Brain Rot, especially 23:58–34:33. The visual approach uses my Workbench adapter, inspired by Anatomy.
Start a session
Install with the skills CLI, then choose your agent:
npx skills add smashburger-dev/socratic-workshop
Add -g to install for your user instead of one project.
| Agent | Start learning |
|---|
| Claude Code | /socratic-workshop Help me understand L2 regularization. Let me explain first. |
| Codex | $socratic-workshop Help me understand L2 regularization. Let me explain first. |
Claude Code uses /skill-name. Codex uses a $skill-name mention or its /skills picker. You can also ask your agent to use the skill in plain language.
The learning loop
Explain what you understand. Work through one question or requested hint. Revise your explanation, then apply the idea to a small new case. Finish when your own reasoning establishes the goal you chose.
An illustrative conversation about a Gaussian prior and L2 regularization, rendered for this demo. It is not a recording of a real learner.
Visual learning
Gradient descent
HTML file
Spanish word order
HTML file
Process bottlenecks
HTML file
How is it built? Exploded views
Ask how something is assembled, and the tutor can build an exploded view:
/socratic-workshop How is the new MacBook Pro built? Show me the parts, then let me explain why its screen can sense touch.
Scroll to descend from a bird's-eye view to eye level, drag to turn and tilt, and click a part to read its job and its real specifications. Up and Down walk the parts in assembly order. When you stop, the object keeps turning slowly from wherever you left it. Parts can separate vertically, horizontally, radially, or each in its own direction. Export saves the current view as a print-ready PNG or SVG with part labels.
MacBook Pro · Key switch (vertical) · Limo door · Flashlight · Studio Display XDR (horizontal)
These GIFs are rendered previews of the example models. The illustrative prompt above was written for this demo.
Download an HTML file and open it in a browser. Each is standalone, with light/dark themes and no build step. GitHub's file view shows the source.
The same visual templates are available to the skill. A hint view reveals only the current hint; a full explanation can support direct exploration. Desktop examples are composed for a single visible frame.
You can ask for a hint, a visualization, a direct explanation, or a pause at any point. Study material stays outside the tutoring chat. In a codebase, the tutor offers a worktree, a branch, or read-only study before creating learning files. It creates no automated tests for those artifacts.
Make it yours
Use this skill as a starting point. Adjust the visual style, change how hints work, or extend the learning loop to suit how you learn. Edit SKILL.md and the visual guidelines, or ask your agent to help.
Credits
- Miles Cranmer's talk, shared by MPhil in Data Intensive Science Cambridge, inspired the learning workflow.
- Anatomy inspired the visual approach and the exploded views, adapted from my Werkbankfiguren work in Argmin. The exploded views and their PNG/SVG export are inspired by Jakub Krehel's /teardown skill; the kit here is an independent implementation.
- The frosted-glass visual language comes from my chiasma design system, with material and legibility guidance from Apple's Human Interface Guidelines.
- Source notes separate the talk's ideas from this skill's additions.
License
MIT.
