RDance - Dance Simulator

Интерактивный симулятор танца с управляемым скелетом, созданный с использованием библиотеки p5.js. Проект полностью автономный - все библиотеки включены в исходный код.

Описание

Этот проект демонстрирует симулятор танца, где пользователь может управлять скелетом танцора с помощью клавиатуры. Скелет представлен в виде каркаса с опорными точками (суставами) и костями, что позволяет создавать реалистичные танцевальные движения.

Особенности

🕺 Интерактивный скелет - полная система управления танцором
🎯 Реалистичные пропорции - правильно подобранные размеры костей
🖥️ Полноэкранный режим - погружение в танцевальную визуализацию
⌨️ Интуитивное управление - простое управление с клавиатуры
📱 Адаптивный дизайн - работает на разных размерах экрана
🎨 Чистая визуализация - белые кости на темном фоне с белым полом

Как запустить

Скачайте все файлы проекта
Откройте файл index.html в веб-браузере
Управляйте танцором с помощью клавиатуры!

Управление

Основные движения

W - движение вперед
S - движение назад
A - движение влево
D - движение вправо

Повороты туловища

Q - поворот туловища влево
E - поворот туловища вправо

Руки

↑ - поднять левую руку
↓ - опустить левую руку
← - поднять правую руку
→ - опустить правую руку

Ноги

I - левая нога вперед
K - левая нога назад
J - правая нога вперед
L - правая нога назад

Интерфейс

Enter - переключение полноэкранного режима
Esc - выход из полноэкранного режима
Пробел - пауза/продолжение анимации
R - сброс к начальной позе

Кнопки

Сброс - возврат к начальной позе
Пауза - остановка/возобновление анимации
Полный экран - переключение полноэкранного режима

Структура скелета

Опорные точки (суставы)

Ступни (левая и правая) - точки опоры на полу
Колени (левое и правое) - соединение бедра и голени
Таз - центральная точка скелета
Основание шеи - соединение позвоночника и плеч
Плечи (левое и правое) - основание рук
Локти (левый и правый) - соединение плеча и предплечья
Кисти (левая и правая) - концы рук
Голова - верхняя точка скелета

Кости

Бедра - от таза до колен (80px)
Голени - от колен до ступней (70px)
Позвоночник - от таза до основания шеи (100px)
Плечи - от шеи до плечевых суставов (40px)
Плечевые кости - от плеч до локтей (60px)
Предплечья - от локтей до кистей (50px)
Шея - от основания шеи до головы (30px)

Технические детали

Структура проекта

RDance/
├── index.html      # Основная HTML страница
├── style.css       # Стили и адаптивный дизайн
├── sketch.js       # Основная логика p5.js
├── p5.min.js       # Библиотека p5.js (локальная копия)
└── README.md       # Документация

Система состояния скелета

Каждый скелет хранит свое состояние в виде:

Позиция таза (x, y) - центральная точка скелета
Угол наклона туловища - наклон позвоночника
Углы костей - относительные углы всех костей

Алгоритм отрисовки

Вычисление позиций - на основе состояния вычисляются координаты всех суставов
Отрисовка костей - белые линии соединяют суставы
Отрисовка суставов - белые круги отмечают точки соединения

Настройка

Вы можете легко изменить параметры симулятора, отредактировав константы в файле sketch.js:

// Размеры костей (в пикселях)
this.boneLengths = {
    thigh: 80,        // бедро
    shin: 70,         // голень
    spine: 100,       // позвоночник
    // ... и т.д.
};

// Скорости движения
const speed = 2;        // Скорость движения таза
const angleSpeed = 3;   // Скорость поворота костей

Требования

Современный веб-браузер с поддержкой HTML5 и JavaScript
Никаких внешних зависимостей - все библиотеки включены в проект

Преимущества автономной версии

✅ Работает без интернета - можно использовать офлайн
✅ Быстрая загрузка - нет задержек на загрузку внешних библиотек
✅ Надежность - не зависит от внешних CDN сервисов
✅ Портативность - весь код в одном месте

Планы развития

🎵 Синхронизация с музыкой
💃 Предустановленные танцевальные движения
🎨 Улучшенная визуализация (мышцы, одежда)
🤝 Мультиплеер для танцевальных батлов
📱 Поддержка сенсорного управления

Лицензия

Этот проект создан в образовательных целях и свободен для использования.

romannep/rmuzviz