Tools for makers today have the product occupy both a software and web version, and liked the idea of porting this guides interaction that's native to Illustrator into the web. I wanted it to feel as indistinguishable as possible, and that meant taking a microscope to every aspect of the design.
The dx/dy tooltip
The multiple custom cursors
The right click to delete a guide
The crosshair that sticks to rulers when hovering
The addition of both Mac and Windows shortcuts
The dotted vertical and horizontal lines that show cursor placement
The duplication of guides regardless of in what order Alt/Option was pressed
It currently lives as both an npm package and a Framer component with it's live preview here.
Obviously, great products deserve the same amount of attention to detail regardless of the medium.
Previous
Next