Figma - (FR) In the file: Design Systems: Adoption, Data et Communauté | Figma
The session revisits the importance of marketing strategies in the adoption of design systems, particularly for teams already familiar with the basics. It highlights the need for community engagement and the use of marketing techniques to promote internal design and tech work. The speakers, Alexia from Figma and David and Jean from NG, discuss their experiences with the NG design system, "Fluide," and the strategies they employed to enhance its adoption across the company. They emphasize the importance of creating a community around the design system, using tools like Microsoft Teams for communication, and implementing a structured approach to measure engagement and adoption through analytics and feedback loops. The session also covers the development of documentation and training materials to support users and the creation of a CRM system to track project usage and engagement levels. The speakers share insights on the challenges and successes of their journey, offering practical advice for others looking to implement or improve their design systems.
Key Points:
- Adoption of design systems requires effective marketing and community engagement strategies.
- Use tools like Microsoft Teams to centralize communication and foster community.
- Measure engagement through analytics and feedback to improve system adoption.
- Develop comprehensive documentation and training materials to support users.
- Implement a CRM system to track project usage and engagement levels.
Details:
1. 🔍 Introduction to Design Systems
1.1. Benefits and Metrics of Design Systems
1.2. Examples of Successful Design System Implementations
2. 🛠️ Marketing's Role in Adoption
- A live stream was conducted 4 weeks ago focusing on the introduction to the design system, highlighting the need for marketing in its adoption.
- Marketing is often overlooked in the context of design systems, yet it is crucial for impact and adoption.
- For a design system to be impactful, adopting marketing strategies is essential.
- Effective marketing can include creating awareness campaigns, engaging stakeholders through targeted communications, and demonstrating the value proposition of the design system.
- Case studies or examples of successful adoption through marketing efforts could further illustrate the importance of marketing strategies.
3. 📣 Engaging the Audience
- The session emphasizes demystifying marketing mechanics crucial for internal design and tech evangelization, aiming to enhance communication strategies within advanced project teams.
- Participants will gain insights into effective audience engagement techniques, such as incorporating interactive elements and tailored communication strategies to maintain interest and promote active participation.
- The session is designed for teams that have progressed beyond the beginner stage, focusing on refining their engagement methods to boost project success.
- Recorded session access ensures that all participants can revisit the material, allowing for continuous learning and application of strategies discussed.
- Practical examples and case studies are incorporated to illustrate successful engagement tactics, providing a clear roadmap for implementation in real-world scenarios.
4. 👤 Meet Alexia, Designer Advocate
4.1. Introduction to Alexia
4.2. Role and Engagement Strategies
5. 🎤 Meet the NG Design System Team
- The NG Design System team, consisting of David and Jean, has been developing a fluid design system for around two years, focusing on creating a comprehensive and adaptable framework.
- Jean brings a rare expertise to the team with several years of experience specifically in design systems, positioning the team strategically strong in this area.
- The team effectively uses targeted marketing techniques to actively engage and grow their design system community, ensuring ongoing user interaction and feedback.
- Jean's specific contributions include leading the design system's architectural decisions, which have streamlined integration processes for users.
- The team's marketing strategy includes regular community workshops and feedback sessions, which have improved user retention by 20%.
6. 🔄 Evolution of the NG Design System
6.1. Introduction and Historical Context
6.2. Community Engagement and Growth
6.3. Building and Sustaining a Community
6.4. Expanding Community and Enhancing Adoption
7. 📈 Community Building and Engagement
- Conducted an accessibility audit and remediation across all components, ensuring all design elements are accessible, including color contrast.
- Annotations in design are emphasized to clarify elements like buttons and links, improving communication between designers and developers.
- Utilizing emphasis to differentiate the importance of information when multiple buttons are present, avoiding equal weighting for all, enhances user interface clarity.
- Examples demonstrate how components interact within a page, assisting users in understanding their application better.
- Encouraged the use of examples to demonstrate component interactions and clarify component placement, like button validation positioning.
- Implemented a widget to track documentation visibility and engagement, enabling assessment of its utility and readership.
- Developed a comprehensive onboarding kit, including tutorials and videos, to streamline the onboarding process and reduce repetitive inquiries.
- Structured design tokens and nomenclature harmonizing Figma and code, aiding consistent design application.
- Created onboarding videos covering basics like joining Figma and using design tokens, promoting efficiency and reducing onboarding time.
8. 📊 Measuring Success and Adoption
- Measurement of impact is a core part of growth marketing and product management.
- Initially, tracking who uses the Fluid library was challenging due to its open access within NGJ and its publication on NPM without a comprehensive user list.
- Started with a simple Excel sheet to list known projects using Fluid, acknowledging manual tracking limitations.
- Realized that a declarative method for measuring design system adoption wasn't viable; no exact formula exists for automatic tracking of all Fluid users.
- Adopted a manual and iterative approach: manual audits and discussions to identify Fluid usage, evolving towards automation.
- Adoption can be measured by 'breadth' (number of projects using Fluid) and 'depth' (extent of use within each project).
- Data collection involved tools like Figma Analytics and a custom telemetry scraper for code, integrated into the Flux CRM system.
- Adopted a phased approach: initially manually identifying users, testing depth of use case-by-case, then automating data collection from Figma API and GitHub.
- Future plans include further automation of depth measurement within projects.
9. 🔍 Data Collection and Analysis
9.1. Telemetry and Data Collection
9.2. Customer Relationship Management and Project Tracking
9.3. Community Engagement and Component Tracking
9.4. Evaluation and Compliance
9.5. Conclusion and Strategic Focus
10. ⚙️ Managing Challenges and Improvements
10.1. Design vs. Tech Emphasis
10.2. New Features in Figma
10.3. Importance of User Feedback
10.4. Past Technology Decisions
10.5. Managing Component Debt and Versioning
10.6. Communicating Component Rollouts
11. 🎓 Lessons Learned and Future Directions
11.1. Use of Teams for Centralized Posting
11.2. Accessibility Integration and Training
11.3. Unified Design System Across B2C and B2B
11.4. Adoption Challenges and Figma for Documentation
11.5. Public Access and Benchmarking
12. 👋 Conclusion and Farewell
- Thank you to everyone who joined the live stream, acknowledging slight overrun of time.
- Express gratitude to Jean and David for their participation and insights.
- Emphasize the value of the discussed practices, which encapsulate 7 years of work, for implementation and design system evangelization.
- Encourage the audience to apply these insights to improve their own design systems.
- End with warm wishes for the rest of the day.