Published: June 19, 2020
PatternLab Links are Waaaaaay Better than InVision Hotspots
URLs, the foundation of the web, vs image maps (which 1999 told to come in for their dinner a long time ago).
Here's something I love about PatternLab vs InVision - creating links that can be easily maintained, rather than hotspots on parts of an image that have to be moved/updated each time you upload a new version of your design.
At this URL if you click on the main menu links, you will be brought to a sample page showing what that content will look like in your CMS.
If you change a design in Sketch and upload it to InVision, you have to set up all your hotspots again and remember where they all link to. With PL, being just HTML/CSS/JS, we just need to keep the 'Main Navigation' pattern up-to-date like we would with a real CMS.
But ... but ... but you can create an InVision hotspot template to remember where to click (I don't even know if you can, I'm just guessing). Yes, but if you change a menu item from "About" to "About Us" all the hotspots beside that link will now be out of kilter.
Believe me, there is no better tool for designing on the web than HTML, CSS, and JS. And, at the end of the day, that's ultimately what you are going to deliver your designs in. So, create it early. With a tool like PatternLab or Fractl.
Saves time, saves energy, keeps things sane ... and clients get to have a more real feel for what we are going to deliver to them.