Smart Regenerate & Automatic Connected Frames Detection

Smart Regenerate Code Flow

Locofy.ai now detects any edits you make in Figma and lets you include these changes in your next Lightning run. This ensures you stay updated with your design changes and can regenerate the code to match your latest edits, making continuous iteration and syncing straightforward.

  1. Open your design in Figma and make any necessary changes. For example, you could add a shadow to a card, change the text of a navigation link, or change the color of a button.

  2. Navigate to the Locofy plugin in Figma. On the home screen of the plugin, click on "View Code."

  3. The plugin will detect changes (if any) and show a popup with the no of changes detected.

  4. The pop-up gives you two choices:

    • Generate Code: This option will regenerate code but only for the changes detected.
    • View Code: This option will ignore the new changes and show the code from the last lightning run.
  1. If you chose "Generate Code", the plugin will regenerate the code to include your recent edits. You can now review the updated code to see how your changes have been incorporated.

By following these steps, you can ensure that your design changes are always reflected in your code, giving you the flexibility to update your project as needed.

Automatic Connected Frames Detection

Locofy has introduced a new feature that automatically detects all frames connected to your parent frame in a prototype, making the process of converting frames to code much simpler. Here’s how you can use this feature:

  1. Open the Figma project that contains your prototype.

  2. Click on the parent frame in your Figma file. This frame should be connected to other child frames in your prototype.

  3. Open the Locofy plugin from the Resources tab in Figma.

  4. In the Locofy plugin, click on the "Convert Frames" button. Locofy will automatically detect all the child frames connected to your parent frame.

  5. Review and Confirm:

    • The plugin will show you the connected frames it has detected.
    • Confirm the selection and proceed with the conversion.

Note: A maximum of 25 connected frames can be converted to code in one Lightning run.

By using this feature, you save time and effort as Locofy handles the detection of all connected frames for you, eliminating the need to select each frame individually. This enhancement improves efficiency, especially for projects with numerous frames.