Перейти к содержанию

Skill Editor & Support Stones — UI/UX handoff

Статус: входная UI/UX-спецификация для последующего hi-fi HTML-макета
Платформа: mobile, portrait
Язык документа: русский
Язык демонстрационных UI-строк: English; все строки должны быть локализуемыми
Рабочее расположение: раздел билдкрафта Skills, связанный с системой Real / Fantasy


1. Назначение документа

Документ собирает в одном месте всю подтверждённую информацию о текущем экране скиллов, новые требования к PoE-подобному skill building и применимые решения из предоставленного референса SKILL EDITOR.

Он предназначен как прямой продуктовый вход для будущего HTML-макета. Документ определяет:

  • информационную архитектуру экрана;
  • состав блоков и их приоритет;
  • два отдельных инвентаря — скиллы и support stones;
  • работу сокетов Real и Fantasy;
  • отображение маны и mana cost;
  • tap, equip, switch, drag-and-drop и bulk actions;
  • обязательные modal, empty, locked и error states;
  • границы между подтверждёнными правилами, решениями для макета и открытыми вопросами.

Документ не фиксирует балансные значения, формулы эффектов, количество сокетов в продукте, backend-события или структуру данных.


2. Сводка источников и что из них берём

Источник Подтверждённая информация для этого экрана
gd-knowledge-test/gd/abilities.md, раздел Skills Window Верхние экипированные слоты; skill info popup; Quick Equip; Auto Upgrade; presets; ручной equip; drag-and-drop; правила замены и перестановки скиллов
gd-knowledge-test/gd-generated/abilities-gacha.md От 1 до 5 открытых skill slots; level и shards у скиллов; отдельная прокачка skill-slot; до 5 presets; locked slots
game_design_features/_ux-conventions/skills-select.md + skills-select.png Текущий визуальный скелет: title → equipped row → inventory grid → bulk actions → category tabs; rarity frames; colored/greyed states
gd-knowledge-test/gd/tutorial.md Обязательная последовательность обучения: открыть Skills → Auto Upgrade → Auto/Quick Equip → вернуться в бой
gd-knowledge-test/gd/profile.md Вход в Skills с собственного Hero Screen; отображение активных скиллов; copy build как связанный пользовательский сценарий
game_design_features/twin-cores/TwinCoresUX.md и three-screens-source-summary.ru.md Две стороны билда — Real и Fantasy; одновременно активна одна сторона; после Flip активируется другая; стороны должны различаться не только цветом
ArtifactWindowUX.md и artifacts-stones-uiux-handoff.ru.md Устоявшийся UX для socket target, автофильтра, Stone Info, совместимых drop targets и разделения selected/equipped/upgradeable
Приложенный референс SKILL EDITOR Вертикальная композиция: equipped skills → selected base skill → Real/Fantasy socket rows → нижний inventory → bulk actions
Дополнительные требования от 2026-08-10 PoE-подобные support stones; mana и mana cost; разные stones для Real/Fantasy; эффекты класса Amplify, Efficiency, Split; отдельные inventories для skills и stones

2.1. Что не переносим из референса как готовое правило

Референс задаёт направление композиции, но не является источником продуктовых констант. Следующие элементы нельзя считать утверждёнными только потому, что они нарисованы:

  • Mastery 3 и unlock сокета на Mastery 4;
  • ровно три support sockets на сторону;
  • поле Channels и его механическое значение;
  • конкретные значения Mana +25;
  • надпись Socket order does not matter;
  • точная логика Clear Side и Auto-Fill;
  • уровни, названия и иконки, показанные на референсе.

Для первого HTML эти элементы можно показать как демонстрационные states только с явной пометкой в данных макета, что числа и правила не финальные.


3. Терминология и границы систем

3.1. Base Skill

Основной активный скилл, занимающий один из экипированных skill slots. Он имеет собственные name, icon, rarity, level, shard progress, description, cooldown и base mana cost.

3.2. Support Stone

Камень-модификатор, вставляемый в socket выбранного base skill. Он не является самостоятельным активным скиллом и не занимает верхний skill slot.

Рабочие семейства эффектов:

  • AMPLIFY — усиливает базовый эффект;
  • EFFICIENCY — меняет ресурсную эффективность или mana cost;
  • SPLIT — разделяет действие, цель, projectile или другой поддерживаемый output;
  • будущие эффекты того же класса.

Названия выше задают тип фантазии и UX-подачу. Точные формулы, ограничения и совместимые типы скиллов должны приходить из дизайн-данных.

