Installation

Get UI Lab up and running by installing our Figma plugin. This plugin streamlines your design workflow and provides access to our comprehensive design system.

System Requirements

To ensure a smooth experience with the UI Lab Figma Plugin, please make sure you meet the following system requirements:

• Figma Desktop App or Web Version: The latest version of the Figma desktop application (macOS or Windows) or access to Figma via a modern web browser (Chrome, Firefox, Safari, Edge).
• Internet Connection: A stable internet connection is required for plugin installation, sign-in, and synchronization with your UI Lab account.
• UI Lab Account: You will need an active UI Lab account to sign in and utilize the plugin’s features.

Installing the Plugin

There are two primary ways to install the UI Lab Figma plugin:

Via Plugin Manager

This is the recommended and easiest method for installation.

1. Open Figma: Launch your Figma desktop application or open Figma in your web browser.
2. Navigate to the Community: In the left sidebar of Figma, click on the Community tab.
3. Search for UI Lab: In the search bar at the top of the Community page, type “UI Lab” and press Enter.
4. Select the Plugin: Locate the official UI Lab plugin in the search results. It will typically be listed under the “Plugins” category.
5. Install: Click on the Install button next to the UI Lab plugin. The plugin will be added to your Figma account instantly.

Manual Installation

In some cases, you might be prompted to install the plugin directly from a Figma file.

1. Open a UI Lab-enabled Figma file: If you receive a Figma file that utilizes UI Lab components or styles, open it.
2. Follow the prompt: Figma might display a notification or dialog box asking you to install the UI Lab plugin if it’s not already installed. Click Install to proceed.

Verification

After installing the plugin, you’ll need to sign in and complete a brief onboarding process to verify your setup.

1. Launch the Plugin:
   • In Figma, open any design file (or create a new one).
   • Right-click on the canvas, hover over Plugins, and then select UI Lab from the list.
2. Sign In: The UI Lab plugin panel will appear. Click on the Sign In button.
   • You will be redirected to your web browser to authenticate with your UI Lab account.
   • Follow the on-screen instructions to enter your credentials and grant access.
   • Once signed in, you’ll be redirected back to Figma, and the plugin will confirm your connection.
3. Complete Onboarding: Upon your first successful sign-in, the plugin will guide you through a quick onboarding process. This may involve:
   • Project Linking: Connecting your Figma project to your UI Lab workspace.
   • Initial Configuration: Setting up basic preferences or syncing initial design tokens. Follow the prompts to complete these steps.

If you can successfully sign in and complete the onboarding, your UI Lab Figma plugin is installed and ready to use!

Troubleshooting

If you encounter any issues during installation or setup, consider the following:

• Internet Connection: Ensure you have a stable internet connection.
• Figma Update: Make sure your Figma desktop app or browser is up to date.
• Clear Figma Cache: Sometimes clearing Figma’s cache can resolve plugin issues.
  • For desktop app: Go to Help > Troubleshooting > Clear Cache and Restart.
• Browser Issues (for web version): Try a different browser or clear your current browser’s cache and cookies.
• UI Lab Account: Verify your UI Lab account credentials are correct and active.
• Contact Support: If problems persist, please reach out to UI Lab support with details of the issue, including any error messages.