Max McKinney Logo

Figma Educational Design

Lead Educational Designer

Figma

Dec 2021 - Present

Brief

Figma's first educational designer. Lead the content research and design efforts for Figma's educational content (courses, videos, playground files) within the Product Education team. Worked closely with the product, marketing, community, and advocacy teams to create delightful and engaging educational content. Product Education provides users with valuable learning resources in the form of videos, playground files, interactive content, and documentation. These resources improve user retention and conversions, drive positive revenue, improves approachability for product experiences, and provides insights into design concepts. Further work included in-product education explorations, learning design system, and internal education across multiple teams.

Case Study

Figma's Product Education team provides users with valuable learning resources in the form of videos, playground files, interactive content, and documentation. These resources are viewed millions of times a month, and direct contribute back to Figma's ability to sign up new users and keep existing users.

Shown is the the Figma Product Education's community profile

Product Education across various platforms

As the first Education Designer at Figma, I helped define what the role should look like and how it could best serve the team and the company. Served as the subject matter expert for the team, supported by my product design and design leadership background, across all of our projects bringing real world context and use-cases that assist us in accurately reflecting the needs of Figma's users.

Shown are a few thumbnails from the Figma Product Education's YouTube channel

Popular videos from the Figma YouTube channel

Lead content use-case research and design efforts

Spearheaded research initiatives to identify how users interact with and benefit from educational materials. This research informed the development of tailored educational content that addresses specific user needs, learning styles, and engagement preferences within the context of design assets for Product Education's content.

A core principle of education design identified through this work was "Don't be distracting". This principle is about creating educational content that is engaging and informative without being overwhelming or distracting. This principle guided the development of educational content that is clear, concise, and easy to understand, while balancing the need for depth and detail.

Shown is the the Habitz design system, a design system created for the Introduction to Design Systems course

E-commerce example used for educating on Variables in Figma

Primary subject matter expert on Figma's 'Introduction to Design Systems' course

The world of design systems is vast and guidance is constantly shifting as new technologies and schools of thought emerge. It can be difficult to know where to begin, even for experienced designers. Figma, specifically the Product Education team, recognized this need and developed a course to help designers understand the basics of design systems and how to apply them in their work. As the subject matter expert for this course, I was responsible for developing the course design use cases and assets, provided guidance for conceptual topics, and directed the team on best practices. To make this course as accessible and relatable as possible, I also lead the development of a design system that was used throughout the course materials.

Shown is the the Habitz design system, a design system created for the Introduction to Design Systems course

Pieces of the Habitz design system, created for the Introduction to Design Systems course

The course was 4 written lessons (+ 7 videos, 1 Community file) and covers a swath of conceptual design system topics such as: What is a design system, why design systems are important, how to define a system, documentation, improvements, amplication, and more. Additionally provided guidance for using features in Figma to work effectively with design systems such as branching, component props, variables, and more. The course was a massive success, being viewed by hundreds of thousands of users and receiving overwhelmingly positive feedback from the community — additionally internally at Figma as it allowed for a more cohesive understanding of design systems across the company.

Internal education across multiple teams and departments

While external education was our team's focus, the Education Design role provided an opportunity to educate internally across multiple teams and departments. Primarily focused on the Support organization, I created a series known as "Extra Credit" that was a casual and fun way to learn about design concepts and how they relate to the features in Figma. It was well received by the Support team, helping to bridge the gap between Support and Figma's customers. With the success of Extra Credit, it grew to be a resource used by other organizations and spawned a company-wide course known as "Figma for Figmates" which was a comprehensive course on how to use Figma design, directly resulting in a more cohesive understanding of Figma's product across the company as noted by the post-course survey results.

Shown is myself (left) presenting during Config 2022

Myself (left) presenting during Config 2022

Plugins, educational explorations, and team tooling

Beyond direct educational content, I also worked on educational explorations within the product. This included the development of a plugin that allowed users to leave voice notes on their designs, which was a fun and engaging way to leave feedback and collaborate with others. This plugin was a cross-functional effort that involved working with the product, marketing, and community teams to enable the new microphone API and data storage. We demo'd this experience during Config 2022 and was highlighted during the main keynote.

Shown is the cover art for the Figma voice memo widget

Figma Voice Memo widget created by Max McKinney

Similiarly I created several internal tools to help the team work more efficiently and effectively, such as a tool that improved the writing experience for our content writers by supercharging the Zendesk content editor with new features and functionality.

Closing thoughts

Education design provides a unique opportunity to work across multiple teams and departments at Figma, learn and educate on design concepts, and build unique educational experiences that directly impact Figma's users. Results of this work are felt across the company and assist in the approachability of Figma's product experiences, drive positive revenue through improved user retention, all while providing free and valuable learning resources to the community.

hello@maxmckinney.com