Journal
Prompt vs source files: why your AI rebuild never matches the demo
A prompt describes a website in words and asks an AI tool to build it, so the result is the AI's interpretation: close, but never the same site. Source files are the real HTML, CSS, JavaScript and assets of the design, so you start from the exact thing and only change what you want. If you need the design to match, start from files; if you need something new, use a prompt.
What happens when you paste a prompt
An AI coding tool reads your prompt and writes code that it thinks matches the description. Even a very precise prompt, with exact timings, colours and layout rules, leaves room for interpretation, and the tool fills the gaps itself. Run the same prompt twice and you can get two different sites. Run it in two different tools and you will get two more.
We saw this ourselves. When we pasted one of our own template prompts into another AI tool, the result was close, with the right idea and roughly the right look, but it was not the same page as the demo. That is the normal behaviour of the technology, not a mistake in the prompt, and it is the reason this site now also offers the real files.
Five reasons the rebuild drifts
- Interpretation. Words like "slow, elegant ease" become different numbers in different tools. A precise value such as an exact duration or ease curve survives better, but a long prompt still has many places to drift.
- Assets cannot be described. Photos, video, 3D models, textures and fonts are files. A prompt can say where one goes and how large it is, but it cannot contain it. The AI tool uses a stand-in, which changes the whole feel of the page.
- Library versions. Animation code depends on the exact version of libraries such as GSAP, ScrollTrigger, Lenis or Three.js. A tool may use a newer or older version than the demo and behave slightly differently.
- Long prompts get shortened. Many AI tools have a limit on how much they read at once. A full-page prompt can be cut, summarised or applied in parts, and details are lost without a warning.
- No memory of the demo. The AI tool never sees the live page. It builds from text alone, so it cannot compare its result with the original and correct itself.
What a source package changes
A source package is the actual folder behind the demo: index.html, the stylesheet, the scripts, local copies of the animation libraries, and the assets that are free to ship. You open it, change the words, colours and photos, and publish. Nothing is rebuilt, so nothing drifts.
It also changes what you ask the AI tool to do. Instead of "build this site", you ask "edit these files: change the brand name, the colours and the opening hours, and do not touch the animation code". That is a much smaller job, it keeps the motion exactly as designed, and it uses far fewer of your AI credits.
| Prompt only | Source files | |
|---|---|---|
| What you get | A description the AI tool interprets | The real files of the design |
| Matches the demo | Close, not identical | Exact |
| Photos, video, 3D | Stand-ins you replace | Included where the licence allows; marked placeholders where it does not |
| AI credits | A full build, often several tries | A small edit |
| Best for | New ideas, other stacks, learning how a design works | Shipping a design as it was made |
When a prompt is still the right choice
- You want the idea but a different framework, such as React, Next.js, Webflow or Framer. A prompt ports a design to another stack.
- You are combining several effects into one site. The Prompt Builder writes one master prompt for that.
- You want to learn how a motion works. A prompt lists the exact values and the steps.
- You have no use for the original files, and a close match is enough.
On MOTION/LAB the two work together. Prompts Pro gives you every prompt. All Access adds the real source package for every template and effect, plus customise prompts that tell your AI tool to edit the files and leave the motion alone. A single template is a one-time purchase and includes its package.
A simple way to decide
- Open the template and check it on the laptop and phone views. Decide it is the one.
- If the design must match, download or buy the source package and use a customise prompt on it.
- If you need another stack or a mix of effects, use the prompt, and expect to review the result against the demo.
- Whichever you choose, put it online with one of the free hosts in the publish guide.
Questions, answered
Why does my AI-built site look different from the demo?
Because the AI tool builds from a text description, not from the original files. It interprets the words, uses stand-in images and may use different library versions, so the result is close but not identical.
Can a more detailed prompt fix this?
It narrows the gap but cannot close it. Exact values help, but assets such as photos, video and 3D models cannot be written into a prompt, and the AI tool still decides how to interpret the rest.
What is in a MOTION/LAB source package?
The real HTML, CSS and JavaScript of the template, local copies of the animation libraries, fonts and assets that are free to ship, a README, instructions for AI tools, and a credits file. Photos that are demo-only are replaced by labelled placeholders, with the original source listed.
Do I need the source files if I only want a close match?
No. A prompt is enough if a close match is fine. Choose files when the exact design matters or when you want to save AI credits on small edits.
Where this comes from
- MOTION/LAB template prompts and source packages (our own product)
- Our own testing of a template prompt in another AI tool (result: close, not identical)