Interactive SVG Mockups with Inkscape & Javascript

Update: I have a much more efficient, awesome version of this almost ready to write up, thanks to the awesome help you gave me in the comments. Thanks so much! I’ll post it soon. Yes, it is clickable. Please click it! Can’t see the loveliness? Click here. The backstory So I’ve been working on non-Fedora projects for the past few weeks, and I just started digging back into the Anaconda mockups this morning. Coming back to UI design from a slight break seemed to magnify issues that I feel in 2011 there must exist a solution–like defining clickable areas within mockups and linking them together to make lightweight interactive prototypes. (Right? ….right?!) The Dark Side offers cookies After some failed attempts to embed JQuery into SVG (if you’ve achieved this or know it to be a nutty proposition, please school me!) I got really frustrated and signed up for a free-as-in-beer and proprietary site to see what was possible. I found a site that lets you upload flat PNG mockups and then drag out clickable areas. Per clickable area, you can define what mockup to load next via a dropdown of all uploaded mockups. It also lets you add people …

Interactive SVG Mockups with Inkscape & Javascript

Update: I have a much more efficient, awesome version of this almost ready to write up, thanks to the awesome help you gave me in the comments. Thanks so much! I’ll post it soon. Yes, it is clickable. Please click it! Can’t see the loveliness? Click here. The backstory So I’ve been working on non-Fedora projects for the past few weeks, and I just started digging back into the Anaconda mockups this morning. Coming back to UI design from a slight break seemed to magnify issues that I feel in 2011 there must exist a solution–like defining clickable areas within mockups and linking them together to make lightweight interactive prototypes. (Right? ….right?!) The Dark Side offers cookies After some failed attempts to embed JQuery into SVG (if you’ve achieved this or know it to be a nutty proposition, please school me!) I got really frustrated and signed up for a free-as-in-beer and proprietary site to see what was possible. I found a site that lets you upload flat PNG mockups and then drag out clickable areas. Per clickable area, you can define what mockup to load next via a dropdown of all uploaded mockups. It also lets you add people …