3.3. Real Stone и Fantasy Stone

Каждый support stone принадлежит одной стороне:

  • REAL stone устанавливается только в Real socket row;
  • FANTASY stone устанавливается только в Fantasy socket row.

Сторона должна кодироваться минимум тремя признаками:

  1. текстовый badge REAL / FANTASY;
  2. отдельная форма или glyph;
  3. отдельная палитра и glow.

Цвет сам по себе не является достаточным различителем.

3.4. Не смешивать с Artifact Stones

В текущем пакете Twin Cores уже описана другая система камней артефакта с шестью типами сокетов: Visible Aspect, Hidden Aspect, Flip Aspect, Visible Law, Hidden Law, Bridge Law.

До отдельного решения геймдизайна:

  • Support Stones в Skill Editor и Artifact Stones считаются разными item families;
  • их inventories, filters, socket compatibility и названия не объединяются;
  • support stone не показывается во вкладке артефактных камней;
  • artifact stone не показывается в инвентаре Skill Editor.

4. Пользовательская задача экрана

За несколько секунд игрок должен понимать:

  1. какие base skills экипированы;
  2. какой base skill сейчас редактируется;
  3. как этот skill ведёт себя в Real и Fantasy;
  4. какие support stones стоят с каждой стороны;
  5. сколько mana стоит cast в каждой стороне;
  6. какие owned skills и stones можно установить;
  7. где доступно улучшение;
  8. какое действие будет выполнено до подтверждения тапа или drop.

Главный UX-принцип: верх экрана отвечает на вопрос «что собрано», середина — «как работает выбранный skill», низ — «из чего я могу собрать или заменить».


5. Карта переходов

Hero Screen / Build navigation
            │
            ▼
      SKILL EDITOR
       │        │
       │        ├── tap base skill ──► SKILL INFO
       │        │                         │
       │        │                         └── EQUIP / SWITCH / UNEQUIP / UPGRADE
       │        │
       │        ├── tap support stone ─► SUPPORT STONE INFO
       │        │                         │
       │        │                         └── USE / SWITCH / REMOVE / UPGRADE
       │        │
       │        ├── PRESETS ───────────► PRESET SELECT / EDIT
       │        └── AUTO UPGRADE ──────► UPGRADE RESULTS
       │
       └── Back ──► previous screen

Skill Gacha остаётся отдельным destination. Наличие новых skills после gacha может давать notification и вести в Skill Editor, но gacha controls не размещаются в этом окне.


6. Общий каркас экрана

Целевая композиция mobile portrait, сверху вниз:

  1. screen-title-banner: SKILL EDITOR или текущее продуктовое SKILLS.
  2. Верхний equipped-row из 1–5 skill slots.
  3. Блок выбранного BASE SKILL.
  4. Две socket rows: REAL и FANTASY.
  5. Переключатель двух inventories: SKILLS / STONES.
  6. Заголовок текущего inventory с filter/sort и выбранным target context.
  7. Вертикальная grid-область inventory.
  8. Контекстная строка bulk actions.
  9. Нижняя навигация проекта либо safe-area/back, в зависимости от способа входа.

6.1. Вертикальный приоритет

  • Equipped row и выбранный skill должны оставаться видимыми без прокрутки.
  • Real/Fantasy rows должны помещаться вместе: нельзя показывать одну сторону и скрывать вторую за fold, потому что сравнение двух миров — центральная задача.
  • Inventory получает оставшуюся высоту и прокручивается вертикально.
  • Bulk actions закреплены под inventory и не уезжают вместе с grid.

6.2. Сохранение контекста

В рамках посещения экран запоминает:

  • выбранный equipped skill slot;
  • активный inventory SKILLS / STONES;
  • выбранную сторону и socket;
  • filter/sort каждого inventory;
  • позицию скролла каждого inventory;
  • открытый preset.

Открытие и закрытие info modal не сбрасывает эти значения.


7. Верхний ряд экипированных скиллов

7.1. Состав

Верхний ряд содержит максимум пять позиций. Число доступных позиций зависит от прогрессии; закрытые слоты остаются видимыми.

Карточка активного слота содержит:

  • icon base skill;
  • rarity frame;
  • LVL N;
  • shard progress current / required;
  • upgrade notification, если доступно улучшение;
  • короткое имя под иконкой;
  • selected-state, если именно этот skill редактируется.

Состояния:

