Figma’s animated onboarding flow

Figma is a flexible cloud-based tool that makes collaborative UI design easier to manage across different platforms. Teams can work on designs, provide real-time feedback, and share files within the tool.

The video below highlights how Figma sets new users up for success with a comprehensive product tour. In the first modal window, Figma encourages users to opt into the onboarding tour by offering a walk-through of the features that differentiate Figma from their competition. When users agree to take the product tour and click “next,” they’re given a sneak peek into all of the design tool’s features. Through stunning, on-brand tooltips, users learn how to import sketch files, utilize the various design elements, and invite team members to collaborate on a project.

‍Video walk-through of Figma’s new user onboarding flow
‍

What makes this really good UX:

• Figma’s functionality is extensive, and there are plenty of different features to learn in order to make the best use of the software. The good news is that Figma’s new user onboarding flow gives users step-by-step guidance on how to use the tool so that they can begin to take advantage of the platform’s benefits ASAP.
• Figma immediately differentiates itself from its competitors in its welcome modal window. By letting users know that there are some key differences between Figma and other tools, the platform encourages users to go through the onboarding sequence.
• Figma’s user onboarding flow caters to all types of learners. Almost every tooltip in the flow has clear, concise copy that explains a feature, as well as an animation illustrating that feature’s functionality.  
• The onboarding sequence covers a lot of information in a short time by keeping the copy in each tooltip brief. However, if users need a bit more context for more complicated features, Figma includes links to resources with more information.

‍