Как испортить приложение и оттолкнуть пользователей. Разбираем и исправляем ошибки в приложении Роскомнадзора

Враждебный UX/UI или пособие по базовым ошибкам разработки

Вы в блоге Heads and Hands — в доме цифровых экосистем и супераппов. Мы их создаем и исследуем, рассказываем про пользовательский опыт и мобильную коммерцию. Вступайте, чтобы быть в курсе и подписывайтесь на наш Telegram-канал.

Роскомнадзор (РКН) ведет цифровую трансформацию: в июне 2020 года ведомство завело Telegram-канал, а в феврале 2021 — запустило свое мобильное приложение. Оно поможет быстрее удалять запрещенный контент из интернета: материалы с пропагандой наркотиков, экстремизма, азартными играми и нелегальной продажей алкоголя. То есть удалять все, что входит в Единый реестр запрещенных сайтов.

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

О чем статья

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

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

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

Ныряем в ошибки по порядку.

Скачать приложение: App Store / Google Play.

1. Кривое масштабирование

Когда приложение РКН появилось в открытом доступе, мы установили его на первый подручный девайс: iPhone SE 1-го поколения, iOS 14.4, экран 4".

По описанию в App Store приложение совместимо со всеми устройствами, которые работают на iOS 12.0 или новее. То есть наш девайс подходит. Поэтому ошибка на первом экране удивляет. Интерфейс приложения отображается криво:

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

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

2. Нефункциональный главный экран

Когда пользователь устанавливает новое приложение, он не знает принцип его работы. Разработчик должен ознакомить пользователя с функциями и разделами приложения. Этого можно не делать, если новый продукт работает по базовым сценариям: например, если на рынке уже есть популярные приложения для заказа такси или продуктов, а разработчик выпускает похожий. Пользователь знает, как работать с таким приложением.

Но, если приложение — уникально для рынка, разработчик должен создавать онбординг. В приложении РКН его нет. Пользователь сразу попадает на главный экран с ошибками, где может выбрать тему оформления «Стандарт» или «Модерн» и перейти в один из разделов: «Единый реестр» или «Информация»:

Как испортить приложение и оттолкнуть пользователей. Разбираем и исправляем ошибки в приложении Роскомнадзора

3. Многоступенчатая навигация

Кнопки на главном экране — это первый шаг в навигации по приложению. В разделе «Единый реестр» открывается экран с кнопками для каждого раздела или панель вкладок в зависимости от выбранной темы:

Как испортить приложение и оттолкнуть пользователей. Разбираем и исправляем ошибки в приложении Роскомнадзора

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

4. Авторизация через Госуслуги

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

5. Формуляр для подачи жалобы

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

Как испортить приложение и оттолкнуть пользователей. Разбираем и исправляем ошибки в приложении Роскомнадзора

При­чина застав­лять пользователя запол­нять все эти поля — устрой­ство базы дан­ных. Такой формат помогает про­грам­ми­сту легко составлять запросы. А кроме большого количества полей есть и другие ошибки:

Как испортить приложение и оттолкнуть пользователей. Разбираем и исправляем ошибки в приложении Роскомнадзора

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

А в конце формы, пользователю нужно вписать неизвестный номер ФСЭМ и приложить акт осмотра. Такую форму не сможет заполнить обычный пользователь или не захочет и просто покинет приложение. Им перестанут пользоваться, а вложения в разработку не окупятся.

6. Нерабочие состояния в «Моих жалобах»

Допустим пользователь сообщил о запрещенном контенте и хочет посмотреть статус жалобы. Он открывает раздел «Мои жалобы» и видит странное поле для поиска по жалобам: кнопка для поиска находится за пределами формы, динамичный поиск по введенному кусочку URL отсутствует, а подсказка сбивает, потому что IP — это и есть адрес.

Если тапнуть по полю для URL или IP адресов — появится русская клавиатура. А чтобы ее скрыть, нужно перейти на другой экран приложения. Правильно в таких случаях предлагать клавиатуру для веб-представлений: с латинскими символами, «https://», «www.», «.» и «/»:

Как испортить приложение и оттолкнуть пользователей. Разбираем и исправляем ошибки в приложении Роскомнадзора

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

7. WebView-формуляр для обратной связи