Состояние Визуальное представление Тап
Filled Полноцветная карточка Выбирает skill для центрального editor
Selected Отдельная cyan/gold outline поверх rarity frame Оставляет editor на этом skill
Empty unlocked Empty frame + + Переключает низ на SKILLS и показывает available skills
Locked Greyed frame + lock Показывает условие открытия
Upgradeable Notification arrow/dot Не меняет selected-state; действие доступно в info или Auto Upgrade
Applying Input lock + короткий loader Не принимает новые действия

Selected, Equipped и Upgradeable обязаны иметь разные markers. Rarity frame не может одновременно обозначать одно из этих состояний.

7.2. Поведение

  • При первом входе выбирается первый заполненный slot.
  • Если заполненных slots нет, выбирается первый доступный empty slot, а нижний inventory открывается на SKILLS.
  • Тап по другому filled slot мгновенно меняет central editor без modal.
  • Тап по уже выбранной карточке может открыть Skill Info; в первом HTML это действие должно быть доступно через явную кнопку (i), чтобы не создавать скрытую двойную семантику тапа.

8. Блок BASE SKILL

Блок повторяет иерархию референса, но использует реальные атрибуты продукта.

Обязательные элементы:

  1. Крупная square icon с rarity frame.
  2. Название skill.
  3. LVL skill.
  4. Skill-slot progression — только в текущем термине продукта (SLOT LEVEL, stars или другой подтверждённый label).
  5. COOLDOWN.
  6. BASE MANA.
  7. Кнопка info (i).

8.1. Mastery не подменяет slot level

Референс использует MASTERY, но текущие MD описывают отдельный уровень самого skill slot, усиливающий любой вставленный skill. Пока отдельная mastery-система не определена:

  • не писать MASTERY как готовый продуктовый термин;
  • использовать текущий slot-level/stars;
  • не связывать unlock support sockets с mastery без подтверждённого правила.

8.2. Mana copy

Вместо неоднозначного MANA +25 экран должен показывать итоговую цену cast:

BASE MANA      20
REAL COST      20 → 26
FANTASY COST   20 → 17

Если support stones не изменяют стоимость, показывается одно значение без стрелки. Если цена вычисляется множителями, tooltip раскрывает вклад модификаторов, но основной экран всегда показывает итоговое целое значение, которое игрок реально заплатит.

Skill Crystals, используемые в gacha, не имеют отношения к mana и не должны использовать одинаковую иконку/label.


9. Real / Fantasy socket rows

9.1. Общая модель

Один base skill имеет две параллельные support-конфигурации:

  • Real row применяется, когда активен мир Real;
  • Fantasy row применяется, когда активен мир Fantasy.

После Flip активная support-конфигурация меняется вместе с миром. Сам base skill остаётся в том же верхнем skill slot.

9.2. Анатомия строки

Каждая строка содержит:

  1. Крупный side label REAL / FANTASY.
  2. Ряд support sockets.
  3. Итоговый MANA COST для этой стороны.
  4. Компактный summary результата, например количество projectiles/targets или другой ключевой output, только если такой summary описан данными.
  5. Side info (i) с расшифровкой всех применённых modifiers.

Для первого HTML использовать по три позиции на сторону, потому что это сохраняет композицию референса. Это demo-layout, а не утверждение продуктового лимита. Grid должен поддерживать data-driven количество позиций без смены общей структуры.

9.3. Состояния socket

Состояние Вид Тап
Empty available Side-specific frame + + Выбирает socket, открывает STONES, фильтрует по стороне и совместимости
Filled Иконка stone + side frame Выбирает socket; установленный stone ставится первым в inventory
Selected Усиленный outline + связь с target context Сохраняет filter и target
Locked Lock + короткое условие Показывает unlock tooltip, inventory не меняет
Compatible drag target Пульсация/outline Drop устанавливает или заменяет stone
Incompatible target Приглушение + запрет Drop отменяется без изменения
Applying Loader, input locked Ожидает подтверждённое состояние

9.4. Совместимость

Минимальные правила, видимые игроку:

  • Real stone несовместим с Fantasy socket и наоборот;
  • stone, не поддерживающий выбранный base skill, нельзя установить;
  • причина несовместимости показывается текстом в Support Stone Info;
  • drag подсвечивает только допустимые targets;
  • несовместимый drop не меняет build.

Если stone совместим не со всеми типами skills, inventory не должен просто скрывать причину. По умолчанию несовместимые owned stones остаются в конце списка приглушёнными и имеют короткий reason label.

