how I build a full landing page from scratch using Gemini 3 Pro.
Some of you may know me from the DesignCode channel, where I teach UI design. I’m still part of the team, but I wanted my own space to share how my workflow has evolved with AI.
Over the past month, the way I design has changed completely. Instead of starting in Figma and handing everything to developers, I now design, prototype, and build templates in a different way, using AI and prompting to move much faster.
In this video, I show my real workflow for designing a full landing page with AI, from structure to animation. You’ll see:
How I use Gemini 3 to reproduce layouts from inspiration images
My process for building a landing page section by section
How I work with wireframes, UI, and prototyping using AI
When to prompt and when to edit manually to save credits
How I add animations, charts, and looping interactions
How to make pricing toggles and UI interactions functional
The tool that I used:
➡https://www.aura.build?via=sourasithp
This template:
➡https://developer-monetizati.aura.bui...
Prompts:
➡https://docs.google.com/document/d/1u...
The main tool I use is Aura Build. You can apply a similar process with tools like Lovable, v0, or Bolt, although the results may differ. I’m not fully up to date on how these other tools currently work.
This is not a perfect step-by-step tutorial. It’s a real, improvised design session showing how I think and adapt when working with AI. Because AI results vary, you may not get the exact same outcome if you try to reproduce it, but following the same process will help you create your own unique template.
Follow me
➡ / sourasith.design
➡ / titepommee
➡www.linkedin.com/in/sourasith-phomhome
Thanks for being here. This channel is where I share how I really work with AI as a designer. If you have questions or need help, feel free to leave a comment. I’m excited to see what you create.
Like, subscribe, and comment below to tell me what you want to learn next.