Project Setup

Renaming projects

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

Key interface components

• Pages and layers: located on the left, these are used to organize content;

• Design panel: found on the right, this panel contains settings for design, prototyping, and animation workflows;

• Toolbar: Positioned below the canvas, this section includes tools that will be discussed in the next chapter.

Drop-down menu

Accessible via an arrow icon, this menu includes:

• New window: opens 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".

Minimize UI Icon

Toggles visibility of the left and right panels.

Search Icon

Quickly find assets or components within a project.

Presentation Mode

• Use the Present icon to display frames in device mockups (e.g., iPhone, MacBook);
• Change the device or toggle the mockup frame on/off;
• Enter full-screen mode via a button in the top-right corner.

Sharing Options

• Use the Share button to share files via links, email invitations, or by copying developer/prototype links;
• Set permissions (view/edit) and access options to publish to the community or get embed code.

File Management

Search and filter projects by:

• File Type: design files, FigJam boards, slides;
• Creator, organization, or folder.

Display Options

• Choose between grid/thumbnail view or list view;
• Sorting by name, creation date (oldest/newest).