Гайдлайн по iOS на русском. Часть 20 — Взаимодействие: Haptics

Ruslan Sharipov
6 min readDec 25, 2021

--

Привет. Меня зовут Руслан. Я UX/UI дизайнер в Siemens. У меня есть ютуб-канал, на котором записано несколько плейлистов по основам UX/UI дизайна (лайк, подписка и тд). В этой серии постов я делюсь вольным переводом iOS гайдлайна на русский язык. Как и с переводом Material Design все части будут объеденены в 1 notion документ. Оригинальный источник этой части: здесь.

Тактильное касание (Haptics) использует осязание людей, чтобы улучшить взаимодействие с экранными интерфейсами. Например, система делает тактильные касания в дополнение к аудио и визуальной обратной связи, чтобы акцентировать факт подтверждения транзакции в Apple Pay. Тактильные касания также могут улучшать сенсорные жесты и взаимодействия, такие как прокрутка какой-либо панели или смена состояний у свитчера (переключателя вкл/выкл).

На поддерживаемых моделях iPhone вы можете добавить тактильные касания в свое приложение несколькими способами.

  • Используйте стандартные элементы UI, такие как свитчеры, ползунки и различные панели для выбора, которые по умолчанию имеют встроенные тактильные характеристики, разработанные Apple.
  • Когда это имеет смысл, используйте серию заготовленных шаблонов для тактильной обратной связи, которые лежат в категориях уведомление, воздействие и выделение.
  • В ситуациях, когда вам нужно больше контроля, создавайте и используйте свои кастомные тактильные паттерны.

Когда вы используете системные контролы и тактильные касания, iOS управляет силой и поведением обратной связи. Например, свитчер автоматически воспроизводит едва уловимый эффект нажатия, а выше упомянутый набор из обратной связи для уведомления воспроизводит паттерн “успех”, пример которого показан ниже. Юзеры также понимают тактильные касания, которые заложены в систему, поэтому важно использовать их в соответствии с документацией.

Уведомления

Тактильные касания “уведомления” дают обратную связь о результатах выполнения задачи или действия, например разблокировка транспортного средства.

Успех. Означает, что задача или действие завершены.

https://developer.apple.com/design/human-interface-guidelines/ios/images/haptics/success.mp4

Предупреждение. Означает, что при выполнении задачи или действия произошло предупреждение.

https://developer.apple.com/design/human-interface-guidelines/ios/images/haptics/warning.mp4

Сбой. Означает, что задача или действие завершились неудачно.

https://developer.apple.com/design/human-interface-guidelines/ios/images/haptics/error.mp4

Воздействие

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

Легкое воздействие. Означает столкновение между небольшими или легкими элементами UI.

https://developer.apple.com/design/human-interface-guidelines/ios/images/haptics/impact_light.mp4

Среднее воздействие. Указывает на столкновение между элементами UI среднего размера или среднего веса.

https://developer.apple.com/design/human-interface-guidelines/ios/images/haptics/impact_medium.mp4

Тяжелое воздействие. Указывает на столкновение между большими или тяжелыми элементами UI.

https://developer.apple.com/design/human-interface-guidelines/ios/images/haptics/impact_heavy.mp4

Жесткое воздействие. Указывает на столкновение между жесткими или негибкими элементами UI.

https://developer.apple.com/design/human-interface-guidelines/ios/images/haptics/impact_rigid_sound.mp4

Мягкое. Указывает на столкновение между мягкими или гибкими элементами UI.

https://developer.apple.com/design/human-interface-guidelines/ios/images/haptics/impact_soft_sound.mp4

Выделение

Тактильные касания “выделение” дают обратную связь при изменении значений элемента UI.

Выбор. Указывает, что значения UI элемента изменяются.

https://developer.apple.com/design/human-interface-guidelines/ios/images/haptics/retarget.mp4

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

Проектирование и Haptics

Разработка интерфейсов, которые задействуют осязание людей, может передать параллель с физическим миром с вашим приложением. Независимо от того, как вы создаете тактильные касания в своем приложении, следующие рекомендации помогут вам дать людям полноценный и привлекательный опыт.

Постройте четкую причинно-следственную связь между каждым тактильным касанием и ее триггером. В идеале, люди всегда должны считывать то, почему ваше приложение воспроизводит какой-либо тактильный паттерн. Если тактильное касание не усиливает причинно-следственную связь, оно может сбить с толку и показаться необоснованным.

