A rapid walkthrough of a choose-your-own visualization that updates its chart based on live user selections. Recorded during an AI Hackathon; shows UI flow,…
Notes & highlights
Published: · 1:32
A rapid walkthrough of a choose-your-own visualization that updates its chart based on live user selections.
Recorded during an AI Hackathon; shows UI flow, edge-case handling, and current hover-state bug.
This short demo presents an early-stage interactive visualization: users pick from a menu of options, the interface highlights valid clicks, and a new chart renders immediately. The goal is to validate the core UX before deeper analytics integration.
Key elements
Dynamic menu logic – Valid targets blink on mis-click to guide the user.
Realtime chart refresh – User choices trigger an updated view without page reload.
Error surfacing – Hover jitter illustrates a known grid-layout bug slated for patching.
Reset loop – A single click restarts the experience for additional test runs.
View the repo for source code, UI state machine, and issue tracker. Feedback and pull requests welcome.
#InteractiveVisualization #DataViz #AIHackathon #UXPrototype #DynamicCharts
📍 Chapters
0:00 Interface overview
0:04 Selecting options & chart update
0:14 Navigating back and forth
0:24 Highlighting mis-click guidance
0:43 Hover-state bug demonstration
1:08 Switching between “Popular” and “Traditional” views
1:24 Restart workflow & closing notes