Главная / Программирование и IT / 3D Кинетическая Сфера: Симуляция в HTML5

3D Кинетическая Сфера: Симуляция в HTML5

Описание промпта

Генерация одностраничной HTML5 игры с 3D физикой и неоновой эстетикой.

Что делает этот промпт

Генерирует интерактивную 3D симуляцию физики частиц в одном HTML файле. Пользователь управляет гравитацией/наклоном контейнера мышью, чтобы удерживать центральную сферу в игре.

Преимущества

Позволяет быстро прототипировать WebGL игры без сборки. Использует легковесную библиотеку p5.js для упрощения работы с 3D графикой и физикой.

Для кого подходит

Фронтенд-разработчики, энтузиасты генеративного искусства, студенты, изучающие WebGL и p5.js.

Инструкция по использованию промпта

Скопируй код в файл index.html. Открой файл в браузере. Двигай мышью, чтобы наклонять виртуальный цилиндр и управлять траекторией сферы. Наблюдай за физикой столкновений и неоновыми следами.

Что нужно предоставить

Требуется современный браузер с поддержкой WebGL. Для запуска достаточно открыть файл в любом браузере, интернет нужен только для загрузки p5.js с CDN.

Что ожидать в результате

Рабочая веб-страница с 3D анимацией. Светящаяся сфера отскакивает от стенок и частиц, частицы оставляют цветные шлейфы. Интерфейс минималистичен, управление интуитивно через мышь.

Рекомендации

Убедись, что устройство поддерживает WebGL. Если p5.js не загружается, проверь подключение к интернету. Код оптимизирован для производительности на средних устройствах.

Ограничения

Физика упрощена (bounding box), что может давать артефакты при высоких скоростях. Не предназначена для мобильных устройств с тач-управлением без дополнительной адаптации.

Промпт открыт для всех. Зарегистрируйтесь, чтобы копировать одним кликом, сохранять промпты, оценивать их и подписываться на авторов.

Текст промпта

ChatGPT / Claude / Llama Войти для копирования

Выступи в роли эксперта по фронтенд-разработке игр, специализирующегося на однофайловых HTML5 проектах. Твоя задача — создать единый файл (index.html) для реализации 3D кинетической арены отскока.

ТРЕБОВАНИЯ К ИГРЕ:

1. Название: Kinetic Bounce Arena.
2. Механика: Запусти светящуюся сферу во вращающийся 3D цилиндр, заполненный 25 физически движущимися частицами.
3. Цель: Удерживай главную сферу в движении, регулируя наклон контейнера через перемещение мыши.

ТЕХНИЧЕСКИЕ ТРЕБОВАНИЯ:

- Формат: Единый файл index.html с встроенным CSS и JS.
- Библиотека: Используй p5.js, загруженный через CDN.
- Рендеринг: Активируй WebGL режим в p5.js. Создай холст 600x600, центрированный на странице.
- Физика: Реализуй обнаружение столкновений 3D bounding box для стен цилиндра и передачу импульса между сферой и частицами. Частицы должны оставлять за собой затухающие цветные следы движения.
- Визуальный стиль: Темная эстетика синтвейв. Используй эmissive неоновые материалы, светящиеся векторы частиц и плавное автоматическое масштабирование камеры.

Напиши полный, рабочий код без внешних зависимостей, кроме указанного CDN.

3D Кинетическая Сфера: Симуляция в HTML5

Поделитесь в социальных сетях

Комментарии