sobaka@pavlova.cc
+7 (812) 320-57-87

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

Как использовать сценарии в разработке мобильных приложений. На примере «Помощника ОСАГО»

Собака Павлова

ИНТЕРФЕЙСЫ

2019
В. И. Шевченко, «Сломалась телега»
Легче всего показать силу сценариев в «приложениях одной задачи». Например, в «Помощнике ОСАГО» (iOS, Android), которое помогает водителям оформлять европротоколы. У него всего одна задача, но очень важная. А еще — это приложение с некоторой степенью риска. Пользователь может не дойти до финала, и тогда оба водителя, попавшие в ДТП, потеряют время (мы потратили 40 минут) и будут обязаны вызвать наряд ГИБДД. Сценарий как раз и покажет, удалось ли разработчикам создать стопроцентно проходимый путь.
В общем, почти идеальный для нашего материала случай.
Скажем больше: если вы разрабатываете приложение, выполняющее всего одну задачу, сценария будет достаточно, чтобы начать делать дизайн и даже разработку. А еще — заранее оценить, где пользователю будет неудобно, как он себя поведет на каждом этапе, что ему не пригодится. И все это — сразу, не написав и строчки кода.
В статье мы намеренно выбрали формат диалога, чтобы проявить в сценарии его сущность: протяженность во времени, сложность шагов, риски каждого шага. Поэтому у нас такой разговорный диалог. Вы можете использовать любые другие форматы.

Что мы ожидали от приложения и что получилось?

0. Приложение объяснит, как работает и что от нас понадобится при оформлении ДТП.
1. Приложение расскажет про правила поведения при ДТП, предупредит о необходимых документах и других требованиях к участникам.
2. Предупредит об обязательных условиях, когда мы можем и не можем оформить ДТП онлайн.
3. Попросит документы у обоих участников ДТП.
4. Зафиксирует повреждения.
5. Попросит описать, при каких обстоятельствах произошло ДТП.
6. Проверит всю введенную информацию, попросит подтверждение у обоих участников.
7. Объяснит, что нам делать дальше.
Примерно так и получилось. В приложении реализован именно этот сценарий. Но отличий тоже хватило.
Чем реальный сценарий отличается от вымышленного:
  • не хватает сценария обучения, который объяснил бы, как пользоваться приложением;
  • участники ДТП неравноправны — один оформляет, другой ждет и нервничает, все ли заполнено верно;
  • приложение не предупреждает, что оба водителя должны быть зарегистрированы в «Госуслугах»;
  • последний этап оформления ДТП проводится в «Госуслугах», а не внутри приложения.
Это были краткие предварительные итоги. А вот процесс.
В качестве вводных у нас был образец кофепойнта нашего потенциального заказчика и некоторое количество ограничений: использование стандартной кофемашины, общая площадь не более двух квадратных метров, приём платежей наличными и банковскими картами. Места установки — бизнес-центры и крупные торговые центры.
Вводные были, конкретной задачи не было. Добро пожаловать в нашу сумасшедшую реальность, где ценят не «решателей бизнес-проблем», а инициаторов изменений.

0. Обучение

Сценарий, который используется один раз.
Мы установили приложение, сидя дома, и хотим знать, что можно сделать, чтобы быть лучше подготовленным к оформлению ДТП. Вдруг есть какие-то нюансы? А может, мне стоит заранее загрузить все документы в приложении?
Зимой в разбитой машине не хочется тратить время и зарядку, чтобы знакомиться с новым интерфейсом. Лучше подготовиться заранее.

Ожидание

 — Я скачал приложение. Надеюсь, оно мне не понадобится, но на всякий случай пусть будет. Чем оно мне поможет?
 — Если никто не пострадал, вы собственник и все согласны друг с другом, вы сможете быстро оформить ДТП без вызова ГИБДД.
 — Без подводных камней?
 — Есть одна мелочь: вы должны быть зарегистрированы на «Госуслугах».
 — А как оформиться?
 — Сделайте вот это.
 — А как с документами? Что нужно заполнить?
 — Вот документы, которые нужны от вас, вот форма для информации, сюда загрузите фотографии.
 — И все, смогу уехать и получить деньги?
 — Не совсем, нужно будет написать обстоятельства ДТП на «Госуслугах».
 — Хорошо, зарегистрируюсь, пожалуй.

Реальность

Никакого обучения в реальности нет.
Этот сценарий разработчики не отработали.

1. Информированное согласие

Ожидание

 — Я попал в ДТП.
 — Оформлять будете?
 — Да.
 — Давайте проверим, что вы сможете это сделать через приложение. Ваше ДТП такое-то и такое-то?
 — Да.
 — Второй участник готов участвовать в оформлении через приложение?
 — Да.
 — У вас у обоих есть доступ к «Госуслугам»? Проверьте, кстати.
 — Проверили, есть.
 — Достаньте бумаги. Понадобятся права, полис страхования и что-то там еще. Всё есть?
 — Да, всё есть.
 — Проверим технические условия: у вас у обоих должны быть смартфоны с интернетом и работающей фотокамерой.
 — Есть.
 — Вы понимаете, что нельзя никуда уходить и перемещать автомобили, пока я не скажу?
 — Да.
 — Если что-то пойдет не так (например, у кого-то сядет батарейка), вам все-таки придется вызвать ГИБДД. Согласны?
 — Угу.
 — План такой: сначала то-то сделаем, потом то-то, а в конце то-то. Поехали?
 — Да.