9.5. Порядок сокетов

Фраза SOCKET ORDER DOES NOT MATTER допускается только после подтверждения, что порядок действительно не влияет на расчёт. До этого первый HTML должен:

  • сохранить стабильный визуальный порядок sockets;
  • не позволять случайную перестановку без явной цели;
  • не заявлять игроку механическое правило, которого нет в источниках.

10. Два отдельных inventory

Нижняя область не является общим смешанным списком. В ней обязательно есть двухпозиционный segmented control:

[ SKILLS ] [ STONES ]

Переключение меняет item taxonomy, filters, grid cells и bulk actions, но не меняет выбранный base skill.

10.1. Inventory SKILLS

Показывает активные base skills и следует текущему экранному паттерну Overlord.

Карточка содержит:

  • icon;
  • rarity frame;
  • level;
  • shard progress;
  • EQUIPPED или номер slot, если skill уже используется;
  • upgrade notification;
  • NEW, если проект действительно имеет непросмотренное состояние;
  • greyed/lock state для ещё недоступного skill, если коллекция показывает полный каталог.

Stable sort по умолчанию:

  1. skill в выбранном slot;
  2. остальные equipped skills;
  3. owned и доступные;
  4. upgradeable внутри своей группы;
  5. locked/unowned в конце, если они показываются.

Действия:

  • tap — Skill Info;
  • drag в empty/filled top slot — equip/switch;
  • horizontal/vertical scroll не должен запускать drag до long press;
  • выбранный в modal EQUIP/SWITCH переводит экран в явный slot-select mode.

10.2. Inventory STONES

Показывает только support stones, не base skills и не artifact stones.

Над grid находится target context:

TARGET: FIREBALL · REAL · SOCKET 2

Если socket не выбран:

SELECT A SOCKET TO FILTER COMPATIBLE STONES

Обязательные filters:

  • ALL;
  • REAL;
  • FANTASY;
  • effect family: AMPLIFY, EFFICIENCY, SPLIT, другие из данных;
  • COMPATIBLE toggle;
  • sort по level/rank, rarity и upgrade readiness, если эти свойства существуют.

Карточка support stone содержит:

  • icon;
  • side badge + side-specific frame;
  • name либо короткий effect label;
  • level/rank, только если progression подтверждена;
  • copies/shard progress, только если применимо;
  • компактный mana modifier, например MANA ×1.20, а не неясное +25;
  • IN SLOT и side/slot marker;
  • upgrade notification;
  • incompatible/locked state с причиной.

Stable sort при выбранном socket:

  1. stone, установленный в target socket;
  2. compatible owned stones нужной стороны;
  3. compatible, но используемые в другом месте;
  4. incompatible owned stones;
  5. locked/unowned stones, если полный каталог должен быть видим.

Действия:

  • tap — Support Stone Info;
  • long press + drag — ускоренная установка;
  • drop в filled compatible socket — замена;
  • drop вне target — отмена;
  • успешная установка сохраняет выбранный skill, side, filter и scroll position.

10.3. Недопустимое смешение

  • Нельзя показывать skill cards и stone cards в одной grid без явного режима.
  • Нельзя использовать одну и ту же рамку без side badge для Real/Fantasy stones.
  • Нельзя называть lower grid SUPPORT STONES, если в ней в этот момент skills.
  • Нельзя автоматически переключать base skill при установке stone.

11. Bulk actions

Bulk actions зависят от активного inventory.

11.1. Для SKILLS

  • QUICK EQUIP — использует текущую логику выбора набора base skills.
  • AUTO UPGRADE — активно только когда хотя бы один skill можно улучшить.
  • PRESETS — открывает выбор/редактирование пресета.

После Auto Upgrade показывается существующий results modal со всеми изменёнными skills и переходом old level → new level.

11.2. Для STONES

  • CLEAR SIDE — очищает только sockets выбранной стороны текущего base skill;
  • AUTO-FILL — заполняет только support sockets выбранной стороны;
  • PRESETS — если support loadout входит в presets после продуктового подтверждения.

QUICK EQUIP и AUTO-FILL не являются одной кнопкой:

  • первая выбирает base skills;
  • вторая подбирает support stones для конкретного skill и side.

Для первого HTML CLEAR SIDE должен показывать confirm, потому что это bulk change:

CLEAR REAL SUPPORTS?
All Real support stones will be removed from Fireball.
[CANCEL] [CLEAR]

