Playroom: ретро-аркада в 3D для браузера

Создайте полноценную игровую браузерную аркаду под названием «Playroom» с ностальгической эстетикой аппаратуры конца 1980-х и сдержанным современным редакционным интерфейсом. Используйте Three.js для рендеринга и загрузите отдельные GLB-ассеты для CRT-монитора, консоли, контроллера и игровых картриджей. Результатом должен стать рабочий интерактивный проект, а не статичный макет. Арт-дирекцию постройте на тёплом молочно-белом фоне, состаренном пластике цвета слоновой кости, угольно-чёрных деталях, приглушённом шалфейно-зелёном, пыльно-терракотовом и выцветшем синем цветах. Сочетайте заголовки Space Grotesk с небольшими подписями DM Mono. Добавьте тонкие разделительные линии, много свободного пространства, ненавязчивые технические аннотации и компактную навигацию. Избегайте неоновой киберпанк-стилистики, глянцевых карточек в духе дашбордов и чрезмерного использования градиентов. Главная страница должна напоминать тщательно скомпонованную предметную фотографию. Разместите CRT-монитор на видном месте справа, консоль — слева, вертикально установленный картридж — надёжно вставленным в консоль, а контроллер — на переднем плане. Соедините устройства изогнутыми кабелями, подключёнными к настоящим разъёмам. Используйте мягкий направленный свет, правдоподобные контактные тени, скруглённые края и слегка шероховатые пластиковые материалы. Не допускайте пересечений объектов. Добавьте на главную страницу медленное кинематографичное орбитальное движение из стороны в сторону. Позвольте пользователям вращать вид перетаскиванием, после чего плавно возобновляйте автоматическое движение. Добавьте сдержанные медленно перемещающиеся импульсы данных вокруг выбранных деталей аппаратуры. На CRT-мониторе должна циклично воспроизводиться сцена ожидания в пиксель-арте с небольшим маскотом, ненавязчивыми строками развёртки и надписью «PLAYER ONE». Точно используйте предоставленные логотипы — жёлтую T и белую V — на лицах маскотов. Заметная кнопка «POWER ON» или нажатие на сцену с консолью должны запускать один непрерывный переход. Плавно приблизьте камеру к экрану CRT, добавьте анимированный поток данных и постепенно расширяйте сцену до заполнения всего окна просмотра. На всём протяжении перехода закрывайте верхний и нижний края. Покажите коллекцию картриджей с помощью плавного перехода от тёмного к светлому, без внезапно появляющегося оверлея и резкого скачка камеры. В коллекции должно быть три разных вертикально установленных картриджа: зелёный шалфейный Snake, терракотовый Breakout и синий Blocks. На каждом — чёткая типографика на обложке и небольшой анимированный маскот, сидящий сверху. Используйте лёгкое покачивание, приподнимание при наведении и мягкий наклон. Поддержите как нажатие на 3D-картриджи, так и доступные текстовые кнопки под ними. Каждый выбор должен открывать игровой интерфейс. В Snake добавьте цепочки еды и бонусные фрукты с ограниченным временем действия. В Breakout — несколько вариантов раскладки кирпичей и усилители ракетки или мультишара. В Blocks — предпросмотр следующей фигуры, призрачное отображение места приземления и начисление очков за очистку линий. Предусмотрите понятные инструкции, счёт, паузу, перезапуск и навигацию для возврата. Поддержите управление с клавиатуры и сенсорные кнопки, а также сохранение локального лучшего результата. Храните содержимое экранов и подписи на картриджах в отдельных текстурах, создаваемых во время работы приложения, чтобы текст оставался чётким. Сохраните именованные части моделей для взаимодействия и анимации маскотов. Добавьте индикацию загрузки, рабочий резервный режим на случай сбоя загрузки 3D-ассетов, адаптивные макеты, видимый фокус клавиатуры и поддержку режима уменьшенного движения. Организуйте проект аккуратно, проверьте все три игры и переходы и подготовьте его к развёртыванию на GitHub и Vercel.