UX-концепт: мобильная адаптация Jumble

Deliverable фазы 1. Целевая платформа: смартфон, portrait, one-handed. Аудитория — casual
word-games (30+, «уютный» жанр без таймеров). Сессия: 1 уровень = 1–4 минуты. Контент уровней —
английский (слова и каламбуры); весь UI игры — английский; по-русски остаётся только панель читов (инструмент тестирования).

Каждое решение помечено «Почему:» со ссылкой на research (01-research/mobile-word-games-ux.md,
jumble-analysis.md) или анатомию оригинала.

0. Три опоры адаптации (что мы НЕ ломаем)

Двухфазность оригинала сохранена: сначала N слов-анаграмм → потом ответ-каламбур по карикатуре.
Почему: это встроенный ритм «разминка → кульминация» и то, что делает игру именно Jumble.
Just Jumble выбросил фазу слов ради быстрого дофамина и получил главную претензию фанатов
(research §1.1). Мы её оставляем, но адаптируем к экрану 6".
Ввод — tap-to-place + бесплатный Shuffle. Почему: для механики «собери одно конкретное
слово из его же букв» tap-to-place — эталон жанра (research §2, таблица ввода): прощает ошибки,
показывает черновик, масштабируется на длинные слова. Drag и QWERTY отклонены там же.
Карикатура — носитель кульминации и подсказки одновременно: тизер во время слов →
полное раскрытие к фазе ответа. Почему: карикатура в оригинале и есть «ключ» к каламбуру
(jumble-analysis), а постепенное раскрытие превращает её в естественную награду (research §6).

1. Карта экранов

┌─────────┐   tap PLAY    ┌──────────────┐  tap узел  ┌───────────────┐
│  HOME   │ ───────────────▶│  LEVEL MAP   │ ─────────▶ │  GAME: WORDS  │
│ (лого,  │◀─────────────── │ (тропа 1..10)│            │  (фаза слов)  │
│   PLAY) │   назад         └──────────────┘            └───────┬───────┘
└─────────┘                        ▲                            │ все слова решены
                                   │  tap NEXT                  ▼
                            ┌──────┴───────┐  победа   ┌───────────────┐
                            │  WIN / ИТОГ  │◀───────── │  GAME: ANSWER │
                            │  (конфетти)  │           │  (фаза ответа)│
                            └──────────────┘           └───────────────┘

Единственная навигация вперёд — по «тропе уровней». Почему: линейная тропа (как в Wordscapes)
даёт ощущение прогресса и убирает выбор-паралич; узлы 1..10 = сэмплы полной 100-уровневой кривой.

1.1 HOME

╭──────────────────────────╮  ← статус-бар
│                          │
│        J U M B L E        │  зона взгляда
│      (мягкий логотип)     │  (не трогается пальцем)
│                          │
│    🙂  иллюстрация-гэг     │
│                          │
│   ┌──────────────────┐   │
│   │      PLAY  ▶      │   │  ← ЗОНА БОЛЬШОГО ПАЛЬЦА
│   └──────────────────┘   │     (нижняя треть)
│   [🔊]   [💰 250]   [⚙]   │  ← валюта видна с первого экрана
╰──────────────────────────╯

Почему кнопка PLAY в нижней трети: зона уверенного дотягивания большого пальца в portrait
(research §2 — «нижняя половина = интеракции»). Верх экрана — только для взгляда.
Почему счётчик валюты 💰 виден сразу: приучает к существованию мягкой валюты до первого
затыка; в прототипе подсказки бесплатны, но экономика подсказок показана (бриф п.3).

1.2 LEVEL MAP (тропа)

╭──────────────────────────╮
│  ← Назад        💰 250    │
│                          │
│              (10)🔒       │  верх = будущее (вне пальца, ок)
│           (9)🔒           │
│        (8)🔒              │
│     (7)🔒                 │
│  ·······(6)🔒             │
│      (5)🔒                │
│   (4)🔒                   │
│ ·····(3)⭐                │  пройденные — со звёздами
│    (2)⭐                  │
│ ┌──(1)⭐ ТЕКУЩИЙ ●──┐     │  ← активный узел в зоне пальца
│ └──────────────────┘     │
╰──────────────────────────╯

