YoRHa: Nier Automata — YoRHa UI Build Showcase: интерактивный интерфейс андроидов | Играть онлайн
Итоговый продукт: YoRHa UI Build Showcase
Cover
Обложка: YoRHa UI Build Showcase — ключевой кадр 16:9, созданный в GPT Image 2
Screenshot
Реальная сборка: процесс активов обводит спрайт персонажа, а процесс интерфейса подключает кнопку авторизации
Screenshot
Реальная сборка: ui.speaker_plate выделяется рамкой и раскрывается внутри журнала связи
Screenshot
Готовый терминал: HUD, монитор сигнала, спрайт 2B, список решений, журнал связи, пейджер и поле свободного действия
Sprite
2B — полнотелый рантайм-спрайт, прозрачный PNG (фон удалён с помощью BiRefNet)
Sprite
9S — рантайм-спрайт сканирующего юнита, прозрачный PNG (фон удалён с помощью BiRefNet)
Sprite
A2 — рантайм-спрайт прототипа-дезертира, прозрачный PNG (фон удалён с помощью BiRefNet)
YoRHa UI Build Showcase — это браузерная реконструкция языка интерфейса YoRHa, орбитальной командной системы андроидов, которой подчиняются 2B, 9S и A2. Это не статичный макет. Вы загружаете страницу, и интерфейс всё ещё собирается: автономный курсор летает по экрану, обводит рамкой каждый элемент, называет его и раскрывает шаг за шагом. Сначала фон и освещение, затем поле развёртки и спрайт персонажа, затем HUD, монитор сигнала, кнопка авторизации, диалоговая система, текст истории и, наконец, список решений.
Когда последняя панель замирает, у вас остаётся рабочий терминал YoRHa: цель «спасти сигнал», моноширинный журнал связи с табличкой говорящего и пейджером, три нумерованных решения и поле свободного действия, позволяющее написать собственный следующий шаг. Пепельно-белый цвет, тонкие чёрные рамки и постоянно дрейфующая линия развёртки сохраняют его холодным, тихим и безошибочно андроидным — та же сдержанность, что сделала оригинальный интерфейс незабываемым.
Играть сейчас: Открыть живую систему YoRHa →
Особенности
- Самособирающийся интерфейс — каждый слой HUD отрисовывается у вас на глазах постановочным проходом сборки: эффекты box-draw, scanline, pop, panel и печатной машинки, и каждый помечен собственным именем рантайм-компонента, таким как ui.hud(), ui.signal_monitor или ui.dialogue_system.
- Аутентичный визуальный язык YoRHa — пепельно-белые панели, тонкие чёрные рамки, жёсткие смещённые тени и моноширинный шрифт, удерживаемые дрейфующим полем развёртки. Сдержанность оригинальной ОС андроидов, пересобранная как живая веб-страница.
- Тактическая сцена и свет на спрайте — серо-тоновая подложка руин с собственным полем развёртки и проходом теней удерживает полнотелый спрайт персонажа по центру, читаемым и оформленным как вывод командного дисплея.
- Диалоговая система «Журнал связи» — табличка говорящего, моноширинный текст истории, печатающийся символ за символом, пульсирующее приглашение NEXT и пейджер 1/3. Классический диалоговый блок AVG, говорящий голосом Pod 042.
- Ветвящийся список решений — нумерованная колонка решений (01–03) оформляет сигнал спасения из чёрного ящика как игровой момент визуальной новеллы, готовый управлять любым подключённым нарративным движком.
- Поле свободного действия — введите собственный следующий шаг, переключите вычисление изображения и подтвердите кнопкой расчёта. То же поле, которым интерфейс возвращает управление игроку.
- Браузерный рантайм без установки — чистые HTML, CSS и JavaScript без шага сборки и без загрузки. Откройте ссылку — и терминал загружается сам.
Интерфейс
UI
Фаза сборки 1 — подложка разрушенного Бункера и рамка HUD раскрываются до наполнения терминала
UI
Фаза сборки 2 — процесс активов обводит asset.character_sprite, а процесс интерфейса подключает ui.auth_link
UI
Фаза сборки 3 — журнал связи печатает текст сцены рядом с юнитом номер один
UI
Финальное состояние — полный терминал YoRHa, готовый к решению или свободному действию
BG
Командная палуба Бункера — арт мира, задающий настроение терминала, созданный для мира YoRHa: Nier Automata
BG
Руины города в сумерках — заброшенные башни, разделённые растительностью, поверхностный мир, за которым наблюдает терминал
Процесс производства
Этап 1: Построение мираclaude-opus-5
Одно предложение создаёт мир YoRHa: Nier Automata — 25 карточек атомов: 7 персонажей (2B, 9S, A2, командир White, Паскаль, Адам, Ева), 8 локаций (Бункер, Руины города, Лагерь сопротивления, Деревня машин, Руины парка развлечений, Лесное королевство, Копированный город, Башня), 3 события, 4 записи лора и 3 секрета, каждая со своей обложкой.
Одно предложение создаёт мир YoRHa: Nier Automata — 25 карточек атомов: 7 персонажей (2B, 9S, A2, командир White, Паскаль, Адам, Ева), 8 локаций (Бункер, Руины города, Лагерь сопротивления, Деревня машин, Руины парка развлечений, Лесное королевство, Копированный город, Башня), 3 события, 4 записи лора и 3 секрета, каждая со своей обложкой.
Этап 2: Генерация ассетовgpt-image-2
Полнотелые исходники персонажей, рантайм-фоны 16:9 и ключевой арт обложки генерируются в GPT Image 2. Затем у исходников персонажей удаляется фон до чистых прозрачных PNG с помощью BiRefNet, что даёт сцене набор спрайтов без остатков фона.
Полнотелые исходники персонажей, рантайм-фоны 16:9 и ключевой арт обложки генерируются в GPT Image 2. Затем у исходников персонажей удаляется фон до чистых прозрачных PNG с помощью BiRefNet, что даёт сцене набор спрайтов без остатков фона.
Этап 3: Сборка и публикация интерфейсаclaude-opus-5
HUD YoRHa — строка заголовка, бейдж продукта, монитор сигнала, кнопка авторизации, тактическая сцена, список решений, журнал связи, пейджер и поле свободного действия — собирается как статичное приложение на HTML, CSS и JavaScript, подключается к постановочной анимации сборки с подписями компонентов и публикуется с публичной ссылкой для игры.
HUD YoRHa — строка заголовка, бейдж продукта, монитор сигнала, кнопка авторизации, тактическая сцена, список решений, журнал связи, пейджер и поле свободного действия — собирается как статичное приложение на HTML, CSS и JavaScript, подключается к постановочной анимации сборки с подписями компонентов и публикуется с публичной ссылкой для игры.
Промпты для ассетов
Промпты для ассетов
Промпт мока интерфейсаgpt-image-2
«Создайте макет UI визуальной новеллы 16:9 для подтверждения стиля. Тема: интерфейс сломанного разведывательного терминала YoRHa для трагической научно-фантастической романтической AVG от первого лица 9S. Композиция: пустой фоновый слой с полупрозрачным тактическим диалоговым окном внизу, в правом верхнем углу виджеты статуса Truth Sync, Trust, Alert, ненавязчивые кнопки вариантов, без персонажа, без крупных читаемых логотипов с авторскими правами. Стиль: чёрный, белый, пепельно-серый, тонкие рамки приглушённого золота, бледно-синяя сканирующая сетка, крошечные красные акценты кодов ошибок, постапокалиптический научно-фантастический HUD, элегантная готическая военная сдержанность, повреждённый архив памяти. Текст: только минимальные общие подписи UI, избегайте длинных читаемых абзацев. Ограничения: без водяных знаков, без настоящих брендовых логотипов, без беспорядка, оставьте центр свободным для спрайтов персонажей.»
«Создайте макет UI визуальной новеллы 16:9 для подтверждения стиля. Тема: интерфейс сломанного разведывательного терминала YoRHa для трагической научно-фантастической романтической AVG от первого лица 9S. Композиция: пустой фоновый слой с полупрозрачным тактическим диалоговым окном внизу, в правом верхнем углу виджеты статуса Truth Sync, Trust, Alert, ненавязчивые кнопки вариантов, без персонажа, без крупных читаемых логотипов с авторскими правами. Стиль: чёрный, белый, пепельно-серый, тонкие рамки приглушённого золота, бледно-синяя сканирующая сетка, крошечные красные акценты кодов ошибок, постапокалиптический научно-фантастический HUD, элегантная готическая военная сдержанность, повреждённый архив памяти. Текст: только минимальные общие подписи UI, избегайте длинных читаемых абзацев. Ограничения: без водяных знаков, без настоящих брендовых логотипов, без беспорядка, оставьте центр свободным для спрайтов персонажей.»
Промпт спрайта (2B)gpt-image-2
«@2B / YoRHa No.2 Type B, создайте пригодный для вырезания исходник спрайта персонажа 3:4 для рантайма визуальной новеллы. Тема: 2B стоит, в полный рост до колен, сдержанно-печальное выражение, одна рука у рукояти меча, без боевой атаки, слегка обращена к зрителю, как её видит 9S. Композиция: персонаж по центру, однотонный светло-серый бесшовный фон, весь силуэт виден без обрезки, без текста. Стиль: холодный игровой концепт-арт плюс деликатная трагическая романтическая CG, чёрная готическая боевая форма, белые короткие волосы, тактический визор, стройный силуэт, монохромные чёрно-бело-серые детали с приглушённым золотом. Ограничения: простой фон для удаления фона, без других персонажей, без водяных знаков, без логотипов, без жестокости, держите края чистыми для прозрачного PNG-вырезания.»
«@2B / YoRHa No.2 Type B, создайте пригодный для вырезания исходник спрайта персонажа 3:4 для рантайма визуальной новеллы. Тема: 2B стоит, в полный рост до колен, сдержанно-печальное выражение, одна рука у рукояти меча, без боевой атаки, слегка обращена к зрителю, как её видит 9S. Композиция: персонаж по центру, однотонный светло-серый бесшовный фон, весь силуэт виден без обрезки, без текста. Стиль: холодный игровой концепт-арт плюс деликатная трагическая романтическая CG, чёрная готическая боевая форма, белые короткие волосы, тактический визор, стройный силуэт, монохромные чёрно-бело-серые детали с приглушённым золотом. Ограничения: простой фон для удаления фона, без других персонажей, без водяных знаков, без логотипов, без жестокости, держите края чистыми для прозрачного PNG-вырезания.»
Промпт фона (Руины города)gpt-image-2
«Создайте чистый фон 16:9 для рантайма визуальной новеллы. Сцена: постапокалиптический разрушенный город в сумерках после дождя, заброшенные бетонные башни, разделённые растительностью, разрушенная эстакада, дальняя лунная дымка, небольшое пятно белых цветов на переднем плане, без персонажей. Композиция: широкий план, спокойный читаемый средний план, пустая нижняя треть, подходящая для диалогового UI, центр не перегружен, кинематографическая глубина. Стиль: холодная постапокалиптическая научно-фантастическая атмосфера игрового концепт-арта в духе NieR, пепельно-серый, белый, чёрный, приглушённые золотые блики, пыль и туман, меланхолично и одиноко. Текст: без текста. Ограничения: без людей, без роботов на переднем плане, без водяных знаков, без логотипов, чистый фон, пригодный для рантайма.»
«Создайте чистый фон 16:9 для рантайма визуальной новеллы. Сцена: постапокалиптический разрушенный город в сумерках после дождя, заброшенные бетонные башни, разделённые растительностью, разрушенная эстакада, дальняя лунная дымка, небольшое пятно белых цветов на переднем плане, без персонажей. Композиция: широкий план, спокойный читаемый средний план, пустая нижняя треть, подходящая для диалогового UI, центр не перегружен, кинематографическая глубина. Стиль: холодная постапокалиптическая научно-фантастическая атмосфера игрового концепт-арта в духе NieR, пепельно-серый, белый, чёрный, приглушённые золотые блики, пыль и туман, меланхолично и одиноко. Текст: без текста. Ограничения: без людей, без роботов на переднем плане, без водяных знаков, без логотипов, чистый фон, пригодный для рантайма.»
Промпт фона (Командная палуба Бункера)gpt-image-2
«Создайте чистый рантайм-фон 16:9 для визуальной новеллы. Сцена: орбитальная военная командная палуба андроидов над Землёй, холодный чёрно-бело-серый интерьер, подвесные панели данных, терминал лунного вещания, без персонажей, без логотипов. Композиция: широкий план, нижняя треть и центр читаемы для диалогового UI, сильная глубина, сдержанная готическая научно-фантастическая геометрия. Стиль: мир сломанного разведывательного терминала YoRHa, тонкие огни приглушённого золота, бледно-синее свечение мониторов, одинокое постапокалиптическое военное настроение. Текст: без текста. Ограничения: без читаемых логотипов, без людей, без водяных знаков, чистый фон, пригодный для рантайма.»
«Создайте чистый рантайм-фон 16:9 для визуальной новеллы. Сцена: орбитальная военная командная палуба андроидов над Землёй, холодный чёрно-бело-серый интерьер, подвесные панели данных, терминал лунного вещания, без персонажей, без логотипов. Композиция: широкий план, нижняя треть и центр читаемы для диалогового UI, сильная глубина, сдержанная готическая научно-фантастическая геометрия. Стиль: мир сломанного разведывательного терминала YoRHa, тонкие огни приглушённого золота, бледно-синее свечение мониторов, одинокое постапокалиптическое военное настроение. Текст: без текста. Ограничения: без читаемых логотипов, без людей, без водяных знаков, чистый фон, пригодный для рантайма.»
Промпт фона (Руины парка развлечений)gpt-image-2
«Создайте чистый рантайм-фон 16:9 для трагической научно-фантастической визуальной новеллы. Сцена: заброшенная свадебная сцена в парке развлечений, построенная машинными формами жизни в подражание людям, разбитые огни карусели, бумажные цветы, треснувшая аллея, жуткая часовенная арка, без читаемого текста, без персонажей на переднем плане. Композиция: широкий план с чистой нижней третью для диалогового UI. Стиль: постапокалиптическая машинная меланхолия, пепельно-серый и холодный белый с приглушённой праздничностью, пыль и распад. Текст: без текста. Ограничения: без водяных знаков, без логотипов.»
«Создайте чистый рантайм-фон 16:9 для трагической научно-фантастической визуальной новеллы. Сцена: заброшенная свадебная сцена в парке развлечений, построенная машинными формами жизни в подражание людям, разбитые огни карусели, бумажные цветы, треснувшая аллея, жуткая часовенная арка, без читаемого текста, без персонажей на переднем плане. Композиция: широкий план с чистой нижней третью для диалогового UI. Стиль: постапокалиптическая машинная меланхолия, пепельно-серый и холодный белый с приглушённой праздничностью, пыль и распад. Текст: без текста. Ограничения: без водяных знаков, без логотипов.»
Промпт фона (Копированный город)gpt-image-2
«Создайте чистый рантайм-фон 16:9 для визуальной новеллы. Сцена: белый копированный город, пустая искусственная оболочка человеческого города, резкие минималистичные геометрические здания, глянцевый белый камень, бесконечная бледная пустота, слабые чёрные трещины и цифровой шум, без персонажей. Композиция: широкий план с чистой нижней третью для диалогового UI, сильная перспектива с точкой схода. Стиль: клинический научно-фантастический минимализм, белый и бледно-серый с чёрными тонкими трещинами, тихо и тревожно. Текст: без текста. Ограничения: без людей, без водяных знаков, без логотипов, чистый фон, пригодный для рантайма.»
«Создайте чистый рантайм-фон 16:9 для визуальной новеллы. Сцена: белый копированный город, пустая искусственная оболочка человеческого города, резкие минималистичные геометрические здания, глянцевый белый камень, бесконечная бледная пустота, слабые чёрные трещины и цифровой шум, без персонажей. Композиция: широкий план с чистой нижней третью для диалогового UI, сильная перспектива с точкой схода. Стиль: клинический научно-фантастический минимализм, белый и бледно-серый с чёрными тонкими трещинами, тихо и тревожно. Текст: без текста. Ограничения: без людей, без водяных знаков, без логотипов, чистый фон, пригодный для рантайма.»
Почему Neta Studio
Профессионально — облачная система-обвязка поддерживает весь рабочий процесс от построения мира до генерации ассетов и публикации, всё работает в облаке без локальной настройки. Стабильный доступ к новейшим моделям: Claude Opus 5, GPT Image 2, DeepSeek V3.
Генерация в один клик — официально настроенные навыки ведут каждый шаг: построение мира, дизайн персонажей, генерация арта, вырезание спрайтов и упаковка. Обмен ресурсами при ответвлении мира встроен.
Сообщество прежде всего — пользователи создают неограниченное число миров, и каждый публичный мир можно ответвить, переосмыслить и переработать.
Интерьер студии
‹
›
Studio
Studio
Studio
Начните создавать
Этот интерфейс создан Neta Studio AI из одного предложения. Мир занял минуты, ассеты заняли минуты, и сборка заняла минуты. Вы тоже можете это сделать — адаптируйте этот мир или начните с нуля с любого IP. Программирование не требуется, начать бесплатно.
×