Я создал анимированный сайт о товаре за 10 минут, используя ИИ (Google Anti-Gravity).

Узнайте, как создавать профессиональные 3D-сайты для товаров с анимацией прокрутки с помощью ИИ — совершенно бесплатно. Подходит для ЛЮБОГО товара: мангового сока, наушников, гаджетов или вашего собственного бизнеса.

Предварительный просмотр сайта:
https://lighthearted-conkies-6bf67a.n...

⏱️ ВРЕМЕННЫЕ МЕТКИ:
00:00 - Введение: Предварительный просмотр 3D-сайта с товарами
00:45 - Обзор инструментов и пакет подсказок
01:05 - Шаг 1: Поиск изображения товара
01:25 - Создание 3D-рендеров товаров с помощью Google Whisk
02:10 - Создание премиальных визуальных материалов для товаров (центрирование)
02:55 - Создание пустой фоновой рамки
03:35 - Шаг 2: Анимация с помощью FreePik/Veo Flow
04:12 - Преобразование видео в прокручиваемые кадры (EZGif)
05:00 - Шаг 3: Настройка Google Anti-Gravity
06:00 - Создание сайта с помощью One-Shot Prompt
07:14 - Развертывание на Netlify (бесплатно) (Хостинг)
08:36 - Предварительный просмотр финального сайта и демонстрация в реальном времени

🛠️ ИСПОЛЬЗУЕМЫЕ ИНСТРУМЕНТЫ (100% БЕСПЛАТНО):

1. *Google Whisk* - Генерация 3D-рендеров товаров с помощью ИИ
2. *FreePik AI* или *Google Veo Flow* - Видеоанимация
3. *Google Anti-Gravity* - Генератор кода для веб-сайтов с помощью ИИ
4. *EZGif* - Конвертер видео в кадры
5. *Netlify* - Бесплатный веб-хостинг

📦 БЕСПЛАТНЫЕ ЗАДАНИЯ И РЕСУРСЫ:
https://docs.google.com/document/d/1g...

✅ ЧТО ВЫ СОЗДАДИТЕ:

Веб-сайты товаров в стиле Apple с прокруткой и 3D-рендерингом
Несколько вариантов товаров (на голландском языке) (Примеры: шоколад, рубиновый гранат)
Профессиональные анимации, реагирующие на прокрутку
Полностью развернутые веб-сайты с поддержкой пользовательского домена [web:41][web:44]

🎯 ПОЛНЫЙ РАБОЧИЙ ПРОЦЕСС:

*ШАГ 1: Создание визуализаций продукта (Whisk)*
Загрузка фотографии продукта (пример: манговый сок Maza)
Использование подсказки для напитка Nano Banana для премиального вида
Создание центрированного позиционирования продукта
Создание пустого фонового кадра для начала анимации

*ШАГ 2: Создание анимации (FreePik/Flow)*
Загрузка начального кадра (пустой фон)
Загрузка конечного кадра (продукт с элементами)
Использование подсказки для кинематографической сборки (вихрь мангового пюре, динамическая камера)
Создание 10-секундного видео 1080p с моделью Kling 2.5 [web:39][web:40]

*ШАГ 3: Извлечение кадров (EZGif)*
Загрузка сгенерированного анимационного видео
Установка до 25 кадров в секунду для плавной прокрутки
Преобразование в кадры JPG (всего 250 кадров)
Загрузка в виде ZIP-файла

*ШАГ 4: Создание веб-сайта (Антигравитация)*
Создание папки проекта (например, "Maza")
Импорт папки frames
Вставка шаблона веб-сайта
ИИ генерирует полный код веб-сайта Next.js [web:44]

*ШАГ 5: Развертывание на Netlify*
Запуск `npm run build` в терминале
Нахождение папки "out" в проекте
Перетаскивание папки в Netlify для ручного развертывания
Получение мгновенного рабочего URL (например, zesty-cascaron.netlify.app)

💡 ПОЧЕМУ ЭТОТ РАБОЧИЙ ПРОЦЕСС РАБОТАЕТ:

✅ Профессиональная анимация на основе прокрутки (как у продуктов Apple) [web:41]
✅ Работает для ЛЮБОЙ категории товаров
✅ Не требуется никаких знаний в программировании
✅ Бесплатные инструменты на протяжении всего процесса процесс
✅ Возможность развертывания на пользовательских доменах
✅ Возможно создание нескольких вариантов продукта

🔥 РАСШИРЕННЫЕ ФУНКЦИИ:

Последовательность кадров, запускаемая прокруткой (не зацикленное видео)
Кинематографическая анимация сборки продукта
Градиентные фоны с динамическими элементами
Поддержка нескольких вкусов продукта
Адаптивный дизайн для всех устройств [web:42]

📋 ТРЕБОВАНИЯ:

Компьютер (совместимый с Mac или Windows)
Подключение к интернету
Изображение продукта (любая высококачественная фотография)
10 минут вашего времени

⚙️ КОМАНДЫ ТЕРМИНАЛА:

```bash
npm run build
Создает папку «out», пригодную для развертывания
🎨 ВАРИАНТЫ НАСТРОЙКИ:

Продукты, показанные в руководстве:

Манговый сок (пример Maza)

Вариант голландского шоколада

Вариант рубинового граната

Ваши варианты:

Любой напиток Продукция

Электроника

Косметика

Модные товары

Продукты питания

📱 INSTAGRAM:   / ai.w.raj  
▶️ YouTube:    / @aiwithshreyasraj  
💬 Discord:   / discord  
📚 Курс по ИИ: https://educatexai.com
🌐 Агентство: https://rapidexi.com

💬 Напишите в комментариях "3D WEBSITE", если вы создали такой сайт!

🔔 Подпишитесь на канал, чтобы получать больше уроков по веб-разработке с использованием ИИ!

#AIWebsite #GoogleAntiGravity #3DWebsite #ScrollAnimation #Whisk #FreePik #Netlify #WebDevelopment #NoCode #ProductWebsite #AITools #WebDesign #NextJS #FreeTools

⚠️ ПРЕДУПРЕЖДЕНИЕ: Google Anti-Gravity находится в бета-версии. Для некоторых функций может потребоваться Google One Pro для более высоких лимитов генерации [web:39][web:40].

Создано с помощью:

Google Whisk (3D-рендеринг)

FreePik AI/Ve...