Реальность

В приложение можно войти только через аккаунт в «Госуслугах». По-другому — никак. Это означает, что, если у вас нет подтвержденного аккаунта, воспользоваться «Помощником» вы не сможете. Зарегистрироваться на ходу не получится — сперва данные должны проверить в ФМС РФ и Пенсионном фонде РФ.
Для удобства приложение сразу спрашивает права и ОСАГО. Этот этап можно пропустить — потом попросит еще раз. Но если вы при входе заполнили данные, они сами подставятся в поля позже.
Котики всегда уместны | SobakaPav.ru
Приложение разделено на три вкладки. Центральная вкладка — оформление ДТП. Нажимаем на нее — приложение просит доступ к геопозиции, а потом предупреждает, что работает не везде. Затем сразу начинается транзакция.
Отличия от сценария
  • Непонятно, будет ли участвовать в оформлении второй участник ДТП.
  • Неизвестно, какие понадобятся данные.
  • Про смартфоны и камеры приложение не предупреждает. А вдруг у одного из участников старый телефон или разбита камера?
  • Что делать сейчас и что понадобится сделать во время оформления, ни слова.
  • Приложение не предупреждает, что у второго участника тоже должен быть подтвержденный профиль на «Госуслугах». Иначе все зря. Но мы узнаем об этом позже.
Главное отличие — в этом этапе не участвует второй участник ДТП. Мы оформляемся, а он стоит рядом и нервничает. Вдруг мы как-то его обманем? Может, обстоятельства ДТП опишем неправильно? Или оформим неверно, а потом окажется, что оба покинули место ДТП.

2. Старт транзакции

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

Ожидание

— Вот код вашего ДТП. Он понадобится для разного. На всякий случай сохраните. Но сейчас важно другое: попросите второго участника присоединиться к оформлению ДТП по этому коду.
— (1) Прошу.
— (2) Присоединяюсь.
— Порядок. Все в сборе. Теперь назначим крайнего. Кто из вас виноват в ДТП?
— (1) Я виноват.
— (2) Ага, он виноват.
— Договорились.

Реальность

Приложение проводит транзакцию.
  1. Просит подтвердить, что собственниками автомобилей являются физические лица и у водителей, попавших в ДТП, нет разногласий в отношении происшествия.
  2. Предупреждает, что надо включить аварийную сигнализацию, выключить двигатель и поставить знак аварийной остановки.
  3. Спрашивает, пострадал ли кто-нибудь в ДТП.
  4. Удостоверяется, что в ДТП участвуют только два автомобиля, не пострадали третьи лица и их имущество, а у водителей нет разногласий по поводу обстоятельств ДТП, в том числе и видимых повреждений автомобилей.
После этого приложение переходит к документам.
Он был хорошим дизайнером. R.I.P. | SobakaPav.ru
Отличия от сценария
Отличий нет. Приложение ведет себя именно так, как мы и ожидали.

3. Документы участников

Ожидание

 — Пожалуйста, введите оба информацию из водительских прав.
 — (1) (2) Вводим.
 — ОК. Теперь — информацию о страховом полисе.
 — (1) (2) Вводим.
 — Проверяю… Да, вся информация корректна, можем двигаться дальше.

Реальность

Приложение предупреждает, что карточка участника, А будет отмечаться желтым цветом, а участника Б — синим. Становится понятно, что оформлять ДТП будут оба водителя.
Он был хорошим дизайнером. R.I.P. | SobakaPav.ru
Если вы не ввели документы при входе, приложение потребует их на этом шаге. ФИО, дату рождения и права нужно ввести руками, а вот ОСАГО можно загрузить, если отсканировать QR-код на страховке. Приложение сразу проверит, зарегистрирован ли полис в базе РСА и есть ли совпадения данных по транспортному средству.
Потом все то же самое нужно сделать за участника Б: ввести его ФИО, дату рождения, права и страховку в своем смартфоне. Приложение попросит скинуть специальную ссылку участнику Б, чтобы тот подтвердил верность данных у себя на смартфоне. Можно показать QR-код. По этой ссылке участник Б перейдет на портал ЕПГУ, где ему сперва понадобится авторизоваться и только потом подтвердить, что его данные ввели верно.
Затем приложение просит указать время и место ДТП, указать свидетелей, дать общий план их автомобилей, фотографии госномеров, ФИО, места жительства и номера телефона.
Отличия от сценария
  • Участник, А должен заполнять информацию за двоих — это может нервировать участника Б, потому что неизвестно, что он там напишет.
  • Участник Б тоже должен быть зарегистрирован на «Госуслугах» — это сюрприз.
Потом приложение просит оформить свидетелей.

4. Повреждения автомобилей