Почему активный узел внизу, «будущие» вверх: прокрутка тропы снизу вверх = метафора
восхождения; тапабельный «текущий» узел всегда под большим пальцем.
Почему замки на будущих уровнях: гарантированная последовательность онбординга —
первая реальная сложность не раньше, чем игрок освоил ввод (research §5).

1.3 GAME — фаза слов

╭──────────────────────────╮
│  ← 💰250    Word 2/3  ⚙  │  прогресс фазы
│ ┌──────────────────────┐ │
│ │  ✓ P A N E   (свёрнут)│ │  решённые слова — компактная полоса
│ └──────────────────────┘ │
│                          │
│   ░░░ КАРИКАТУРА ░░░      │  ТИЗЕР: размыта/частична
│   ░░░ (blur teaser) ░░░   │  зона взгляда
│                          │
│   ┌──┐┌──┐┌──┐┌──┐        │  СЛОТЫ ответа-слова (пусто)
│   │  ││  ││  ││  │        │
│   └──┘└──┘└──┘└──┘        │
│                          │  ← отсюда вниз — ЗОНА ПАЛЬЦА
│   ⓔ ⓣ ⓡ ⓔ               │  ПУЛ перемешанных букв (tap)
│                          │
│   [🔀 Shuffle]  [💡]   │  Shuffle бесплатно + лестница подсказок
╰──────────────────────────╯

Почему одно слово на экране (а не все N сразу): на 6" все 4–5 скрэмблов не читаются;
фокус на одном скрэмбле снижает когнитивную нагрузку (jumble-analysis, «следствия»). Решённые
сворачиваются в полосу сверху — игрок видит накопленный прогресс.
Почему слоты над пулом, пул внизу: цель ввода (слоты) в поле зрения, источник (буквы) под
пальцем; палец не закрывает слово-черновик (антипаттерн drag, research §2).
Почему карикатура-тизер размыта: интрига + мотивация дорешать слова, чтобы «проявить» картинку
(бриф предрешение 3; research §6 — раскрытие как награда).

1.4 GAME — фаза ответа

╭──────────────────────────╮
│  ← 💰250     FINAL  ⚙     │
│                          │
│   ███ КАРИКАТУРА ███      │  РАСКРЫТА полностью (награда)
│   ███ (full color) ███    │
│                          │
│ «What the son took over — │  ПОДПИСЬ-ПОДВОДКА (…)
│  it became an …»          │  заканчивается многоточием
│                          │
│  ┌──┐┌──┐┌──┐┌──┐ ┌──┐┌─┐ │  СЛОТЫ ответа с разбивкой по словам
│  │“ ││  ││  ││ ”│ │  ││ │ │  кавычки вокруг слова-каламбура
│  └──┘└──┘└──┘└──┘ └──┘└─┘ │
│                          │  ← ЗОНА ПАЛЬЦА
│   ⓗ ⓔ ⓘ ⓡ ⓕ ⓞ ...       │  ПУЛ = буквы из кружков
│                          │
│  [🔀]  [💡 Открыть]  [❓шутка]│
╰──────────────────────────╯

Почему подпись заканчивается «…»: ответ грамматически продолжает подпись — это форма
подсказки самого оригинала (jumble-analysis, «Answer here»).
Почему кавычки в слотах: визуально выделяют слово-каламбур («"WADE" A MINUTE»), как в журнале —
сигнал «здесь игра слов». Индексы кавычек берутся из поля surprise.quoted в levels.json.
Почему пул = именно кружковые буквы: прямая передача механики кружков оригинала — игрок
весь уровень видел, как эти буквы «улетали» в буфер (см. флоу §2).

