Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Shapes | Creating and Organizing Objects
UI/UX with Figma
course content

Course Content

UI/UX with Figma

UI/UX with Figma

1. Figma Basic Tools
2. Creating and Organizing Objects
3. Creating Visuals
4. Prototyping
5. Submitting Work

book
Shapes

  • Use the rectangle, ellipse, polygon, line, or star tools;
  • Click and drag to draw a shape freely;
  • You can hold Shift while drawing shapes to constrain proportions (e.g., perfect square or circle);
  • You can also hold Alt/Option to draw the shape expanding from the center;
  • Use the chain icon in the Layout panel to constrain or unlink proportions while changing the dimensions;
  • Adjust opacity to change the transparency of the shape;
  • Modify corner radius for rounded edges, with separate values for individual corners if needed;
  • You can add a fill to shapes with solid colors, gradients, or adjust fill opacity;
  • You can also add strokes (borders) and customize:
    • Position (inside, center, or outside);
    • Weight (thickness);
    • Style (solid, dashed, dotted);
    • Dash and gap settings for custom patterns;
  • Lines have additional options for start and end points (e.g., arrows, circles);
  • You can add effects like drop shadows, inner shadows, blur, or background blur;
  • In order to edit a vector shape, double-click on shape to edit its vector points in isolation mode, or click on "Edit Object" icon on the top right corner of the design panel. You can use the bend tool to create curves if needed;
  • Exit editing mode by clicking an empty space or the X button.

If you want to know more about vector graphics and raster images, I recommend checking out Raster vs. Vector chapter in Adobe Illustrator Fundamentals course.

1. How can you ungroup objects in Figma? (Select two)
2. What happens if you lock a group in Figma?
How can you ungroup objects in Figma? (Select two)

How can you ungroup objects in Figma? (Select two)

Select a few correct answers

What happens if you lock a group in Figma?

What happens if you lock a group in Figma?

Select the correct answer

Everything was clear?

How can we improve it?

Thanks for your feedback!

Section 2. Chapter 3
We're sorry to hear that something went wrong. What happened?
some-alt