Если продукт решит использовать Undo snackbar вместо confirm, макет должен заменить этот state целиком, а не показывать оба одновременно.


12. Skill Info

Skill Info сохраняет текущую структуру проекта и расширяется mana/build summary.

Обязательные элементы:

  1. Popup header + close.
  2. Icon + rarity frame.
  3. Name, rarity, level.
  4. Shard progress и UPGRADE.
  5. Full description.
  6. Cooldown.
  7. Base mana cost.
  8. Краткий summary текущих Real и Fantasy builds.
  9. Контекстная кнопка EQUIP, SWITCH или UNEQUIP.

Существующий источник MD использует слово Remove, а текущий Unity prefab — Unequip. Для нового HTML использовать одно слово последовательно. Рабочий вариант, совпадающий с текущим runtime UI: UNEQUIP.

12.1. Equip flow через modal

После EQUIP или SWITCH:

  1. modal закрывается;
  2. lower inventory остаётся на SKILLS;
  3. остальные inventory cards приглушаются;
  4. доступные top slots пульсируют;
  5. занятые targets явно подписывают, что произойдёт SWITCH;
  6. tap по slot применяет действие;
  7. tap вне области или Back отменяет mode.

13. Support Stone Info

Modal использует визуальный паттерн текущего SkillInfoView, но имеет собственный header SUPPORT STONE.

Обязательные элементы:

  1. Popup header + close.
  2. Крупная icon и side-specific frame.
  3. Name.
  4. Badge REAL / FANTASY.
  5. Effect family, например AMPLIFY.
  6. Полное пользовательское описание эффекта.
  7. Compatibility block: какие skill properties требуются.
  8. Текущий mana modifier.
  9. Preview изменения выбранного skill, если target socket выбран.
  10. Status использования.
  11. Progress и UPGRADE, только если stone progression существует.
  12. Контекстная primary button.

Пример preview без фиксации балансных чисел:

ON FIREBALL · REAL
Damage        current → result
Mana Cost     current → result
Projectiles   current → result

Строка выводится только для параметра, который реально меняет stone.

13.1. Primary action states

Контекст Кнопка
Выбран совместимый empty socket USE
В выбранном socket стоит другой stone SWITCH
Этот stone уже стоит в выбранном socket REMOVE или disabled IN USE; требуется финальное продуктовое решение
Socket не выбран SELECT SOCKET
Выбран socket другой стороны disabled WRONG SIDE
Stone несовместим с base skill disabled INCOMPATIBLE + причина
Stone не принадлежит игроку disabled LOCKED
Применение выполняется disabled + loader

USE и SWITCH являются бесплатными и обратимыми вне боя, поэтому отдельный confirm не нужен.


14. Drag-and-drop rules

14.1. Base skills

Правила из существующего Skills Window сохраняются:

  • unequipped skill → empty slot: equip;
  • equipped skill → empty slot: move;
  • unequipped skill → filled slot: replace;
  • equipped skill → filled slot: swap;
  • drag из top slot за пределы slots: unequip;
  • drag из inventory на пустое место: отмена, без unequip.

14.2. Support stones

  • inventory stone → empty compatible socket: use;
  • inventory stone → filled compatible socket: switch;
  • installed stone → другой совместимый socket той же стороны: move или swap, только если это поддерживается продуктовой моделью;
  • Real ↔ Fantasy drop: запрещён;
  • incompatible skill drop: запрещён;
  • drop вне sockets: отмена;
  • удаление установленного stone выполняется через Support Stone Info, если drag-out создаёт риск случайного разрушения build.

14.3. Разделение scroll и drag

  • До long press движение считается scroll.
  • После long press появляется ghost icon и grid временно блокирует scroll.
  • Compatible targets подсвечиваются до окончания drag.
  • Успешный drop даёт короткую вспышку и haptic tick.
  • Ошибка откатывает preview и показывает snackbar.

Все обязательные действия должны быть доступны тапом; drag — ускорение, а не единственный путь.


15. Presets

Текущая система поддерживает до пяти skill presets. Presets относятся к build персонажа и должны быть доступны из Skill Editor.

Для будущего HTML показать:

  • текущий preset name;
  • dropdown/list до пяти presets;
  • SELECT;
  • EDIT NAME;
  • SAVE CURRENT или явный autosave status;
  • confirm применения, если смена пресета заменяет сразу несколько частей build.

Открытый продуктовый вопрос: должен ли preset сохранять только base skills или также обе support-конфигурации каждого skill. С точки зрения UX ожидаемое поведение — сохранять целый playable build, включая Real и Fantasy; до подтверждения HTML должен маркировать эту часть как provisional.