Ожидание

 — Теперь прошу каждого зарегистрировать повреждения своих автомобилей. Нужны будут фотографии и названия деталей. Вот инструкция, как это сделать, будьте внимательны. Если тут ошибетесь, будет то-то и то-то.
 — (1) и (2) Фотографируем, вводим буковки… Уф, вроде всё.
 — Посмотрите, что получилось. Все верно?
 — (1) и (2) Ну, по моей машине все верно.
 — А машины друг друга проверьте еще, пожалуйста? Вот информация.
 — (1) и (2) И тут все верно.

Реальность

Приложение просит участника А:
1) выбрать поврежденные детали;
2) сфотографировать каждое повреждение;
3) сфотографировать регистрационный знак;
4) сфотографировать общее расположение автомобилей на фоне неперемещаемой окружающей инфраструктуры.
Он был хорошим дизайнером. R.I.P. | SobakaPav.ru
Приложение без предупреждений отправляет фото в Российский союз автостраховщиков.
    Затем то же самое делает участник Б на смартфоне участника А: указывает поврежденные детали и фотографирует свой автомобиль.
      Приложение не просит обоих участников ДТП подтверждать заполненные данные.
        Отличия от сценария
          • Участник Б должен пользоваться смартфоном участника А.
          • Приложение не просит участников подтвердить повреждения.
          • Неизвестно, что произойдет, если кто-то неправильно зафиксирует повреждения.

          5. Обстоятельства

          Ожидание

           — Теперь нужно написать много букв для страховой: как обгонял, как подрезал… Делать нужно правильно и аккуратно, а не то будет то и это. Вот кое-какие пояснения.
           — (1) и (2) Пишем. Написали.
           — Проверяю… И правда написали. Теперь друг друга проверьте.
           — (1) и (2) Всё так, всё так.

          Ральность

          Приложение переносит участников в «ГосУслуги» и предлагает проверить данные именно на портале. То есть, переносит из этапа «Повреждения автомобилей» в «Проверку данных». На той же странице можно описать обстоятельства ДТП.
          Отличия от сценария
          • На этом этапе приложение не дает участникам, А и Б проверить, кто как описал обстоятельства ДТП.
          • Приложение на объясняет и не подсказывает, как правильно описывать обстоятельства ДТП.

          6. Проверка данных

          Ожидание

          — Так, ну вот всё, что вы понаписали. Одной простынёй. Нужно угу от каждого — ну или желание поменять что-то. Подтверждайте или меняйте?
          — (1) и (2) Да верно всё.

          Реальность

          Каждый участник на своем смартфоне переходит в «ГосУслуги» и видит большое полотно текста со всеми введенными данными.
          В полотне есть пустые поля — можно что-то дописать и добавить обстоятельства ДТП.
          Мы закончили на этом этапе — не рискнули оформлять ДТП на государственном портале, в котором пользователи авторизуются по паспорту.

          7. Инструкция по дальнейшему

          Ожидание

           — Ну класс. Теперь я буду пережёвывать всю эту инфу. А вы уже можете идти в страховую вот с этим волшебным кодом. Кстати, прислать вам код и все заполненные анкеты по почте, например? На какие адреса?
           — (1) и (2) Сюда присылай.
           — Отправила. Всё. Можете ехать по своим делам.

          Реальность

          До этого этапа мы не добрались.

          А выводы?

          В начале статьи мы задались целью показать, как использовать сценарии для оценки и создания приложений. У нас не было задачи найти все возможные ошибки в «Помощнике ОСАГО».
          Наш сценарий — это то, что мы ожидали от приложения. Разумеется, мы не претендуем на единственное правильное мнение. Да и вообще на правильное. И да, мы могли придумать другой сценарий. Но взяли этот для примера.
          Главное, что мы хотели сказать: фиксировать сценарий — важно.
          Вот как еще можно использовать сценарий.
          1. Узнать, чего от приложения хотят пользователи и как они им будут пользоваться.
          2. Убрать все лишнее и второстепенное. Каждый раз, когда кто-то предлагают идею в духе «А давайте еще сделаем вот это», можно сверить ее со сценарием и спрогнозировать, как на конкретном этапе изменится поведение человека.
          3. Начать создавать продукт, не привязываясь к технологиям. Например, сценарий может показать, что вам можно не заморачиваться с разработкой приложения и создать чат-бота.
          4. Включить фантазию. Когда команда знает, какую задачу и каким образом выполняет их продукт, она может искать эффективные решения, и не только интерфейсные.
          5. Подготовиться к разработке. Все в команде представляют, что у них должно получиться. Поэтому можно начинать заранее, не дожидаясь, пока коллеги закончат свой этап работы.
          6. Заменить им тестирование продукта. Пройтись по сценарию и посмотреть, где возникают трудности.
          А вывод такой: для «приложений одной задачи» сценарий — важный этап работы над продуктом. Возможно, даже главный. И уж точно — один из самых-самых первых.
          Статья также опубликована на vc.ru
          20 ноября 2019
          Собака Павлова
          Дизайн сложных интерфейсов
          Другие статьи


          Новый интерфейс для старого автомата: наши варианты

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