# Viktor Oddy: the Google AI Studio full process **Source.** ["The NEW Google AI Studio FULL Process: Beginner to Pro"](https://www.youtube.com/watch?v=raUcRcrfgoE), Viktor Oddy, 21:47 min, decoded 02-08-2026. Frank's view: [reference-viktoroddy-aistudio.html](reference-viktoroddy-aistudio.html). Third Viktor Oddy reference, after [the Higgsfield MCP tutorial](reference-viktoroddy-tutorial.md) and [the award-winning-sites video](reference-yt-award-winning-animated-sites.html). **What it is.** His full build of a futuristic fashion site — a hover reveal hero, a working shop — using Google AI Studio as the free builder. The models the video actually shows: **GPT Image 2** for every image (picked inside Higgsfield's model list, where Nano Banana Pro and 2 also sit — he prefers GPT Image 2, "the best model"), **Seedance 2.0** for video, **Gemini Flash** writing the code inside AI Studio's build mode. Not Nano Banana, not Veo, in this one. ## The process, step by step 1. **Pinterest, twice (0:42).** One search finds the character (a futuristic person), a second finds a website UI he likes — light colors only, so it fits the design. Copy both images. Inspiration, "not exactly copy". 2. **Design the page as an image (1:20).** In Higgsfield he picks GPT Image 2, High quality, 4K, Auto framing, and asks: put the person from image two into the UI from image one, make it white, make the fonts futuristic, redesign a little. He iterates many times — cheap image generations, not code edits. The result IS the page design, as a picture. 3. **Make the mask pair (4:29).** Two more asks: (a) remove every text, button and UI element, keep just background + person; (b) remove the futuristic pieces from her face. Now two images in exactly the same pose, one difference between them — the raw material of a hover reveal effect (the cursor wipes one image away to show the other). 4. **Build in Google AI Studio (6:01).** The design image goes to AI Studio's build mode, which writes the page. For the reveal he does not describe it: he copies a ready prompt from [motionsites.ai](https://motionsites.ai), replaces its two asset links with his pair, and adds "do not change any content already on the page". One follow-up fixes mobile: image below the text, static, no reveal. 5. **One prompt, a whole shop (7:47).** A long motionsites e-commerce prompt, pasted once into build mode, returns a full shop — scroll videos, working cart, mobile responsive. 6. **Reskin the hero video with Seedance 2.0 (8:42).** Ask AI Studio for the hero video's link, copy its first frame, put the new character into that frame with GPT Image 2, then in Higgsfield: Seedance 2.0, reference video + new image, same 5-second length, prompt "create a video exactly like this, do not make any changes". Download, ask AI Studio to swap the hero video. The template's motion, his character. 7. **Export to Google Antigravity (14:30).** AI Studio is the free first step; when the project grows he exports the code (GitHub, or plain download) into Google Antigravity, Google's free code editor, which has more models and takes dragged-in assets. 8. **More pages, image first (16:37).** For the shop page he again designs the page AS AN IMAGE ("create me an image like this, but a shop page"), then two derivatives: the UI with the product pictures removed, and the four products alone with no UI. The empty UI is the build instruction; the products are cut out in Figma (four square frames, remove background, export PNG) and uploaded — the AI wires each to the cart. ## What is new versus his Higgsfield process We decoded [his earlier tutorial](reference-viktoroddy-tutorial.md) (Claude + Higgsfield MCP) already. Same skeleton — Pinterest reference, one style, motionsites prompts as contracts, mobile check. New here: - **Design-as-image-first.** The page design is generated as a PICTURE and iterated in the image model before any code exists. The code AI then recreates the picture. Earlier he prompted the code AI directly. - **The mask pair.** An interactive effect is really an asset discipline: two images, same pose, one difference. The prompt for the effect is borrowed; the pair is the work. - **Video reskin by reference.** Seedance 2.0 copies an existing clip's motion onto a new character. Any template video becomes yours without describing motion at all. - **A different toolchain.** Google AI Studio build mode + Antigravity instead of Claude + Higgsfield MCP — and therefore a manual download-upload loop for every asset, the exact friction the MCP had removed. ## What we adopt, what we skip **Adopt.** - **Design-as-image-first for flagship pages.** Iterate the look in an image model at centimes, hand the final picture to Claude Code as the contract. Fits our recreation-prompt discipline; the picture becomes part of the spec. - **The mask-pair discipline.** When a motion page needs a reveal, order the asset pair (same pose, one difference) before touching code. - **Video reskin by reference.** "Exactly like this video, new character" is the cheap way to reuse one good master clip across pages — same logic as our avatar factory's master-clip idea. **Skip.** - **AI Studio + Antigravity as builders.** Claude Code is our builder and the Higgsfield MCP already puts assets inside the conversation; his manual loop is a step backward for us. AI Studio stays what [the doctrine](motion-design.md) says: the free front door to Google's models for images and scenes. - **Figma for cutouts.** Background removal is one command in our toolkit; no editor needed. - **The e-commerce wiring** (Shopify, carts). Not our line of work.