1.5 WIN / ИТОГ

╭──────────────────────────╮
│        🎉 конфетти 🎉      │
│      BRILLIANT!          │  эскалирующая похвала
│                          │
│   ███ карикатура ███      │  финальная сцена + ответ
│  “HEIR FORCE”             │  ответ показан целиком
│                          │
│   +4 💰   (бегущие цифры) │  награда монетами (Peggle-момент)
│                          │  ← ЗОНА ПАЛЬЦА
│   ┌──────────────────┐   │
│   │    NEXT  ▶        │   │
│   └──────────────────┘   │
╰──────────────────────────╯

Почему конфетти + бегущие монеты: «Peggle-момент» завершения (research §6) — эмоциональная
точка, ради которой играют. Кнопка NEXT ведёт назад на тропу к следующему узлу.

2. Детальный флоу уровня (happy-path)

Старт. Тап по узлу тропы → фаза слов. Карикатура появляется как тизер (blur/частичная).
Показан скрэмбл слова 1, пул его букв, пустые слоты.
Решение слова i (tap-to-place):
- Тап по плитке пула → буква занимает первый свободный слот слева; плитка в пуле гаснет.
Почему первый свободный: убирает лишний прицельный тап по конкретному слоту (research §2 —
tap-to-place «выбирает буквы в правильном порядке»).
- Тап по заполненному слоту → буква возвращается в пул. Почему: тривиальная отмена = главное
преимущество tap-to-place над drag.
- Shuffle (🔀) перемешивает буквы пула, слоты не трогает. Почему бесплатно и всегда:
снимает ~80% затыков, охраняет ощущение честности (research §3).
Слово верно (все слоты заполнены и совпали):
- Каскадный «pop» плиток + мягкий звон (research §6).
- Буквы-кружки этого слова подсвечиваются и «улетают» в буфер ответа (визуальный полёт вверх).
Почему: делает видимой связь фаз — игрок накапливает материал для финала (бриф предрешение 4).
- Решённое слово сворачивается в компактную полосу сверху (✓ PANE). Тизер карикатуры чуть
«проявляется» (снижаем blur пропорционально прогрессу — джус раскрытия).
Слово неверно (все слоты заполнены, но не совпало): мягкий shake строки + подсветка,
буквы не сбрасываются. Почему: fail-состояния нет (бриф п.6); ошибка — это приглашение
поправить, а не наказание. Уютный жанр → без screen shake, мягко (research §6).
Повтор 2–4 для слов 2..N.
Переход к фазе ответа (после последнего слова): карикатура раскрывается полностью,
появляется подпись-подводка с «…», слоты перестраиваются под ответ (разбивка по словам,
кавычки каламбура), пул = накопленные кружковые буквы.
Сборка ответа тем же tap-to-place. Верно → фаза WIN (конфетти, ответ целиком, +монеты).

Итого мэппинг на данные: слоты слова i = words[i].answer, пул = words[i].scramble,
кружки = words[i].circles; пул финала = все кружковые буквы, слоты финала = surprise.answer
с разбивкой по словам, кавычки = surprise.quoted, подпись = surprise.caption.

3. Лестница подсказок (по информативности)

Порядок и логика — из research §3 (ценовая лестница: случайное дёшево → выбор дороже → массовое дорого).
В прототипе все бесплатны, но UI, счётчик валюты и цены присутствуют.

Подсказка (подпись в игре)	Когда	Цена (модель полной версии)	Что делает
🔀 Shuffle	всегда, обе фазы	0 (бесплатно)	перемешивает пул
💡 Reveal letter	обе фазы	дёшево (~25)	ставит одну случайную верную букву в слот
🎯 Letter in slot	обе фазы	дороже (~2×)	игрок тапает пустой слот → туда встаёт верная буква
❓ Explain the joke	только фаза ответа	средне	показывает `surprise.explanation` — нарративный хинт
✨ Solve word	обе фазы	дорого / rewarded ad	достраивает всё текущее слово

