4 фичи для инклюзивного дизайна на примере приложения Duolingo

Мы — команда дизайнеров EnAble: Ася, Альбина, Анжелика. Расскажем, как делали приложение Duolingo доступным для дислексиков, как впервые работали с инклюзивностью.

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

Кликабельное содержание:

Авторы: Ася Староверова, Альбина Волос, Анжелика Герман #доступность #дислексия #приложениясдоступностью #цифроваядоступность #инклюзивность

Дислексия — это особенность восприятия информации, при которой наблюдается избирательное нарушение способности к чтению, письму, счёту, музыкальным знакам и пр). При дислексии (и это принципиально важно!) сохраняется общая способность к обучению и другие когнитивные способности.

Мы сфокусировались на следующей проблеме: людям с дислексией трудно изучать английский язык. Определились с аудиторией для следующего этапа исследования: взрослые люди с дислексией, которые изучают или изучали английский язык.

Некоторые пользователи с дислексией оставляли свои комментарии на Reddit, где рассказывали, с какими трудностями они столкнулись в приложении, вот часть из них:

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

Мы проанализировали эти расширения и то, как они работают.

Результатом данного исследования стали практики по улучшению пользовательского опыта для людей с дислексией. Данные фичи легли в основу дальнейшего прототипирования.

У нас не было глубокого и комплексного понимания проблемы дислексии, поэтому мы решили провести нарративные интервью.

Структура нарративного интервью

Примеры вопросов:

- Как интересно! Расскажите об этом подробнее, как историю. Как это было?

- С чего всё началось? Что было потом? Чем закончилось?

- Почему вы выбрали именно этот сервис? Были ли какие-то альтернативы?

- Есть ли какие-то сложности в использовании данного сервиса?

---

Полезные ссылки

---

Мы начали искать респондентов, писали не только людям с дислексией, но и специалистам-логопедам, которые с ними работают. На интервью согласились 4 человека. Вот какие истории нам рассказали:

Главный инсайт, который мы получили — у дислексии много проявлений, нарушения восприятия разные, и нет универсального приёма, который поможет всем. Поэтому мы приняли решение вводить улучшения в приложение по следующим каналам восприятия: визуал и аудирование.

Мы разработали 12 гипотез. С помощью матрицы приоритизации расположили решения от сложных в реализации и невыгодных для бизнеса к простым и выгодным.

Smart Grading — это функция исправления орфографических ошибок при написании слова. Несмотря на то, что эта фича была в сегменте простых и выгодных решений, мы отказались от неё, так как она требовала изменения методики обучения и была сложна в разработке.

Мы были ограничены в ресурсах, разработка некоторых гипотез требовала времени, денег, экспертизы, поэтому мы сфокусировались на следующих 4 гипотезах:

Прототипирование началось с отрисовки экранов «от руки». Экраны были разделены на несколько направлений, с которыми мы работали.

Идея с внедрением подсказок в режиме письма:

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

Кастомизация UI

В интервью респонденты указали на то, что они настраивают внешний вид приложения под себя. Поэтому мы решили дать возможность пользователям Duolingo менять внешний вид приложения: цвет фона и размер шрифта.

Когда мы дошли до отрисовки экранов, возник вопрос, как именно пользователи будут выбирать нужные цвета. Первое, что пришло в голову — это дать возможность неограниченного выбора цвета, как это реализовано в Telegram с палитрой полного спектра.

Затем мы решили отказаться от этой идеи.

Во-первых, из-за парадокса выбора. Чем больше у пользователя вариантов, тем ему сложнее сделать выбор. Подробнее об этом пишет Барри Шварц в своей книге «The Paradox of Choice – Why More Is Less».

Во-вторых, опция безграничного выбора увеличивает количество данных, что ведёт к удорожанию разработки.

Поэтому мы разработали несколько цветовых схем. Каждую из них можно подстроить под себя: поменять цвет фона или бабблов в рамках выбранной палитры. Цветовые сочетания подобраны на основе исследований по влиянию цвета на восприятие информации. Также пользователь может создать свою тему с нуля.

Шрифты для людей с дислексией

У нас было ограничение — лицензия для типографики должна включать в себя распространение на мобильные приложения, чтобы снизить затраты на внедрение фичи.

Мы остановились на выборе ADYS, Arial, Spectral. Согласно рекомендациям Британской Ассоциации Дислексии, шрифты для людей с дислексией, используемые в веб-пространстве, должны быть:

Изменение скорости аудио

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

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

Мы организовали кампанию по поиску респондентов с дислексией.

Модерируемое тестирование проводили с помощью прототипов в Figma, использовали сервисы Useberry и Protopie. Под каждого респондента мы создали чат в Телеграм, запустили демонстрацию экрана и задали вопросы о том, что респонденты видят на экране, какие будут их дальнейшие действия, какое будет взаимодействие с этой кнопкой и т. д.

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

Мысли нескольких наших респондентов:

Каждый человек с дислексией уникален, поэтому кастомизация помогает настроить приложение, учитывая разные потребности. Улучшения для приложения Duolingo упростили людям с дислексией изучение английского языка. И это подтвердили люди с дислексией, логопеды, нейропсихологи, которые отнеслись к этому проекту не как к учебному кейсу, а как к серьёзной и важной работе (так же, как и мы).

Мы бы хотели рассказать о проведённой аналитике, о бизнес-метриках, но это будет, когда мы доберёмся до штаб-квартиры Duolingo (шутка, а может и нет). Во всяком случае, кейс на английский переведён, статья тоже, stay tuned!

Наш UX кейс на Behance

Благодарности: Андрею Горелову, Жанне Одиноковой, Лере Накушновой, Антону Ягупову.

Подписывайтесь на наш Telegram-канал, там мы публикуем полезное про дизайн. Будем держать связь!

Иллюстрации, фотографии и элементы фирменного стиля взяты с сайтов design. duolingo. com и duolingo. com