Customer Service
      Back to home
      1. BS LLC Help Center
      2. Customer Service

      Getting Started with Figma: A Guide for Viewing UX and UI Documents

      Learn how to navigate, zoom, leave comments, and more in Figma to efficiently review UX and UI documents.

      Welcome to Figma! Figma is a powerful design tool that allows you to view, interact with, and leave feedback on UX and UI documents. Here’s a guide to help you get started with the basics of using Figma on both Mac and PC.

      1. Accessing the Figma File

      • Invitation Link: You will receive an invitation link to view the Figma file. Click on the link, and it will open in your web browser.
      • Account Setup: If you don’t have a Figma account, you’ll need to create one. It’s free and only takes a few minutes.

      2. Navigating the Figma Interface

      • Layers Panel: On the left, you will see the Layers panel, where you can view the structure of the design.
      • Canvas: The main area where the design is displayed.
      • Right Sidebar: Contains information about the selected element, including properties and styles.

      3. Zooming In and Out

      • Mac:
        • Zoom In: Press Cmd + +
        • Zoom Out: Press Cmd + -
        • Zoom to Fit: Press Shift + 1
      • PC:
        • Zoom In: Press Ctrl + +
        • Zoom Out: Press Ctrl + -
        • Zoom to Fit: Press Shift + 1
      • Mouse Wheel: You can also use the mouse wheel to zoom in and out by holding down the Alt (Windows) or Option (Mac) key while scrolling.

      4. Panning

      • Hand Tool: Press and hold the Spacebar, then click and drag to move around the canvas.
      • Trackpad: On a Mac, you can use a two-finger drag on the trackpad to pan around.

      5. Leaving Comments

      • Activate Comment Mode:
        • Click the Comment button (speech bubble icon) on the top-right toolbar, or press C on your keyboard.
      • Add a Comment:
        • Click anywhere on the design to place a comment. Type your feedback and press Enter.
      • Replying to Comments:
        • Click on an existing comment and type your reply in the text box that appears.

      6. Viewing and Resolving Comments

      • View Comments:
        • Comments are indicated by numbered markers on the canvas. Click on a marker to view the comment.
      • Resolve Comments:
        • If you have permission, you can resolve a comment by clicking on it and selecting the Resolve button.

      7. Basic Features for Reviewing Designs

      • Inspect Mode:
        • Click on the Inspect tab on the right sidebar to view detailed information about the selected elements, such as dimensions, colors, and fonts.
      • Presentation Mode:
        • Press Shift + P to enter Presentation mode, which displays the design in a clean, distraction-free view.
      • Prototyping:
        • If the design includes interactive prototypes, you can navigate through them by clicking on hotspots (indicated by blue areas) or using the navigation arrows.

      8. Keyboard Shortcuts

      • Zoom to Selection: Press Shift + 2
      • Reset Zoom: Press Shift + 0
      • Toggle UI: Press Cmd + . (Mac) or Ctrl + . (PC) to hide/show the Figma UI for a distraction-free view.

      Helpful Tips

      • Browser Compatibility: Figma works best on Chrome, Firefox, Safari, and Edge. Ensure your browser is up-to-date for the best experience.
      • Figma Desktop App: For a more integrated experience, consider downloading the Figma desktop app from Figma's website.

      We hope this guide helps you get started with Figma. If you have any questions or need further assistance, please feel free to contact us. Happy reviewing!