В приложении работает канал обратной связи. По нему ведомство получило 3 млн жалоб за 8 лет. Чтобы найти этот канал, пользователь нажимает кнопку в разделе «Профиль». Она открывает сайт ведомства через WebView. В этом режиме пользователь переходит по вкладкам, ищет возможность оставить сообщения, выбирает темы обращений в выпадающих списках и в конце получает шанс заполнить формуляр:

Как испортить приложение и оттолкнуть пользователей. Разбираем и исправляем ошибки в приложении Роскомнадзора

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

8. WebView для чтения новостей и документов

Весь информационный раздел также работает через WebView: нормативно-правовые акты, федеральные законы, статьи, частые вопросы и полный текст новостей. Текст плохо адаптируется под мобильный экран — приходится скроллить по сторонам:

Как испортить приложение и оттолкнуть пользователей. Разбираем и исправляем ошибки в приложении Роскомнадзора

Резюмируем главные ошибки:

  1. Кривое масштабирование
  2. Нефункциональный главный экран
  3. Многоступенчатая навигация
  4. Авторизация через Госуслуги
  5. Формуляр для подачи жалобы
  6. Нерабочие состояния в «Моих жалобах»
  7. WebView-формуляр для обратной связи
  8. WebView для чтения новостей и документов

Как мы исправили ошибки

1. Поменяли заставку

У Роскомнадзора есть современный логотип. Но сплеш и главный экран приложения предлагают смотреть на эмблему с двуглавым орлом. Минкомсвязи признало такие эмблемы устаревшими 4 года назад и предложило использовать на сайтах госорганов цифровую версию герба. Так как у РКН есть свой логотип — он должен быть на заставке:

Как испортить приложение и оттолкнуть пользователей. Разбираем и исправляем ошибки в приложении Роскомнадзора

2. Сделали онбординг

Исправляем ошибку ведомства и знакомим пользователей с главными возможностями приложения:

Как испортить приложение и оттолкнуть пользователей. Разбираем и исправляем ошибки в приложении Роскомнадзора
Как испортить приложение и оттолкнуть пользователей. Разбираем и исправляем ошибки в приложении Роскомнадзора

3. Исправили логику навигации и главный раздел

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

Как испортить приложение и оттолкнуть пользователей. Разбираем и исправляем ошибки в приложении Роскомнадзора

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

Как испортить приложение и оттолкнуть пользователей. Разбираем и исправляем ошибки в приложении Роскомнадзора

4. Упростили форму для подачи жалобы

Вместо 14 неочевидных полей, мы оставили 6:

Как испортить приложение и оттолкнуть пользователей. Разбираем и исправляем ошибки в приложении Роскомнадзора

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

Специалисты ведомства должны сами обрабатывать жалобы и уметь работать с базой данных. А не заставлять пользователя выполнять эту работу. Задача пользователя — оперативно сообщить о проблеме:

Как испортить приложение и оттолкнуть пользователей. Разбираем и исправляем ошибки в приложении Роскомнадзора

5. Сделали информативные формы со статусом обращения

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

  • в каком статусе обращение
  • по какой теме
  • что за сайт
Как испортить приложение и оттолкнуть пользователей. Разбираем и исправляем ошибки в приложении Роскомнадзора

Вся подробная информация по жалобе и ответ ведомства находятся внутри формы.

6. Убрали WebView для обратной связи

В панели вкладок появился раздел «Помощь». Он хранит полезную информацию для пользователя: частые вопросы, нормативные документы, федеральные законы. Из него можно позвонить в службу поддержки или написать обращение.

В бизнес-приложениях этот раздел заменяется чатом, где пользователь может решить вопрос с оператором или чат-ботом. Но в РКН моментальная помощь не нужна. Поэтому написать сообщение можно через форму:

Как испортить приложение и оттолкнуть пользователей. Разбираем и исправляем ошибки в приложении Роскомнадзора

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

Как испортить приложение и оттолкнуть пользователей. Разбираем и исправляем ошибки в приложении Роскомнадзора

На этом все. Спасибо за ваше время — до встречи!

Наши проекты

Как испортить приложение и оттолкнуть пользователей. Разбираем и исправляем ошибки в приложении Роскомнадзора
9393
47 комментариев

Комментарий недоступен

100
Ответить

Комментарий недоступен

8
Ответить

Комментарий недоступен

5
Ответить

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

2
Ответить

Пособие для начинающих дизайнеров по тому, как делать не надо )

1
Ответить

Комментарий недоступен

58
Ответить