Design Comps Made Easy: Effective FIGMA Designs for Seamless Designer-Developer Collaboration

Join us for a half-day training session on "Design Comps Made Easy:  Effective FIGMA Designs for Seamless Designer-Developer Collaboration" at DrupalCamp Asheville. 

This training will show you how to build design compositions using FIGMA, a powerful design tool for creating wireframes, UI designs, and prototypes. We will dive into the FIGMA structural design process and provide hands-on experience in building design compositions structured for maximum usability by your developer team.

This training is ideal for designers, developers, and anyone who wants to streamline their design process and enhance collaboration between designers and developers. With this training, you will learn how to create efficient design comps with FIGMA that ensure smooth collaboration between designers and developers, ultimately leading to faster development times and better-quality products.

Attendees will leave with a good understanding of using FIGMA to create design compositions and effectively collaborate with developers, setting them up for success in delivering web applications as you designed and intended. Don't miss this opportunity to learn valuable skills and enhance your workflow at DrupalCamp Asheville!

Who is your ideal audience member, the person who would get the most out of your training?

• Designers looking to improve the usability of their FIGMA design comps to both clients and developer teams in a collaborative fashion
• Designers looking to create reusable components and component libraries
• Front End Developers, collaborating with designers / design teams, who are responsible for implementing FIGMA design comps as web applications
• Developers looking to create and leverage FIGMA reusable design component libraries in their work
• Technical team members looking to improve their design and prototyping skills using FIGMA

What do you expect people to be able to take away from your training?

• How to create and leverage reusable color tokens
• How to create and leverage reusable typography tokens
• How to leverage design tokens and assets to build meaningful style guides
• How to create and leverage developer friendly, responsive components with variants
• How to structure components for responsiveness
• How to build a reusable design system in FIGMA
• How to leverage the prototype feature to demonstrate UX in your design comps
• Links to useful resources to further your knowledge base about FIGMA
• Links to proprietary and open source FIGMA design component libraries

How much and what kind of technical knowledge do people need going in to your training?

General knowledge:

• General familiarity with FIGMA
• Basic understanding of web design
• General understanding of front end development

Prerequisites:

• Sign up for a FIGMA account (free community account is fine)
• Download the FIGMA Desktop application (download link available after signing up for an account, local Desktop application is useful for “offline” work)
• Download and install the Class materials in your Desktop FIGMA application