Create your first WebFlow Template using AI

Published
March 6, 2024
To read
minutes
Category
Advanced
Written By
Jayant Rao

Skip design roadblocks with AI! This guide explores using Lexica, Midjourney & Relume AI to generate website design ideas. Export to Figma & fine-tune in Webflow. AI assists, your creativity thrives!

Designing a website can be a lot of fun, but, it can also be a lot of work. From having to go back and forth changing design after design after design, to, the worst of all; realizing that the design looked better in your head.

Yeah, it happens, but it doesn’t always have to be that way, Introducing Web Design using AI.

In recent months AI has soared to the top of the chart in so many industries, from ChatGPT, Midjourney, and even Dall-E we have quite an array of AIs to choose from.

In this guide, we’ll be showing you how you can create your own web designs using AI.

1. Lexica art

  • Go to Lexica.art
  • Input your prompt
  • Get the image of the design
  • Make the design in Figma
  • Export it to Webflow using the Figma to Webflow plugin
  • Fine-tune it and work out the bugs

2. Midjourney

  • Go to Midjourney.com
  • Create an account or log in
  • Accept the invite to join the Discord server
  • At the top right input in the search bar, the word “Imagine” and press enter
  • You should see the Midjourney bot, click it and you'll be taken into the Midjourney Chatroom
  • In the message field at the bottom, input “/imagine” and click enter
  • Input your prompts
  • Get the image of the design
  • Make the design in Figma
  • Export it to Webflow using the Figma to Webflow plugin
  • Fine-tune it and work out the bugs

Please note that in Midjourney if you have a subscription you can go to the community feed tab located to the left of midjourney.com and there you can search for inspiration.

3. Relume AI Site Builder

  • Go to library.relume.io/ai-site-builder
  • Input your prompt and press enter
  • Tweak how you’d like it to look
  • Export to Figma to make any further changes
  • Once you’re done with tweaking in Figma export it to Webflow using the Figma to Webflow plugin
  • Fix any remaining issues

Conclusion

Designing Websites using AI makes the workload a bit easier but it is no substitute for creativity, though you may use AIs to design you may still need to make some changes of your own to the design.

Think of designing a Website using an AI or various AIs as you being an Architect and the AI or AIs as being assistants whose job is to aid you in better visualizing the end result.

Looking for a webflow expert?

Just like you, we are also looking for partners who would like to work with us. We want to be your team, part of your team and much more. Take that leap and fill in this form or email us.

Book A Free Call

Download our Free WebFlow Checklist

If you are curious about the checklist we follow for all our WebFlow projects, look no further - we have packed it for you in a comprehensive document. All you have to do is Duplicate it into your Notion Profile and start using it for your current or any upcoming projects.

✓ Kick-Off Checklist

✓ Pre-Launch Checklist

✓ Post-Launch Checklist

Thank you!
Check your inbox for the link.
Oops! Something went wrong while submitting the form.