Create Your First Website with AI

Kanorio's AI website building process isn't about answering a barrage of questions at once. Instead, it breaks down website creation into 4 steps. Each step collects only the brand information the AI truly needs. Once completed, the AI generates a draft website based on this information, ready for you to refine.

Think of it like hiring a website-savvy assistant to create your first version: You provide the "Who I am, What I offer, What style I want, What I want visitors to do," and the AI organizes that information into website content. Ultimately, you decide whether to publish, how to edit the text, and which images to use.

Prepare This Information Before You Start

Perfection isn't required, but the more complete the following information, the closer the generated result will typically be to your brand:

• Brand or store name
• A tagline that describes what you do in one sentence
• At least 1 image of your services, products, work, or a relevant scene
• 1 large image for your homepage
• Your logo image, or an icon to represent your brand
• Your preferred brand color
• A button link you want visitors to click (e.g., to a booking page, social media, product page, or contact page)

If you don't have all the information yet, you can still complete the first version with what you have. You can add more details in the editor after the website is generated.

How to Enter the AI Website Building Flow

After logging in, find the "Create Website" entry point on your dashboard. If you don't have any websites yet, buttons to start the creation process will also be available on your dashboard and in the editor.

The system automatically saves your progress as you go. A Draft is an unfinished, unpublished working version. You can return and continue from where you left off after switching steps, refreshing, or temporarily leaving.

Step 1: Set Up Brand and Website Content Language

This first step has 3 required fields: Website Content Language, Brand Name, and Brand Tagline.

Choose Website Content Language

This is the language the AI will use to write your website content. It doesn't have to be the same language as your Kanorio interface.

For example, you can use Kanorio in Traditional Chinese (Taiwan) and have the AI generate website content in English, Japanese, or other languages. The Kanorio interface supports 6 languages, while AI content generation supports over 60 languages and regional variants.

Enter Brand Name

Your brand name will appear in the website title, navigation, footer, and some AI-generated copy. Use the name your visitors will actually see.

Good examples:

• Mountain Crest Coffee
• Lin An Design Studio
• Mellow Skin Studio

Avoid generic names like "My Website" or "Test." These provide too little information for the AI to understand your brand positioning.

Enter Brand Tagline

Your brand tagline should explain "What value you provide to whom" in a sentence or two. It doesn't need to sound like an advertisement, but specificity helps.

Less specific example:

Providing the best service

More specific example:

Offering appointment-only pour-over coffee experiences and corporate catering for busy professionals.

The second example gives the AI context about the target audience, service format, and unique features, making it easier to generate a suitable homepage title and description.

Step 2: Provide Service Details and Images

This step includes two cards: Service Images (required) and Service Description (optional).

Upload Service Images

You need to upload at least 1 image; the system supports up to 10. These can be photos of your products, work, store, service environment, team members, or any other visuals that represent your brand.

Choose clear, bright images directly related to your services. Avoid blurry screenshots or irrelevant visuals, as they impact the AI's understanding of your business and may appear on your generated site.

Add Service Description

While optional, the service description is highly valuable. It helps the AI better understand your offerings, customer types, processes, and unique selling points.

You can answer questions like:

• What services or products do you offer?
• Who is your primary target audience?
• Why do customers typically need you?
• What makes you different from other options?

For example:

Providing one-on-one career coaching, resume reviews, and mock interviews to help marketing professionals transitioning careers clarify their job search direction.

This text helps the AI generate content more specific to "career services" rather than a generic company.

Step 3: Set Up Website Visuals

This step collects your brand color, homepage cover image, and brand logo. All three are required.

Set Brand Color

Your brand color is the primary theme color that appears most frequently on your website, used for elements like buttons, links, or key sections. Kanorio requires both a light and a dark color to ensure sufficient readability across different site themes.

Color codes are represented by a 6-digit alphanumeric string starting with '#', like #0084FA. If you already have a brand color, enter it directly. If unsure, choose a color close to your logo, and the system will help prepare a corresponding dark version.

Upload Homepage Cover Image

The cover image is the large visual visitors see first upon arriving at your website, typically at the top of the homepage. Choose an image that immediately communicates who you are or what you do, such as a storefront, a piece of work, a service in action, or a key product visual.

Choose Brand Logo

The logo is your brand's mark displayed in the website header. You can upload a logo image or select an icon to represent your brand if you don't have an image file. You must set at least one of these to complete this step.

Step 4: Define Visitor Actions

The final step involves customizing buttons, brand links, and contact information. The core purpose here is to tell visitors, "What should they do next after viewing the website?"

Add at Least One Custom Button

A CTA (Call to Action) button guides visitors to take the next step, such as "Book Now," "View Products," or "Contact Us."

You need to complete at least one button, and each complete button requires:

1. An icon
2. Button text
3. A valid external link

The external link can be to your booking system, social media page, product page, email, or phone number. Test the link yourself to ensure it directs visitors to the correct destination.

Add Brand Links

Brand links are optional. You can add links to your Instagram, Facebook, Threads, YouTube, or other social media channels here, allowing the AI and the website footer to recognize your existing public brand presences.

Add Contact Information

Address, phone number, email, and business hours are all optional. If you provide them, ensure the format is correct. For example, the phone field will validate based on country/region formats, and the email must be a valid email address format.

What Happens After You Hit Generate?

Once you complete Step 4 and hit generate, Kanorio will create a website generation job. The screen will display the current status, such as preparing, generating content, or completed.

The generation process uses your provided brand information to process visuals and content, then builds the editable website data. If the system is queuing your request, you might see your position in the queue or an estimated wait time. Please keep the page open until completion. If your internet connection temporarily drops, the system will attempt to reconfirm the job status.

Upon completion, you'll be taken to the editor with a success message. The website is still a draft and not yet public.

What to Do After AI Generation?

First, check the following in the editor:

1. Is the brand name and title accurate?
2. Are images placed appropriately?
3. Does the service description match what you actually offer?
4. Do the CTA buttons link to the correct URLs?
5. Is the mobile preview easy to read?

The AI-generated content is a first draft, not a final, unchangeable version. You can directly click on sections to edit text, swap images, remove unwanted content, or add new modules.

Read: Understanding the Editor