Presets текущего продукта привязаны к классу. При смене класса editor не должен показывать чужой class preset как активный.


16. Mana states

Введение mana требует новых состояний, даже если сам ресурс отображается в боевом HUD отдельно.

На Skill Editor обязательны:

  • base mana cost;
  • итоговый Real cost;
  • итоговый Fantasy cost;
  • вклад каждого support stone в info/tooltip;
  • warning, если итоговая конфигурация нарушает допустимое ограничение;
  • обновление cost preview до применения stone.

16.1. Недостаточно mana

Skill Editor не должен симулировать бой. Он только объясняет стоимость. Если skill может быть экипирован при стоимости выше текущего max mana, показывается warning, а не обязательно запрет:

Mana Cost 120 · Current Max Mana 100
This skill cannot be cast at your current Mana limit.

Является ли такая конфигурация допустимой, должен решить геймдизайн. До решения HTML показывает warning state, но не придумывает блокировку.

16.2. Что ещё не определено

  • max mana и regeneration;
  • восстановление между casts/сторонами;
  • момент списания mana;
  • поведение при недостатке mana в бою;
  • округление multiplicative modifiers;
  • порядок сложения и умножения нескольких stones;
  • существует ли минимальный mana cost.

Эти вопросы влияют на копирайтинг и breakdown, но не меняют базовую композицию экрана.


17. Empty, locked, loading и error states

17.1. Нет equipped skills

  • Первый available top slot мягко пульсирует.
  • Lower inventory автоматически открыт на SKILLS.
  • Instruction: Choose a Skill to equip.
  • Real/Fantasy rows показываются как inactive preview, без stones.

17.2. Нет support stones

  • Base skill и sockets остаются видимыми.
  • Inventory показывает No Support Stones owned.
  • Источник получения показывается только если он подтверждён продуктом.
  • AUTO-FILL disabled.

17.3. Нет compatible stones

  • Target socket остаётся selected.
  • Incompatible owned stones можно показать ниже приглушёнными с reasons.
  • Empty text: No compatible Real Stones for this Skill.

17.4. Locked skill slot

  • Slot видим всегда.
  • Тап показывает точное условие открытия.
  • Нельзя использовать только серый цвет; нужен lock glyph и text tooltip.

17.5. Locked support socket

  • Позиция socket сохраняется.
  • Lock state показывает condition.
  • Тап не переключает inventory filter на недоступную цель.

17.6. Loading

  • Скелетон или project loader показывается только в изменяемом блоке.
  • Экран не должен исчезать целиком при обновлении одного skill/stone.
  • Во время equip/switch блокируются конфликтующие actions.

17.7. Error

  • Optimistic preview откатывается к последнему подтверждённому build.
  • Показывается штатный snackbar с понятной причиной.
  • Selected skill, side, socket, inventory tab и scroll position сохраняются.

17.8. Max level/rank

  • Progress заменяется MAX LEVEL / MAX RANK.
  • Upgrade button disabled или скрыта по единому правилу проекта.
  • Upgrade notification отсутствует.

18. Tutorial

Существующая последовательность сохраняется и расширяется после открытия support stones.

Базовый tutorial

  1. Открыть Skills.
  2. Нажать AUTO UPGRADE.
  3. Нажать QUICK EQUIP.
  4. Вернуться в бой.

Support Stones tutorial

  1. Выделить первый доступный empty socket на выбранном skill.
  2. Текст: Choose a Support Stone for the Real side.
  3. Переключить lower inventory на STONES автоматически.
  4. Подсветить один гарантированно совместимый stone.
  5. После установки показать изменение Mana Cost и одного ключевого output.
  6. Коротко объяснить: Real and Fantasy use different Support Stones.

Tutorial не должен начинаться, если нет compatible stone или доступного socket.


19. Визуальный язык

19.1. Что сохраняем из текущего Overlord UI

  • Орнаментированный title banner.
  • Тёмно-синие panel backings с золотыми accents.
  • Rarity frames существующих skills.
  • Square inventory cards.
  • Зелёная primary action, синяя secondary action, серая disabled action.
  • Progress bars и notification markers проекта.
  • Popup structure SkillInfoView.
  • Locked = greyed + lock + condition.

19.2. Разделение Real/Fantasy

Рабочее направление:

