Hello hello!
Let's do a workshop based on a recent Codex community video!
In this workshop, you will generate interface designs using AI, copy them to Figma and then convert them to real components on Wix Studio.
Choose an interface design AI generator. In this case, I am choosing https://www.usegalileo.ai/explore.
You can choose between text to AI or image to AI. I am choosing a text to AI; if you are inspired by something, I recommend trying out the image to AI option.
3. Write the component that you want. In my case, I have used the following prompt: “Create a homepage for a community forum”. It will result in two outputs.
4. Click on the design you want and select “Figma” on the right-hand side.
5. Log in to Figma and select the new design file.
6. Paste the contents (Cmd + V or ctrl + V)
7. Great! Now you have the design in Figma, feel free to edit it however you like.
8. Go to the “Figma to Wix Studio” Plugin, click “open in”, and then select the Figma File.
9. Click “run”
10. Open Wix Studio and select your website. For demonstration purposes, I am starting from scratch without any template.
11. Go to “Import from Figma, " paste the Figma URL, and click Connect.
12. Click the checkbox in the Figma and click next.
13. Select the “Export Frame” option and then click on the Figma frame.
14. Click export frame.
15. Go to Wix Studio and click “refresh import”. Select the frame as “page” and import it to the site.
16. Voila! You have your component in Wix ready to go! Make any changes to it that you might like!
Comments