1. Product introduction

Turn ideas into pages you can actually compare

Lovable is for people who want to turn a requirement into a web app: they generate and change pages by talking to AI instead of first writing the entire interface. Drafts are experimental spaces inside a project, where creators, designers and people responsible for copy can explore different directions.

Imagine a live course website. The team is deciding whether its homepage should lead with learning outcomes or the course outline. Discussing both options in a chat does not show their actual reading order. Repeatedly changing one page can also blur the distinction between an experiment and an agreed decision. Separate chats and previews turn the alternatives into pages that people can examine.

Page changes and data writes take different paths. The comparison and checks below are suggestions in this article, not automatic product checks. Enlarge to inspect the branches.

2. Core workflow

Start each direction with a clear question

Suppose a course website is already live and the team wants to try leading with learning outcomes or with the course outline. The Drafts announcement describes opening the project name at the top and choosing New draft. Each direction gets its own conversation and preview. State the problem to solve, such as helping a first-time visitor understand what they will be able to do, rather than simply asking for a nicer page.

This covers the front-end changes described in the announcement: layout, copy, colors and animation. In the initial release, database structure and authentication changes still belonged in the main project conversation. A page draft is not an isolated environment for every system change.

Develop alternatives, then compare the same task

  1. Develop one direction. Edit and inspect the draft so the outcomes-first idea can follow its own logic.
  2. Keep another route. Create a separate draft for an outline-first approach, without overwriting the current direction just to see another one.
  3. Compare the reading experience. Use the same course information and screen width to check whether new visitors understand who the course is for and what they can learn. This is a suggested comparison method, not an automatic conversion assessment.
  4. Check data effects. The drafts guide explains that drafts share the backend. A test registration in preview may write a real record; deleting the draft does not undo it.

An unpublished page and unchanged application data are different states. The convenience of trying a page should come with an understanding of what each action can affect.

Accept the direction before deciding to make it public

Use Accept to bring the chosen draft into the project, and delete directions you do not want. After acceptance, check mobile reading, links and forms before using Publish to make page changes visible to visitors.

There are three distinct places: an experimental draft, the adopted project and the public page. Choosing a good direction need not mean launching immediately, and delaying publication need not mean losing that decision. The result is a page the team has checked and chosen to release, not merely another AI generation.

3. Design decisions and takeaways

Replace one constantly changing answer with options you can keep

After AI generates the first course homepage, a team can easily keep polishing that direction: strengthen the headline, remove some information, change the spacing. A few rounds later, everyone may have forgotten there was another route. Independent drafts change how alternatives are preserved, rather than improving generation quality by themselves.

A separate chat and preview let an outcomes-first page continue developing around outcomes, while an outline-first page follows its own logic. Two sets of instructions no longer have to compete inside one editing history. People can switch between the pages with the same content and screen size. The design benefit is that the choice can return to its purpose: can a new visitor explain who the course is for and what they will be able to do afterward? This comparison method is a suggested practice, not an evaluation the product performs automatically.

That is why “backup” is an incomplete description of a draft. A backup answers how to go back when something breaks; an alternative answers which direction deserves more work. The identity an interface gives a saved version changes what people do next. More drafts can also increase decision costs. Ten generated pages need not represent ten useful alternatives.

Separate adoption from publication so each commitment has its own decision

A copywriter deciding that a new homepage reads more clearly is different from an owner deciding that every visitor should see it today. Accept brings the chosen draft into the project; Publish makes the page changes live. These actions make different commitments.

The course team can adopt a new explanation, then check whether it fits on a phone and whether buttons point to the right course before deciding when to publish. They do not have to choose between losing a promising option and releasing it too soon. This separation does not ensure that checks happen, but it gives them an identifiable place.

The transferable principle is to distinguish “being explored,” “adopted” and “in effect,” even when AI makes generation fast. Different commitments need distinct states and actions so people can understand what they are choosing and who the next click will affect.