Следующие рекомендации по дизайну помогут обеспечить оптимальное взаимодействие с пользователями, играющими в вашу игру на YouTube на разных устройствах и платформах.
Помимо компонентов операционной системы, пользовательский опыт Playables состоит в основном из трех компонентов:
- Действия играбельных персонажей
- Игровой холст
- Меню и диалоги
Эти лучшие практики игрового дизайна содержат рекомендации о том, как создавать игры для игрового холста.
Изменение размера игры
Принимая во внимание следующие рекомендации, обеспечьте адекватную адаптацию игр к различным размерам и ориентациям экрана.
Измените размер игры и адаптируйте пользовательский интерфейс к размеру и соотношению сторон холста.
Используйте эффекты "pillarboxing" или "letterboxing", если игра не может полностью адаптироваться к размеру и соотношению сторон игрового холста.
Избегайте появления полос прокрутки. Полосы прокрутки негативно влияют как на игровой процесс, так и на общую навигацию. Заполняйте холст, не допуская прокрутки игры внутри него. Полосы прокрутки допустимы для целенаправленной прокрутки, например, при прокрутке длинного вертикального списка в пользовательском интерфейсе игры. В идеале игры должны полностью адаптироваться к размеру области просмотра.
Масштабирование игры
Отображение должно быть четким (без размытия, пикселизации или растяжения) на экранах с различным разрешением.
Убедитесь, что пользовательский интерфейс игры (текст, значки) корректно масштабируется при отображении как на экранах с низким разрешением (например, на мобильных устройствах с разрешением 360x800), так и на экранах с высоким разрешением (например, на настольных мониторах с разрешением 3840x2560).
Избегайте растровых изображений низкого разрешения, которые выглядят размытыми при масштабировании на большие экраны.
Типография
Обеспечьте удобочитаемость на всех устройствах и при различных размерах экрана.
Текст, отображаемый в игре, такой как кнопки, меню и диалоговые облачка, должен быть читаемым на разных устройствах и размерах экрана. Этого можно добиться путем автоматического масштабирования и адаптации текста или путем предоставления пользователям возможности регулировать размер шрифта.
Если текст имеет размер менее 18 пунктов или если текст выделен жирным шрифтом и имеет размер менее 14 пунктов, установите коэффициент контрастности цвета не менее 4,5:1.
Для всего остального текста установите коэффициент контрастности цвета не менее 3:1.
Для получения общей информации см. WCAG2.1 .
 |  |
| Используйте крупный шрифт с достаточной толщиной и контрастом для хорошей читаемости. В этом примере коэффициент контрастности составляет 4,48:1. | Избегайте мелкого шрифта и цветов с низкой контрастностью. В этом примере коэффициент контрастности составляет 3,07:1. |
Взаимодействие
В этом разделе рассматриваются лучшие практики взаимодействия с пользователями и связанные с этим элементы.
Позиции касания
Сделайте сенсорные элементы достаточно большими для более удобного взаимодействия.
Для облегчения взаимодействия убедитесь, что сенсорные элементы имеют размер не менее 48x48 точек на дюйм и расстояние между ними не менее 8 точек на дюйм (см. Рекомендации по Material Design ).
В этом примере визуально отображаемая кнопка имеет размер 24 dp, в то время как невидимая область касания включает 12 dp вокруг значка, чтобы получить область касания размером 48x48 dp.
Добавьте отступы вокруг значков и кнопок, чтобы увеличить размер области касания.
Кнопки
Используйте уникальные стили для каждого состояния кнопки:
- Включено
- Неполноценный
- Наведение курсора (для устройств ввода без сенсорного экрана)
- Целенаправленный
- Нажатый
Старайтесь также различать кнопки по иерархическому принципу. Например, основные и второстепенные кнопки действий в меню «Пуск» (см. рекомендации Google по дизайну Material 2 для кнопок ).
Уникальные стили, отличающие каждое состояние кнопки.
Ввод с клавиатуры
Для повышения доступности игры на разных устройствах и для разных пользователей, помимо сенсорного ввода и ввода с помощью мыши, предусмотрена поддержка ввода с клавиатуры для всех элементов управления игровым процессом и навигации по экрану.
Для игр, поддерживающих ввод с клавиатуры, разрешите пользователям закрывать любые внутриигровые меню и диалоги с помощью клавиши Esc . Это должно дополнять наличие визуальной кнопки закрытия (например, значка «X» в верхнем углу). Типичные примеры модальных окон или диалогов: меню настроек , меню паузы , сообщения об ошибках и всплывающие окна справки .
Не следует назначать какие-либо действия на длительное нажатие клавиши Esc , поскольку она используется для выхода из полноэкранного режима в веб-браузерах на настольных компьютерах.
Для игр, в которых зарегистрированы обработчики событий нажатия клавиш: не используйте preventDefault() с событиями нажатия клавиши Esc . В полноэкранном режиме Safari это приводит к тому, что событие нажатия клавиши обрабатывается игрой без выхода из полноэкранного режима.
Тактильные ощущения
При необходимости рекомендуется использовать тактильную обратную связь (вибрацию), чтобы сделать ваши игры более увлекательными и захватывающими.
Ключевые моменты игры
В этом разделе рассматриваются ключевые моменты игры, которые создают незабываемые впечатления для игрока.
Учебное пособие
Включите краткое обучающее видео или вводный курс, чтобы помочь новым игрокам.
Вводный инструктаж гарантирует, что пользователи освоят основные элементы игрового процесса и необходимые для дальнейшего прохождения игры и получения от нее удовольствия.
Поскольку игровые автоматы созданы для быстрого и удобного начала игры, старайтесь свести процесс обучения к минимуму. Хотя не все игры требуют обучения, большинству игр полезно какое-либо вводное обучение. Учитывайте ключевые механики, правила и навыки, которые игрок должен знать, чтобы успешно играть и получать удовольствие от игры.
Учебные материалы могут быть представлены в следующем формате:
- Набор экранов в начале игры (или, в идеале, контекстно отображаемый на протяжении всей игры по мере необходимости).
- Фактический обучающий уровень, который проходит пользователь.
Пауза
Чётко доносите до пользователя состояние игры.
Четко сообщайте пользователю, когда игра приостановлена, и как он может возобновить игру. Избегайте создания у пользователя впечатления, что игра зависла или вылетела.
Чётко обозначьте состояние игры как «пауза» и предоставьте понятное действие (кнопку) для возобновления игры.
Конец игры
Сообщите пользователю, что он прошёл последний уровень или завершил игру.
Если у игры есть определенный конец (например, конечное число уровней), четко сообщите об этом пользователю. Это позволит избежать ситуации, когда у пользователя сложится впечатление, что игра не работает или зависла. В идеале игра должна приветствовать и поздравлять игрока с завершением игры.
Аудио
В игре могут быть отдельные регуляторы громкости для эффектов, речи и фоновой музыки. Регулировка громкости может осуществляться с помощью ползунков или переключателя отключения звука для каждого из этих элементов или для обоих сразу.
Доступность
Доступность дизайна позволяет пользователям с различными возможностями играть и получать удовольствие от вашей игры.
В отличие от веб-дизайна и дизайна программного обеспечения, стандартных отраслевых рекомендаций по доступности для игр не существует. Хорошим источником дополнительных рекомендаций по инклюзивному дизайну игр являются рекомендации по доступности игр . Мы рекомендуем вам подумать, как эти рекомендации могут быть применены к дизайну вашей игры.