Разбор собственного макета, внешние референсы и три самостоятельных направления. Иллюстрация, движение и интерфейс должны вместе объяснять: здесь у ребёнка есть своя жизнь внутри сказки.
Сохранить: читаемость, заметное «Начать / Продолжить», роль ребёнка и порядок первого входа. Переосмыслить: саму сцену и ритм страницы. Недостатки объясняются моими композиционными решениями; доказательств объяснения через «смену моделей» нет. Живой сайт и вариант второго чата не являются образцом этого обзора.
Каждая карточка содержит снимки реально открытой работы. Переключатели показывают зафиксированные состояния, а не воспроизводят анимацию. Метка «видео» относится к просмотренному видео; метка «живой сайт» — к взаимодействию в браузере. Статичным работам движение не приписывается.
Читатель стоит перед открытым проходом. Спутники заняты общим делом в глубине. Дороги видны за ними. Заголовок и кнопка живут в специально оставленной спокойной области рисунка.
Движение: лёгкая разница скоростей ближних и дальних планов; короткий отклик детали. Текст и действие неподвижны.
Вернувшийся: собственный портрет и закладка занимают место приглашения. Без повторного обучения.
Три эпизода: встреча → чтение и решение → личная комната. Одна рисованная дорога связывает их вместо ряда независимых карточек.
Движение: прокрутка открывает следующий эпизод, иллюстрация меняет глубину. Не перехватываем скролл, не растягиваем заставку.
Чтение: маркетинговая сцена только показывает участие. Полная сказка открывается по отдельному ясному действию.
Большое место действия и несколько дорог вокруг личного входа. Четыре спутника живут в своих местах; ребёнок сохраняет собственный образ.
Движение: раскрытие выбранного места, переход от точки на карте к одной сцене. Комната и находки связаны с путешествием, а не изолированы вкладками.
События: небольшая рисованная афиша в конкретном месте мира. Главный вход в чтение остаётся сильнее.
| Первый экран | Режиссируем единый мастер: место читателя на ближнем плане, четыре спутника в сцене, дальние дороги. Понятное обещание участия и сразу доступное «Начать свою историю»; у вернувшегося — «Продолжить» с названием и закладкой. |
|---|---|
| Новые рисунки | Согласованные планы глубины, отдельный мобильный кадр, сюжетные позы спутников по утверждённым образам, предмет находки и рюкзак, детали комнаты, сезонная афиша. Всё рисуется для конкретного места и размера. Чужие референсы не становятся ассетами Скаски. |
| Интерфейсная анимация | Короткое появление подписи, мягкое раскрытие описания, контур выбора и фокуса, смена приглашения на закладку, перемещение готового нарисованного предмета. Не требуются новые иллюстрации для обычной кнопки или рамки. |
| Мобильная композиция | Вертикальный мастер сохраняет действующих лиц. Кнопка видна сразу; все действия доступны касанием. Никаких важных объяснений только при наведении. Три эпизода идут естественным потоком. |
| Reduced motion | Отключить параллакс, качание, пролёты и автоматические циклы. Показать готовое состояние сцены, сохранить выборы и навигацию. Читаемый текст не движется при любых настройках. Дать отдельное «Остановить движение». |
| Граница этого этапа | Это отбор и проектное направление. Главная сохранена, рабочий сайт не меняется, новые изображения не генерируются, авторское утверждение материалов не присваивается. |
10 конкретных работ. Подтверждено движение у 5: три живых сайта и две видеодемонстрации. Остальные используются как композиционные источники. Снимки сделаны 06.10.2026 в одном видимом браузере, 1440 × 950.
Это ограниченный визуальный просмотр. Мобильное поведение и reduced motion внешних работ не проверялись; выше сформулированы требования к будущему решению. Снимки состояний не являются записью анимации.
Основа направления A: глубина Firewatch, живописность Dordogne, действие Oggy. B: повествовательный переход The Boat и композиция Zajno. C: пространственное единство Bruno, обжитость Garden 1910, окружение Bear.
Снимки внешних работ — свидетельства исследования с прямыми ссылками на авторов и источники. Они не предназначены для использования в продуктовой графике. Подробности и ограничения: REFERENCES.md.