Сторона Палитра Дополнительный признак
Real cyan/blue angular/technical glyph, более жёсткая frame geometry
Fantasy violet/magenta arcane/flame glyph, более текучая frame geometry

Палитра должна совпадать с уже созданным visual language Twin Cores, а не вводить третью независимую трактовку сторон.

19.3. Иерархия рамок

  • Rarity frame отвечает только за rarity.
  • Side frame/glyph отвечает только за Real/Fantasy.
  • Selected outline отвечает только за текущий target.
  • Equipped badge отвечает только за фактическое использование.
  • Upgrade marker отвечает только за доступное улучшение.

20. Project assets для будущего HTML

Стандартную графику нужно брать из Unity-проекта, а не перерисовывать плоскими CSS прямоугольниками.

Элемент Приоритетный источник
Текущий Skills screen Assets/Prefabs/UI/Skills/SkillsScreenView/SkillsScreenView.prefab
Skill inventory item Assets/Prefabs/UI/Skills/SkillsScreenView/SkillButton_Item.prefab
Equipped skill slot Assets/Prefabs/UI/Skills/SkillsScreenView/SkillButton_Slot.prefab
Skill Info Assets/Prefabs/UI/Skills/SkillInfoView/SkillInfoView.prefab
Auto Upgrade results Assets/Prefabs/UI/Skills/SkillsAutoUpgradeModalView/
Empty/locked frames, +, progress bars Assets/InternalAssets/Sprites/UI/SkillsScreenView/
Shared buttons Assets/Prefabs/UI/Shared/BlueButton.prefab, GreenButton.prefab, GreyButton.prefab
Real/Fantasy language Assets/Sprites/UI/BuildCoreView/ и assets текущих Twin Cores mockups
Support Stone modal precedent SkillInfoView по структуре; не переиспользовать Artifact Stone taxonomy

Целевой design canvas для handoff: 1290 × 2796, portrait. HTML должен сохранять читабельность на более узких portrait viewports без уменьшения tap targets ниже 48×48 dp.


21. Обязательные HTML states

Будущий HTML должен позволять без перезагрузки переключить минимум следующие демонстрационные states:

  1. Skills inventory / default — пять top slots, selected Fireball, оба мира, inventory skills.
  2. Stones / Real target — выбран empty Real socket, inventory отфильтрован.
  3. Stones / Fantasy target — выбран filled Fantasy socket.
  4. Incompatible stone — Wrong Side и несовместимость с base skill.
  5. Locked skill slot.
  6. Locked support socket.
  7. Skill Info / Upgrade available.
  8. Skill Info / Switch mode.
  9. Support Stone Info / Use.
  10. Support Stone Info / Switch.
  11. Support Stone Info / Wrong Side.
  12. Mana warning.
  13. Auto Upgrade results.
  14. Preset select.
  15. No compatible stones.
  16. Applying и Error rollback.

21.1. Demo data rules

  • Все balance values помечаются как demo.
  • Для Amplify, Efficiency, Split используются description placeholders без утверждения финальных формул.
  • Три sockets на сторону — demo-layout.
  • Нельзя использовать Mastery, Channels или Socket order does not matter как финальную UI-copy без отдельного подтверждения.

22. Accessibility и localization

  • Минимальный hit area — 48×48 dp.
  • Side, compatibility и state нельзя кодировать только цветом.
  • Каждая icon-only кнопка имеет accessible label/tooltip.
  • Long press не является единственным способом equip.
  • Dynamic text поддерживает длинные RU/DE строки и не уменьшает font до нечитаемого размера.
  • Названия skills/stones допускают две строки; ключевые values остаются видимыми.
  • Mana icon отличается по silhouette от Skill Crystal.
  • Screen reader order повторяет визуальную иерархию: equipped → selected skill → Real → Fantasy → inventory → actions.
  • Reduced motion отключает пульсации и заменяет их статичной outline.

23. Открытые продуктовые вопросы

