Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Project Setup | Figma Basic Tools
UI/UX with Figma
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
Project Setup

Double-click the project name at the top to rename it. Press Enter/Return to save changes.

  • Pages and Layers: located on the left, used to organize content (covered in detail later);
  • Design Panel: on the right, contains settings for design, prototyping, and animation workflows;
  • Toolbar: positioned below the canvas; tools will be discussed in the next chapter.

The desktop version includes a Drop-Down Menu (not present in the browser version). This drop-down menu is accessible via an arrow icon that includes:

  • New Window: open a separate Figma window;
  • New Tab: similar to the "Create New" button;
  • Open in Browser: view the project in a browser;
  • Open File from Clipboard: paste and open files directly;
  • Close/Reopen Tabs: manage Figma tabs and windows;
  • Plugins and Interface Scale: adjust scale (e.g., 110%) or manage plugins;
  • Preferences: Access settings, help guides, updates, and "About Figma.";

The Minimize UI Icon toggles visibility of left/right panels;

Search Icon: quickly find assets or components within a project.

To get into the presentation mode, use the Present icon to display frames in device mockups (e.g., iPhone, MacBook);

  • You have the option to change device or toggle the mockup frame on/off;
  • You can also enter full-screen mode via a button in the top-right corner;

The Share button allows you Share files with links, email invitations, or by copying developer/prototype links;

You can set permissions (view/edit), and have options to publish to the community or get embed code;

You can manage your files by searching and filtering them projects either by:

  • File type (design files, FigJam boards, slides);
  • Creator, organization, or folder;

Figma includes some display options like:

  • Grid/thumbnail view or list view;
  • Sorting by name, creation date (oldest/newest).
1. What additional feature does the desktop version of Figma offer compared to the browser version?
2. In Presentation Mode, what does the "Show Device Frame" option do?
What additional feature does the desktop version of Figma offer compared to the browser version?

What additional feature does the desktop version of Figma offer compared to the browser version?

Виберіть правильну відповідь

In Presentation Mode, what does the "Show Device Frame" option do?

In Presentation Mode, what does the "Show Device Frame" option do?

Виберіть правильну відповідь

Все було зрозуміло?

Як ми можемо покращити це?

Дякуємо за ваш відгук!

Секція 1. Розділ 3
We're sorry to hear that something went wrong. What happened?
some-alt