Context
Markdown is simple once it clicks, but the first encounter can feel abstract. Standard tutorials present syntax as a reference table — headings, bold, lists — without showing why you’d use them or how they fit together. This concept explored a more playful path: teach syntax through a mystery-style narrative where each formatting rule unlocks progress in the story.
Contribution
I shaped the learning flow, interface direction, and content structure for an experience that treats documentation skills as something interactive rather than dry reference material.
What I designed:
- A narrative arc where each Markdown concept is a “clue” or “tool” the learner discovers
- Progressive disclosure: headings first (structure), then lists/emphasis (content), then links/images (connections)
- An interactive editor with live preview so each concept is immediately visible
- A feedback loop that rewards correct syntax use with story progression
What this demonstrates
- Ability to turn technical learning into approachable UX. The project challenged me to think like an educator and a designer simultaneously.
- Strong interest in developer education and documentation. I believe good documentation is a product feature, not an afterthought.
- Product thinking beyond CRUD screens. This isn’t a form or a dashboard — it’s narrative, motivation, and user progress design.
- Comfort prototyping concepts before committing to full builds. This was a design exploration that validated the learning approach before engineering investment.
Semantic Connections