Forum Discussion
"Wait, SVGs are just code?"
Hi everyone,
I have to admit something embarrassing. I was today years old (well, 44 years old to be exact) when I properly realised that SVG files are just code. I always thought of them as "images" you have to save, host, and link to. But no, they're just text! 🤦♂️
That realisation sent me down a rabbit hole, and the result is this: a Visual Narrative Selection Tool that is completely self-contained. No external image files, no hosting headaches, just one single HTML file doing everything.
🔍 What it is: It’s a scenario-based training interaction where learners have to pick the right chart type (e.g., "Is a Pie Chart okay for time-series data?"). If they get it wrong, the feedback doesn't just say "Incorrect"—it actually shows them why using a custom SVG graph generated right there in the browser.
✨ Why I'm sharing it: This is a pure "Zero-Asset" experiment. Because the icons and graphs are all SVG code written directly into the HTML:
- It's impossible to break: You can't "lose" the image files because they live inside the code.
- It's lightweight: The whole thing is tiny.
- It's accessible: Fully navigable via keyboard (Tab/Enter).
- AI-enabled: with a strong enough visual cue, no other files are required
I've shared the source code below. It’s fully commented (with my contact info hidden in a professional comment block at the top)
Feel free to download, break it, and tell me what you think.
And please tell me I'm not the only one who didn't realise SVGs were this powerful?
RISE READY HERE
Related Content
- 5 months ago
- 7 months ago