Build a Website with AI in Minutes! Wegic AI Tutorial - No Coding Needed

Key Concepts

• AI-powered website builder
• No-code website creation
• Wagic AI platform
• Static websites
• Prompt-based website design
• Website customization
• Call to action (CTA)
• Automatic adaptation (responsive design)
• Sketch to site

1. Introduction to AI-Powered Website Building

• The video introduces the concept of building a fully functional website in minutes without coding using AI.
• It highlights the use of AI-powered website builders to generate sleek sites in real-time.
• The video promises to demonstrate how to create a website effortlessly, professionally, and quickly using AI tools.

2. Wagic AI: Instant Website Builder

• Wagic AI is presented as an AI-powered platform for creating professional websites without coding.
• Users describe their vision in plain language (e.g., "a minimalist portfolio with a blog"), and Wagic AI designs a custom site.
• The platform allows for easy tailoring of elements, adding features like contact forms or e-commerce tools, and optimizing for SEO.
• Wagic AI is suitable for businesses, freelancers, and creatives seeking a fast and intuitive way to launch an online presence.

3. Step-by-Step Website Creation Process with Wagic AI

3.1. Creating a Wagic Account

• Go to www.wagic.ai.
• Click "Sign Up" and enter email and password or sign in with Google.
• Verify the email address after logging in.

3.2. Creating a New Project

• Click on "Build Your Site" then "Create New Project".
• Choose a website type (e.g., business, portfolio, blog).
• Type a related prompt and the name of the website (e.g., "create an online store named Aliana").
• Important Note: Wagic AI currently creates static websites, meaning it can showcase products but lacks functionalities like shopping carts or payment systems.
• Choose the language for the website.
• Review the details of the website to be created and click "Okay, let's start generating."

3.3. Adding Icons

• Type a prompt in the message box to add icons (e.g., "Add Twitter and LinkedIn icons below the main button").
• Wait for the AI to process and display the icons.

3.4. Editing the Homepage

• Click on the homepage section to modify text, images, and buttons.
• Customize colors, fonts, and layout.
• Editing Text:
  • Go to the chat interface.
  • Select the text to change.
  • Click the "Edit Text" icon.
  • Paste the new text and save.
• Changing Images:
  • Method 1 (Prompt-Based): Select the image, type a prompt describing the desired image, and click "Send."
  • Method 2 (Upload): Select the image, click the image icon, choose "Replace Image," click "Upload," and upload the desired file.

3.5. Adding Pages

• Type a prompt in the message box to add a new page (e.g., "Add another page on website").
• Click "Send" and wait for the AI to generate the page.
• Access the new page (e.g., "Products") via the three-dots menu.

3.6. Adding a Call to Action (CTA)

• Type a prompt in the message box to add a CTA (e.g., "Add a call to action on website").
• Click "Send" and wait for the AI to generate the CTA.
• The CTA will appear on the homepage.

3.7. Adding Music

• Type a prompt in the message box to add music (e.g., "Add music on website").
• Click "Send" and wait for the AI to generate the music section.
• The music will be embedded on the website page.

3.8. Changing Theme and Background Color

• Type a prompt in the message box to change the background color (e.g., "Change the background color of the website to a soft pastel gradient for a more calming effect").
• Alternatively, go to the "Theme" section and choose a color.

3.9. Adjusting the Layout

• Type a prompt in the message box to adjust the layout (e.g., "Adjust the layout of the product page to display items in a three-column grid with more spacing").

3.10. Regenerating the Website

• Click the "Regenerate" button in the top right corner of the homepage to regenerate the entire website based on the current settings.

3.11. Sketch to Site

• Wagic AI allows users to edit the website by simply circling the elements they want to change.
• Mark the text, images, or layouts to be edited, and Wagic AI will handle the rest.

3.12. Automatic Adaptation (Responsive Design)

• Wagic AI ensures that the website looks perfect on any device (PC, tablet, mobile, smartwatch) through automatic adaptation.
• This feature provides a seamless user-friendly experience regardless of the device used to access the website.

4. Publishing the Website

• Click on "Unpublished" at the top of the page.
• Set the website name and custom domain.
• Click "Publish" to make the website live.

5. Conclusion

• The video concludes by emphasizing the ease of creating an amazing website with Wagic AI.
• It encourages viewers to check the link in the description to get started.
• The video ends with a call to action to like, subscribe, and hit the notification bell for more AI-powered content.