- Kurstitel: Figma 101
- Kurs_Untertitel: This course is your perfect entry into Figma. In live, hands-on sessions, we'll teach you how to create things like logos and wireframe prototypes. Get the real-world knowledge that pre-recorded tutorials can't teach you. A certificate of attendance is included.
- Kurs Dauer: 9
- Anzahl_Module: 3
- Kurs_Schwierigkeitsgrad: Einsteigende
- Kurs_Preis: 249,- € incl. VAT
- Komplettkurs_Beschreibung:
Our comprehensive Figma 101 course is designed for anyone who wants to learn the fundamentals of Figma at a professional level. No prior experience with other design tools or Figma is required.
In small, live groups, our experienced teachers will guide you from creating your Figma account to building your first simple prototype. The Figma 101 course includes three, 3-hour modules, which you can book as a complete package or individually. You can find the dates listed below.
You'll learn how to create your own logos, avatars, wireframe prototypes, and more. We'll show you the essentials of Figma, including Figma Draw, Grids, simple Auto Layout, and Interactions. The content for each module can be found in this section.
All participants will receive a certificate of attendance after each completed module or upon finishing the full course. This live online course is hands-on and interactive.
After the course, you'll have full access to all learning materials and session recordings on our campus for an entire year! If you need more support, you can also book a discounted one-on-one mentoring session with your instructor at any time after the course.
- Kurs_Lernziele:
• Navigate and use the Figma interface confidently
• Create simple UI components and layouts
• Collaborate with others using Figma’s built-in tools
• Build your first interactive prototype - Kurs_Voraussetzungen:
This course is suitable for:
- Complete beginners with no prior design software experience,
- Career changers,
- students, or
- anyone interested in starting a UI/UX design career.
- Kurs_Lektionen:
1. Introduction to Figma & UI/UX Basics (Approx. 60 min)
• What is Figma?
• Getting to know the interface
• Understanding UI vs. UX
• Setting up your account
2. Working with Shapes and Text (Approx. 90 min)
• Creating and editing basic shapes
• Working with the Text Tool
• Selecting, scaling, and positioning objects
• Select, group, and ungroup elements
3. Colors, Gradients, and Effects (Approx. 75 min)
• Working with colors
• Creating and applying gradients
• Adding basic effects
4. Importing and Using Images (Approx. 45 min)
• Import images in Figma
• Crop and mask images
• Use images as fills5. Frames and Basic Layouts (Approx. 90 min)
• What are frames?
• Use preset frame sizes (Desktop, Mobile, Tablet)
• Use layout grids and columns
• Intro to Auto Layout (Basic)
6. Collaborating in Figma (Approx. 60 min)
• Share files and set permissions
• Leave and respond to comments
• Use version history to review and restore designs
7. Your First Prototype (Approx. 60 min)
• Link frames to create flows
• Add basic interactions
• Test your prototype in presentation modeTotal Course Length: About 9 hours
- Inhalt_Modul 1:
1. Introduction to Figma
- What is Figma?
- Setting up your Figma account
- Getting to know the Figma interface
2. Getting Started with Shapes, Colors, and Text- Creating and editing basic shapes
- Selecting, scaling, and positioning objects
- Grouping and ungrouping elements
- Working with colors:
- Color selection
- Color picker
- Creating and applying gradients
- Using the text tool
3. Figma DrawExercise:Create a simple logo using basic shapes, colors and/or text.4. Importing and Using Images:- Importing images into Figma
- Using images as fills
- Cropping and using images as mask
Exercise:Create an avatar using basic shapes, a background, and an image. - Inhalt_Modul 2:
5. Introduction to Frames & Simple Layouts
- What are Frames?
- Predefined Frame sizes (Desktop, Mobile, Tablet)
- Using simple layout grids and columns for reference
- Creating wireframe placeholders
- Auto Layout basics
Exercise:Create recurring elements like a button, header and footer using Auto Layout.Exercise:Create 3–4 wireframe screens and arrange placeholders using Auto Layout. Use the recurring elements you created earlier. - Inhalt_Modul 3:
6. Your First Hi-Fidelity Prototype
- Creating connections between frames (prototyping basics)
- Interactions
- Testing and sharing your prototype in presentation mode
- Figma Mirror app
- Useful plugins
Exercise:Combine the content from Module 1 and Module 2:Build on your wireframe prototype to create a hi-fi prototype using images, text, and color.Add connections and simple transitions between the frames of the prototype.Then, test and share the hi-fi prototype in presentation mode.
