Проектируя сервис для ребят с ментальными особенностями, мы поняли простую вещь: в инклюзивном дизайне важны внимание и эмпатия, а не сложные метафоры, паттерны или креатив ради креатива. В статье рассказываем, какие особенности мы учитывали, какие решения нашли в интерфейсе и какие принципы помогают делать продукты понятными всем пользователям.
Привет! Я Макс Смирнов, дизайн-директор JetStyle, работаю здесь вот уже 15 лет. Много преподаю, выступаю на отраслевых конференциях, являюсь одним из соорганизаторов Уральского дизайн-комьюнити. Эта статья выросла из моего выступления об инклюзивном дизайне интерфейсов — надеюсь, вам будет интересно.
Уже 20 лет JetStyle делает цифровые продукты для разных аудиторий, и за это время мы много работали с инклюзивными проектами. Среди них:
Именно последний проект — «Тренер в кармане» — стал основой этой статьи.
Special Olympics — международное движение, которое проводит спортивные мероприятия для людей с интеллектуальными особенностями и помогает им интегрироваться в общество.
Мы работали с ДИСпО-центром — региональной организацией, представляющей Специальную Олимпиаду в Свердловской области.
Весной 2020 года, когда все оказались на самоизоляции, занятия спортом и общение оказались практически недоступны. Для подростков с ментальными особенностями это стало особенно тяжелым: пропала возможность тренироваться с наставниками и поддерживать привычный ритм.
Чтобы помочь ребятам, тренеры начали записывать видео с упражнениями и рассылать их в WhatsApp и во ВКонтакте. Но такой формат быстро стал неудобным — нужен был единый, доступный и понятный всем онлайн-сервис.
Заказчик изучил международный опыт и отметил успешный пример коллег из Нидерландов — приложение для домашних тренировок. Наша задача звучала так:
Разработать сервис с элементами геймификации, который поможет детям и подросткам с ментальными особенностями, а именно с расстройствами аутического спектра (РАС) и синдромом Дауна, самостоятельно тренироваться дома, поддерживать связь с тренерами в условиях самоизоляции из-за эпидемии коронавируса и сохранять оптимизм.
Мы сделали адаптивный веб-сервис с простой и понятной навигацией. В нём можно проходить тренировки, выполнять дополнительные задания, читать материалы про питание и отслеживать прогресс на доске наград. Связаться с тренером можно в один клик — это оказалось важным для мотивации ребят.
Мы выбрали веб-формат, а не мобильное приложение. Анализ аудитории показал, что у многих подопечных центра нет личных смартфонов, но есть доступ к компьютеру. Веб-версия стала самым доступным вариантом для всех пользователей.
Чтобы сделать сервис более дружелюбным, мы придумали маскота — рысь. Персонаж сопровождает спортсмена по интерфейсу: указывает на важные элементы, подсказывает, как выполнять задания, и поддерживает на каждом шаге. Это снижает тревожность и помогает сформировать привычку возвращаться к сервису.
Чтобы спроектировать корректный опыт, важно понимать, как пользователи воспринимают информацию и какие особенности влияют на взаимодействие с интерфейсом.
РАС — это группа состояний, которые могут влиять на коммуникацию, внимание, сенсорную чувствительность и реакцию на изменения. У разных людей проявления отличаются, поэтому универсальных сценариев почти не бывает.
По оценкам международных организаций, люди с РАС — около 1% населения.
Синдром Дауна — одно из распространённых генетических состояний, которое влияет на развитие и может сопровождаться особенностями восприятия информации, речи и внимания.
По мировым данным, его распространённость — около 0,1%.
При правильном подходе к обучению с детства люди с РАС и синдромом Дауна могут стать полноценными членами общества, а занятия спортом этому только способствуют.
Если не говорить про узкоспецилизированные продукты для конкретной аудитории, то инклюзивный дизайн — это то, что позволяет максимально большому количеству людей пользоваться продуктом.
Это не значит, что при этом сам продукт должен быть суперуниверсальным — это значит, что у каждой из целевых аудиторий, в том числе у людей с особенностями здоровья, должна быть возможность настроить и использовать те каналы взаимодействия с продуктом, которые им удобны.
Чаще всего говорят о доступности для людей с нарушениями зрения, слуха или моторики. Но не менее важны особенности когнитивного и эмоционального восприятия — именно они определяют, насколько комфортно пользователю с ментальными особенностями взаимодействовать с сервисом.
При работе над проектом мы опирались на исследования о восприятии и поведении пользователей с РАС и синдромом Дауна. Ниже — ключевые особенности, которые напрямую влияют на работу с интерфейсами, и решения, которые мы применили.
Пользователям с РАС может быть некомфортно, когда люди и даже персонажи на изображениях «смотрят» напрямую.
Решение в интерфейсе:
мы использовали персонажей с мягкой, непрямой направленностью взгляда. Аватары и маскот всегда смотрят в сторону, не создавая ощущения «давления».
Многие воспринимают все звуки сразу — и фоновый шум мешает фокусироваться.
Решение:
в тренировочных видео — только голос тренера и мягкая музыка. Дополнительно есть возможность полностью отключить звук.
Если показать упражнение один раз, пользователь не повторит его в нужном количестве.
Решение:
видео повторяет движение столько раз, сколько требуется. Плюс мы добавили прогресс-бары:
Наша система сама подберет вам исполнителей на услуги, связанные с разработкой сайта или приложения, поисковой оптимизацией, контекстной рекламой, маркетингом, SMM и PR.
Заполнить заявку
13201 тендер
проведено за восемь лет работы нашего сайта.
Резкие изменения в интерфейсе могут вызвать стресс.
Решение:
мы не вводили неожиданных апдейтов и обновляли интерфейс постепенно, сохраняя структуру и визуальные якоря.
Отрицательные формулировки могут восприниматься буквально или не до конца.
Решение:
мы заменили запреты на позитивные рекомендации.Например, вместо «нельзя ставить на паузу дольше чем на 5 минут» — объяснение почему лучше не прерываться надолго.
Метафоры, сложные иконки и абстрактные образы могут быть поняты неправильно.
Решение:
мы использовали максимально прямые визуальные образы, проверяли однозначность иллюстраций – в нашем интерфейсе мы буквально визуализируем то, что написано текстом.
Плюс выбрали шрифт IBM Plex Sans, где буквы и цифры легко различимы.
Это важно, например, для пользователей с синдромом Дауна.
Решение:
видео всегда строится по схеме «сначала объяснение → потом демонстрация движения».
Мы собрали основные рекомендации, которые помогли сделать сервис понятным и комфортным для пользователей с ментальными особенностями. Этот чек-лист подходит и для обычных проектов — он улучшает пользовательский опыт в целом.
Помимо учета особенностей пользователей, мы оптимизировали сервис под реальные условия использования — и это сильно улучшило опыт.
Мы остановились на квадратном формате: он одинаково хорошо работает и на мобильных устройствах, и на больших экранах. Такой формат позволяет занимать максимум полезной площади без сложной адаптации.
Во время тренировки спортсмен видит сразу три показателя: количество подходов, время отдыха и общий прогресс.
Чтобы снизить нагрузку на разработку и ускорить загрузку, два из этих индикаторов встроены прямо в видео. Это также позволяет скачивать ролики и пересылать их без потери функциональности.
Мы использовали возможность современных браузеров добавлять веб-страницу как shortcut на домашний экран телефона.
При запуске такой иконки сервис открывается без браузерной оболочки — пользователь получает почти «приложенческий» опыт без установки приложения.
Тренеры рассказали, что номера телефонов и почтовые адреса у ребят часто меняются. Поэтому мы выбрали авторизацию по логину и паролю — это проще, стабильнее и полностью под контролем наставника. Если возникают сложности, спортсмены связываются с тренерами через удобные для них каналы.
Работая над «Тренером в кармане», мы убедились, что принципы инклюзивности улучшают интерфейсы в целом. Они делают взаимодействие предсказуемым, понятным и спокойным — независимо от того, есть ли у пользователя особенности восприятия или нет.
Инклюзивный подход помогает проектировать продукты, в которых не потеряется никто. И чем раньше он появляется в процессе, тем лучше итоговый опыт.
Если вам интересно обсудить эту тему или поделиться своими наблюдениями — пишите комментарии, мы будем рады диалогу.
Больше статей и полезностей — в нашем основном телеграм-канале, а внутрянки жизни наших дизайнеров — здесь. Подписывайтесь)