Invision Freehand Shortcuts Cheatsheet

✋ What is it?

This is a solution found in the Freehand tool by Invision. When using Freehand, users can see a small keyboard icon in the right bottom corner. When clicking this icon a side menu with a list of keyboard shortcuts gets revealed.

🤲 How does this interaction or solution work?

Freehand is a tool by Invision that allows creative and product teams to collaborate in a real-time drawing canvas. As its name implies, this tools is free sketching, multi-user app with several features that enhance the collaborative experience of the participants.

To enhance the learnability of different functionality and the multiple existing features, Invision adds a hidden sidebar with a list of all the keyboard shortcuts that can be used to enable or activate these features.

The keyboard shortcut cheatsheet menu can be toggled on by clicking the keyboard icon on the right bottom corner of the tool canvas. The sidebar can then be toggled off by clicking on the close icon or by pressing the ESC button of the keyboard.

🙌 How does this interaction or solution work?

Learnability and Discoverability

The creative and product industries rely on several tools that allow professionals to perform their job and collaborate with other professionals.

Sometimes interacting with these tools can be a daunting and cognitive charged activity, that implies learning new commands and functions.

By adding an easily accessible keyboard cheatsheet, Invision achieves two important goals that can help with the adoption and retention of their tool.

On the one hand, the cheatsheet helps users to learn the tool shortcuts by providing a list of these on the screen where they are used.

On the other hand, the list of commands gives new users a clear understanding of the range of features available to them when using Freehand.