Building an Interactive Infographic in Webflow: Seeking Insights

Quinn B. · 2025-09-29T21:37:03.164Z

Hi All.... I'm attempting to build an interactive infographic inside Webflow and I could use some insight on the most efficient way to do so. Below is a a loom that walks you through what I'm trying to achieve. • •

Building an Interactive Infographic in Webflow: Seeking Insights | Relume Community

Matt J.
·
·
Quinn B. Just an FYI, the read-only link is broken. Interesting concept - would love to take a peek at it.
Quinn B.
·
·
Matt J. Shoot... thanks for letting me know. Here you go https://preview.webflow.com/preview/fireside-design-v1?utm_medium=preview_link&utm_sou[…]1&preview=59f95b599860f78135d9c8eaa6fe2626&workflow=preview
Matt J.
·
·
Quinn B. is there any opportunity to come up with a different graphic for tablet down or does it have to stay as this triangle?
Matt J.
·
·
I can see that would break the visual concept/message though
Quinn B.
·
·
hmmm.... I'm open to it for sure. Just not sure what that would be off hand.
Matt J.
·
·
yeah probably wouldn't pull off the same message at all honestly
Matt J.
·
·
so the other idea is to have the info icon also part of the image, and then have "hotspots" that you move around to trigger the modal
Matt J.
·
·
this keeps the "visual" consistent, while giving you a little bit of flexibility as the graphic moves around
Matt J.
·
·
I would make the hotspot bigger as well
Matt J.
·
·
the only other solution I can think of and is likely the path that would result in the highest quality would be to use an animation library for the entire thing - so GSAP or Rive or Lottie - since we can control those things via webflow interactions, we can create this kind of interactive graphic in those formats but still make it interactive in Webflow.
Quinn B.
·
·
I thought about using those libraries but I've never used them before. Could be a good use case to learn I suppose.
Matt J.
·
·
so for example - the info icon would be inside of the artboard for the graphic and always stay in a single position right, and no matter what the graphic does, it also moves there but we're able to target a specific node (info icon) to trigger something (modal) regardless of where its at. I suppose as I'm writing this, the same could really be done potentially with javascript as well. Basically the problem you are running into right now is that you have the graphic and the trigger (info icon) as separate things, but they actually need to stay as one, and within one single document - but you need to be able to target the trigger in someway.
Quinn B.
·
·
That is correct.
Quinn B.
·
·
Since I'm still a novice to this stuff, I'm just looking for the path of least resistance.
Matt J.
·
·
I would try the hotspot idea then at least for proof of concept

33 comments