At InVision, I was the lead designer on a product called Freehand, helping to take it from a prototype to a full product integrated into the InVision suite of design tools.
Freehand is a collaborative whiteboarding canvas used for ideation and early-stage design. I joined the team when Freehand was an early prototype.
One of my early projects for Freehand was creating an onboarding experience, introducing users to basic sketching concepts in Freehand, and integrating Freehand into the InVision experience.
The main goal was to introduce new users to the new time-saving functionality of Freehand – features like automatic shape recognition and quick drawing of straight lines.
However, after monitoring retention data and listening to user interviews, it became clear that users often don’t fully grasp the value of Freehand the first time they interact with it, making them less likely to return in the future. We focused too much on “how” and not enough on “why”.
By crafting a cohesive story and telling it with clear imagery, we could explain Freehand’s value and why users should use it – focusing on the how after that.
During this project, I introduced short brainstorming workshops with the whole product team of Freehand – product manager, engineers, and support (eight people in total) – to get the entire team onboard, extract all possible ideas and get everyone pumped. By clearly stating the problem and time constraints, we could make the workshop happen in 30 minutes, including a discussion and summary. With positive reception, the brainstorming workshop became a team habit for later projects.
It is surprisingly complex to achieve a good writing and editing experience. We are used to it being omnipresent, but for Freehand, I had to recreate the text experience while adjusting it to work well for a specific context of sketching ideas and flows. I took advantage of prototyping with Framer JS to get close to the real interactive experience and to explore possible solutions, focusing on speed and simplicity.
To avoid always visible text panel properties, we introduced a context menu that is only visible on active elements and is out of your way most of the time.
From Freehand files that our users shared with us, it was apparent that drawing flows and connecting screens and various elements were very common use cases. That led us to explore making that simpler and more accessible, so our users don’t have to draw the connections by hand every time.
We focused on versatility so the connections could be used to create various flow charts, and diagrams used in early product ideation as well as screen workflows imported from InVision Studio.
Together with Karla Lifson (Product Manager) and Stephanie Volftsun (Engineering Manager), we created a long-term strategy for Freehand, to serve as a north star, guiding us for years to come.
Freehand became InVision’s flagship product starting in 2020, with much of this original strategy and roadmap still intact and executed after I left.
