Скачать или смотреть Vibecode An Apple-Style AI Website Using FREE Google AI Tools (Whisk → Flow → Firebase) [No-Code]

I built a dark, Apple-style landing page for a smart ring — with smooth animations, a cinematic hero loop, a real waitlist backend, and a live Firebase link.

📌 Full prompt is in the pinned comment (pinned document).

And you can copy the exact prompts + workflow and build your own version today.

Timestamps :

00:00 What We’re Building (Apple-Style Smart Ring Website)
00:26 Complete AI Workflow Overview
00:42 Step 1: Apple-Style Copywriting with Gemini
01:18 Step 2: Creating Consistent Product Visuals
02:45 Step 3: Animating Product Shots with Google Flow
03:51 Step 4: Optimizing Assets (WebP)
04:33 Step 5: Supabase Setup (Storage + Waitlist)
05:51 Step 6: Building the Website with Firebase Studio
07:21 Step 7: Final Preview & Publishing

In this tutorial, we’ll build AURA RING (a fictional demo product) using this exact pipeline:

Gemini → Whisk → Flow → Ezgif → Supabase → Firebase Studio

Whisk is a Google Labs tool that lets you use images as prompts, and Flow is Google’s AI filmmaking tool for cinematic clips.

What you’ll learn (step-by-step)

Write clean Apple-style copy with Gemini (dark, premium tone)

Generate consistent product visuals with Google Whisk (subject + scene + style)

Turn a still into a cinematic looping hero video with Google Flow

Convert & optimize assets (WebP/MP4) for fast loading

Use Supabase Storage to host assets + create a Waitlist table
(Public buckets mean anyone with the URL can access the file, so use it carefully.)

Generate a premium dark Apple-like UI in Firebase Studio

Prompts + assets
✅ All prompts are in the pinned comment (copy/paste, in order).
✅ Use the same system for any product: smart ring, headphones, perfume, camera, SaaS—anything.

Tool stack used
Google Gemini (copy + starter images)

Google Labs Whisk (visual set generation)

Google Labs Flow (cinematic loop video)

Ezgif (convert/optimize)

Supabase (Storage + Waitlist DB)

Firebase Studio + Firebase Hosting (deploy)


If you build one
Post your result and tag me — I want to react to the best “Apple-style” pages.
#VibeCoding #GoogleGemini #GoogleLabs #Firebase #Supabase #WebDesign #LandingPage

*Disclaimer*
This video is for education and entertainment only. Results vary and nothing here guarantees views, revenue, customers, or “million-dollar” outcomes.
Not financial, legal, or business advice.
“AURA RING” is a fictional demo product for tutorial purposes. I’m not affiliated with Apple, Google, Supabase, or Firebase.
All trademarks, product names, and logos belong to their respective owners; “Apple-style” refers to a design aesthetic only (do not copy Apple branding/logos).
AI tools are experimental and availability/features may change by region or account.
If you collect emails with Supabase/Firebase, you are responsible for privacy compliance (consent, storage, and security). Public storage buckets make files accessible to anyone with the link—don’t upload sensitive data