Advanced Figma Techniques
1 Introduction to Advanced Figma Techniques
1-1 Overview of Figma
1-2 Importance of Advanced Techniques
1-3 Course Objectives
2 Mastering Layers and Groups
2-1 Understanding Layers Panel
2-2 Creating and Managing Groups
2-3 Nesting Layers and Groups
2-4 Layer Styles and Effects
3 Advanced Vector Tools
3-1 Pen Tool Techniques
3-2 Bezier Curves and Paths
3-3 Boolean Operations
3-4 Combining and Subtracting Shapes
4 Prototyping and Interactions
4-1 Introduction to Prototyping
4-2 Creating Interactive Elements
4-3 Linking Frames and Pages
4-4 Advanced Animation Techniques
5 Advanced Typography
5-1 Custom Fonts and Text Styles
5-2 Paragraph and Character Styles
5-3 Text on a Path
5-4 Advanced Text Effects
6 Working with Components
6-1 Introduction to Components
6-2 Creating and Managing Components
6-3 Variants and Instances
6-4 Overriding Component Properties
7 Advanced Styling and Theming
7-1 Introduction to Styles
7-2 Creating and Applying Styles
7-3 Theming in Figma
7-4 Dynamic Styles and Variables
8 Collaboration and Version Control
8-1 Real-time Collaboration
8-2 Version History and Control
8-3 Comments and Feedback
8-4 Sharing and Exporting Files
9 Plugins and Integrations
9-1 Introduction to Figma Plugins
9-2 Popular Plugins for Advanced Techniques
9-3 Integrating with Third-Party Tools
9-4 Creating Custom Plugins
10 Advanced Exporting and Assets Management
10-1 Export Settings and Options
10-2 Batch Exporting
10-3 Managing Assets and Libraries
10-4 Automating Export Processes
11 Advanced Workspace and Customization
11-1 Customizing the Workspace
11-2 Keyboard Shortcuts and Productivity Tips
11-3 Creating Custom Templates
11-4 Optimizing Workflow
12 Final Project and Review
12-1 Project Guidelines and Requirements
12-2 Developing a Comprehensive Design
12-3 Peer Review and Feedback
12-4 Final Submission and Certification
Combining and Subtracting Shapes in Figma

Combining and Subtracting Shapes in Figma

Key Concepts

Combining Shapes

Combining shapes in Figma involves merging two or more shapes into a single shape. This is done using the "Union" operation, which creates a new shape that encompasses all the selected shapes. The resulting shape takes on the properties of the topmost layer, including its fill color, stroke, and effects.

For example, if you have a circle and a rectangle, you can combine them to create a new shape that has the properties of both. This is useful for creating complex icons or logos where simple shapes need to be merged to form a more intricate design.

Think of combining shapes as stacking layers of different colors. When you combine them, you get a new layer that shows all the colors from the original layers, creating a unique and complex design.

Subtracting Shapes

Subtracting shapes in Figma involves removing the overlapping area of one shape from another. This is done using the "Subtract" operation, which creates a new shape that is the result of subtracting the topmost shape from the bottom shape. The resulting shape retains the properties of the bottom shape.

For instance, if you have a rectangle and a circle, you can subtract the circle from the rectangle to create a new shape that has a circular cutout. This is useful for creating negative spaces or for designing elements like badges or logos with cutouts.

Imagine subtracting shapes as carving out a piece of a larger object. Just as you might carve a hole in a block of wood, you can carve out a shape from another shape in Figma to create a unique design.

Intersecting Shapes

Intersecting shapes in Figma involves creating a new shape that represents the overlapping area of two or more shapes. This is done using the "Intersect" operation, which creates a new shape that is the intersection of all selected shapes. The resulting shape takes on the properties of the topmost layer.

For example, if you have two overlapping circles, you can intersect them to create a new shape that is the area where both circles overlap. This is useful for creating complex patterns or for isolating specific areas of a design.

Think of intersecting shapes as finding the common ground between two objects. Just as two circles might overlap in the real world, you can find the overlapping area in Figma to create a new shape that represents their intersection.