Почему «Объяснить шутку» отдельной ступенью: это фирменный ход Just Jumble (David's Hints) —
дёшев в производстве, эмоционально тёплый, идеален для карикатурного формата (research §3, §1.1).
Текст берётся прямо из surprise.explanation каждого уровня.
Почему «Решить слово» = дорого/реклама: дефицит валюты (доход 2–4 монеты << цена хинтов)
создаёт спрос IAP/rewarded в полной версии (research §3).

4. Джус и фидбек (спека, без сложной анимации в прототипе)

Событие	Эффект	Источник
Тап по плитке	pop-плитки (scale up→settle с overshoot), haptic-тик, «клик»	research §6 (микро)
Плитка в слот	буква «долетает» с overshoot	research §6
Слово верно	каскадный разлёт + звон; кружки летят в буфер	research §6 + бриф п.4
Слово неверно	короткий мягкий shake строки, без сброса	research §6 (без наказания)
Раскрытие карикатуры	плавное снятие blur к финалу	бриф предрешение 3
Ответ верен	конфетти, фанфары, бегущие монеты (Peggle-момент)	research §6
Похвала	эскалация эпитетов: GREAT! → BRILLIANT! → SPECTACULAR!	research §6

Принцип: джус меняет ощущение, не правила; в уютном жанре — мягкие тёплые эффекты, без
резкого screen shake (research §6).

5. Онбординг (уровень 1) — kinesthetic, без текста правил

Уровень 1 = сам туториал: 1 слово (NAPS), 4 буквы, топ-лексика, ответ прямой (NAP).
Палец-призрак демонстрирует один тап плитки → буква летит в слот; дальше игрок повторяет сам.
Ни одного экрана текстовых правил. Почему: «kinesthetic first», уровень 1 решается <15–30 сек,
первый «word complete» в первые 60 сек FTUE (research §5). Порог сложности сдвинут: декои и
ловушки-анаграммы появляются не раньше L4 (бриф — «гарантированный успех» на старте).
Одна механика за раз: L1 — базовый ввод; L2 — вводится Shuffle; L3 — первая подсказка выдаётся
бесплатно с мягким «попробуй» (обучение трате валюты, research §5).

6. Ошибки и застревание (fail-состояния нет)

Уровень нельзя проиграть — нет таймера, нет лимита попыток. Почему: таймер — антипаттерн
уютного жанра (research §4 п.7; бриф предрешение 5).
Неверное слово при всех заполненных слотах → мягкий shake + подсветка, буквы остаются.
Затык лечится лестницей подсказок (§3), начиная с бесплатного Shuffle.
Мягкий авто-нудж: если игрок 30+ сек не делает верных ходов, кнопка 💡 подсвечивается
(не блокирует, только приглашает). Почему: держит поток без наказания (research §5, §6).

7. Доступность

Плитки ≥ 44 pt (тач-таргет), контраст текста к плитке ≥ 4.5:1. Почему: нижняя граница
комфортного тача (бриф п.7).
Длинные слова/ответы (6+ букв, финал до 12): пул и слоты переносятся в 2 ряда, размер
плитки не уменьшается ниже 44 pt. Почему: L6 (PIER PRESSURE, 12 букв) и L10 не влезают в
один ряд на 6" — перенос обязателен (бриф п.7).
Кружковые буквы в фазе слов помечены и цветом, и обводкой-кружком (не только цветом) —
для дальтоников. Почему: сохранение кружков оригинала + доступность.
Все интеракции — в нижней половине экрана (one-handed portrait).

Соответствие чек-листу брифа

[x] Все экраны описаны и заскетчены; зоны большого пальца размечены (§1).
[x] Каждое решение снабжено «Почему» со ссылкой на research/анатомию оригинала.
[x] Флоу уровня покрывает happy-path (§2) и застревание (§6).
[x] Спека достаточна для сборки прототипа: явный мэппинг экранов на поля levels.json (§2, конец).