Эти вопросы не блокируют сборку layout, но блокируют финальную продуктовую copy и часть интерактивных states.

  1. Сколько support sockets имеет skill на каждой стороне и как они открываются?
  2. Существует ли отдельная Mastery, или используется текущий skill-slot level?
  3. Влияет ли порядок support stones на результат?
  4. Можно ли одну копию stone использовать одновременно в нескольких skills/slots?
  5. Имеют ли support stones rarity, level/rank и duplicate progression?
  6. Какие свойства base skill определяют совместимость с Split, Amplify и другими effects?
  7. Как складываются additive и multiplicative mana modifiers и как они округляются?
  8. Может ли игрок сохранить build, который стоит больше его max mana?
  9. Что происходит в бою при недостатке mana?
  10. Что именно означает Channels на референсе, и нужна ли эта характеристика?
  11. Входит ли support loadout в существующий per-class preset?
  12. Должен ли Quick Equip подбирать только skills, а Auto-Fill — stones, или есть единое действие полного autobuild?
  13. CLEAR SIDE: confirm или Undo snackbar?
  14. Действие по stone, уже стоящему в target: REMOVE или disabled IN USE?
  15. Support Stones и Artifact Stones точно являются разными item families, или планируется общая экономика/коллекция?
  16. Где игрок получает support stones и когда открывается соответствующий inventory?
  17. Сохраняется ли разная support-конфигурация для одного skill во всех presets и классах?

24. Acceptance checklist для UI/UX-макета

  • [ ] Экран узнаваемо продолжает текущий Overlord Skills screen.
  • [ ] Наверху видны все 1–5 skill slots, включая empty и locked.
  • [ ] Selected skill отличается от equipped и upgradeable.
  • [ ] У выбранного skill видны level, slot progression, cooldown и base mana.
  • [ ] Real и Fantasy rows видны одновременно.
  • [ ] У каждой стороны есть собственные sockets и итоговый mana cost.
  • [ ] Real/Fantasy различаются label, glyph/form и color.
  • [ ] Внизу есть два отдельных inventories: SKILLS и STONES.
  • [ ] В одном grid не смешаны base skills и support stones.
  • [ ] Stones inventory показывает выбранный skill/side/socket target.
  • [ ] Amplify, Efficiency, Split представлены как data-driven effect families.
  • [ ] Tap открывает info; drag только ускоряет equip.
  • [ ] Сохранены существующие правила skill equip/move/replace/swap.
  • [ ] Wrong Side и incompatible stone имеют понятную причину.
  • [ ] Quick Equip, Auto Upgrade, Auto-Fill и Clear Side не смешивают семантику.
  • [ ] Skill Info содержит mana и summary двух сторон.
  • [ ] Support Stone Info содержит side, compatibility, mana modifier и result preview.
  • [ ] Preset selector присутствует и помечает provisional support-loadout scope.
  • [ ] Есть empty, locked, max, loading и error states.
  • [ ] UI не утверждает неподтверждённые Mastery, Channels, socket count или order.
  • [ ] Стандартные frames, buttons, progress bars и popups берутся из Unity assets.
  • [ ] Макет работает на canvas 1290 × 2796 и узком portrait viewport.

25. Итоговое направление для будущего HTML

Будущий экран не должен быть просто расширенной сеткой текущих skills. Его структура строится вокруг выбранного base skill:

EQUIPPED SKILLS
      ↓ select
BASE SKILL SUMMARY
      ↓
REAL SUPPORT BUILD + FINAL MANA COST
FANTASY SUPPORT BUILD + FINAL MANA COST
      ↓
SKILLS INVENTORY ↔ SUPPORT STONES INVENTORY
      ↓
CONTEXTUAL BULK ACTIONS

Это сохраняет знакомый equipped-row + inventory-grid паттерн Overlord, добавляет PoE-подобную сборку через sockets и делает различие Real/Fantasy частью читаемого skill build, а не отдельным скрытым меню.


Источники

  • gd-knowledge-test/gd/abilities.md — исходный Skills Window, progression и gacha context.
  • gd-knowledge-test/gd-generated/abilities-gacha.md — текущие slots, presets, equip и upgrade facts.
  • game_design_features/_ux-conventions/skills-select.md и skills-select.png — текущая экранная конвенция.
  • gd-knowledge-test/gd/tutorial.md — tutorial sequence.
  • gd-knowledge-test/gd/profile.md — Hero Screen entry и связанный build flow.
  • game_design_features/twin-cores/TwinCoresUX.md — Real/Fantasy language.
  • game_design_features/twin-cores/three-screens-source-summary.ru.md — правила активной стороны и Flip.
  • game_design_features/twin-cores/ArtifactWindowUX.md — socket/stone UX precedent.
  • game_design_features/twin-cores/artifacts-stones-uiux-handoff.ru.md — current stone modal и inventory interaction precedent.
  • Приложенный screenshot Screenshot 2026-08-10 at 17.30.35.png — композиционный референс SKILL EDITOR.
  • Дополнительные требования пользователя от 2026-08-10.