Используйте тактильные касания таким образом, чтобы дополнять другие виды обратной связи в вашем приложении. Когда визуальная, аудио и тактильная обратные связи вашего приложения находятся в гармонии — как это происходит в физическом мире, — пользовательский интерфейс становится более согласованным и может ощущаться более естественно.

Разумно используйте тактильные касания. Например, используйте тактильные касания, когда они обеспечивают постоянную ценность для юзера; использование их для добавления “лишь бы было” или какой-то новизны может только усложнить ваше приложение. Кроме того, предпочитайте добавлять тактильные касания к небольшому количеству взаимодействий, которые последовательны и важны в UI. Воспроизведение тактильных касания в большом количестве для обычных взаимодействий может ошеломить ваших юзеров.

Консистентность в тактильной обратной связи помогает людям развивать ассоциации между определенными тактильными паттернами и определенным опытом. Например, если ваше приложение воспроизводит определенный тактильный паттерн, когда игровой персонаж просто стоит, люди учатся связывать этот паттерн с чем-то что неприятным и напоминающим что пора проходить миссию. Если вы используете точно такой же тактильный паттерн и для положительного результата, например для завершение уровня, люди будут сбиты с толку.

Избегайте чрезмерного использования тактильных касаний. Иногда тактильные касания могут казаться вполне уместны, когда их испытываешь время от времени, но они становятся утомительными, когда их испытываешь слишком часто. В общем, избегайте ситуаций, в которых вы долго или слишком часто используете тактильную обратную связь. Часто лучший тактильный опыт — это тот, который люди могут не осознавать, но пропустить, когда он выключен.

Убедитесь, что вы протестировали haptics в своем приложении. У разных людей разные предпочтения и уровни чувствительности к haptics, поэтому вам нужно протестировать тактильные касания с как можно большим количеством людей.

Сделайте тактильные касания необязательными. Позвольте людям отключить или заглушить тактильные касания, если они того пожелают, и убедитесь, что люди все еще могут наслаждаться вашим приложением без них.

Проектируя игры, рассмотрите как вы можете использовать кастомные тактильные касания для улучшения опыта у игроков. В дополнение тем тактильным касаниям, что игроки получают когда взаимодействуют с предметами и элементами управления, вы можете захотеть создать кастомные в тактильные касания, которые помогут игрокам узнать или сообщить им о событиях в игре. Например, тактильные касания могут усиливать какие-то ситуации или переживания — такие как столкновение или удары — или более легкие намеки, такие как приближение чьих-то шагов или надвигающаяся опасность.

Имейте в виду, что воспроизведение haptics может повлиять на другие пользовательские впечатления. По изначальному замыслу, тактильные касания создают достаточную физическую силу, чтобы люди могли чувствовать вибрацию устройства. Так что убедитесь, что тактильные касания не нарушают работу пользователя с камерой, гироскопом или микрофоном.

Создавая кастомные паттерны для Haptics

Кастомные тактильный паттерн может отражать и имитировать разные вещи. Эти шаблоны также могут динамически меняться в зависимости от пользовательского ввода или контекста. Например, имитировать воздействие, которое игроки испытывают, когда игровой персонаж прыгает с дерева, может быть сильнее, чем когда персонаж прыгает на месте.

В iOS 13 и более поздних версиях Core Haptics есть два основных блока, которые помогут сгенерировать вам кастомные тактильные шаблоны:

  • Переходные события, которые представляют собой краткие, компактные события, которые ощущаются как прикосновения или импульсы, такие как нажатие кнопки “Фонарик” на главном экране
  • Непрерывные события, которые ощущаются как устойчивые вибрации

Независимо от того, какой строительный блок вы выберете для создания кастомного тактильного касания, вы также можете контролировать его четкость и интенсивность.

Слева — четкость. Справа — интенсивность.

Можете думать о резкости как об абстракции для передачи тактильного опыта в форму волны, которая вызывает соответствующие физические ощущения. Регулируя уровень резкости, вы можете передать системе такой сигнал, который вам нужен для получения собственного опыта. Например, вы можете использовать значения резкости, чтобы передать ощущение мягкости, округлости и органичности, или наоборот четкости, точности или механичности в контексте пропорций и какой-то формы которая бы ощущался тактильно, если проще — будто руками. Что же касается интенсивности, то как и следует из этого термина, интенсивность означает просто силу тактильного ощущения.

Комбинируя временные и непрерывные события, различную резкость и интенсивность, а также дополняя это аудио, вы можете создать широкий спектр собственных тактильных касаний.

--

--