Дизайн Вячеслав Шегай
3 736

Что отпугивает пользователей в первых экранах мобильных приложений — на примере сервисов для аренды велосипедов

Перевод статьи директора по продукту Google Люка Вроблевски.

В закладки
Аудио

Перевод подготовлен командой онлайн-школы английского языка Skyeng.

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

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

Применение шаблонов дизайна

Первый раз я решил воспользоваться байкшерингом в Амстердаме. У меня была встреча на окраине города — там я и увидел станцию велосипедов Hello-Bike. Почему бы не вернуться в отель на велосипеде? Вот что случилось, когда я попытался воспользоваться сервисом.

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

Разработчик думает: «Я знаю, как работает онбординг. Это заставка, форма регистрации и инструкция, которую пользователь может пролистать».

Но в результате пользователю приходится заполнять различные формы, пролистывать 17 страниц условий (да, вам обязательно нужно пролистать все страницы), разрешать доступ к геоданным (потому что требуется фоновое отслеживание геопозиции) и просматривать шесть страниц с инструкциями и критически важной информацией, например, «Добро пожаловать в Hello-Bike».

Пробравшись через всё это, я выяснил, что в центре Амстердама нет велосипедных станций из-за государственных ограничений. Воспользоваться Hello-Bike я так и не смог. Если бы на этапе разработки приложения его создатели отталкивались от потребностей пользователя, а не полагались на стандартные шаблоны проектирования, они бы поняли, что о подобном нужно предупреждать заранее.

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

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

Наследие десктопных приложений

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

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

Потом идут несколько запросов разрешения доступа к Motion & Fitness и геолокации. Оба запроса сопровождаются текстом, объясняющим, что Jump нужна эта информация, чтобы «собирать данные о том, как электробайки влияют на дорожное движение в городе». Сама по себе эта идея неплоха, но не очень понятно, почему пользователи должны в этом участвовать и вообще задумываться об этом.

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

Совершив десять действий в Jump и не приблизившись к моей основной цели — сесть на велосипед, — я вышел из приложения на этапе «введите номер кредитной карты».

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

Выводы. Убедитесь, что пользователь чувствует, что приближается к своей цели, а не вашей.

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

Правильный момент

После неудачных попыток с Hello-Bike и Jump я смог успешно воспользоваться сервисом Spin. Хотя это не значит, что там нет потенциала для совершенствования. В дизайне таких приложений важно не только то, что вы просите у людей, но и то, в какой момент вы это делаете.

Spin начинается с руководства, которое рассказывает, что приложение хорошо продумано, я могу парковаться, где захочу, могу воспользоваться велосипедом, просто просканировав QR-код.

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

Но стоит отметить, что Spin гораздо лучше объясняет все свои запросы на разрешение доступа. Запрашивая доступ к геопозиции, Hello-Bike сообщил мне, что «требуется фоновое отслеживание геопозиции», а Jump сказал, что я могу помочь им «собрать данные о том, как электробайки влияют на дорожное движение».

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

После этого мне нужно было активировать аккаунт. Единственный способ это сделать — перечислить $5 на счёт Spin. Это было довольно странно, учитывая, что в рекламе приложения говорилось, что поездка стоит $1. Получается, если бы я никогда больше не воспользовался Spin, они бы остались должны мне $4.

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

После оплаты я столкнулся с новым руководством (видимо, это довольно популярная вещь, жаль, что люди в основном просто пропускают её). В этот раз четыре разных экрана сообщали мне о правилах парковки. Но разве в первой инструкции не было сказано, что я могу парковаться где угодно? Затем Spin попросил разрешения отправлять мне уведомления без всяких объяснений, почему я должен согласиться. Поэтому соглашаться я не стал.

Доехав до нужного места, я получил уведомление, что моя поездка была бесплатной. Это очень здорово, но снова заставляет задуматься — почему нельзя было с этого начать?

Выводы. Очень важно, в какой момент вы сообщаете пользователю информацию. Spin мог бы сказать мне, что моя поездка будет бесплатной, прежде чем списывать с моей карты $5. И инструкция по парковке оказалась бы более полезной после моей поездки, а не до.

Не нужно усложнять

Приложение Ofo работало по уже привычной схеме: запрос на разрешение доступа к геолокации без каких-либо логичных объяснений, несвоевременное руководство по работе, подтверждение номера телефона, запрос на доступ к камере и так далее.

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

Упростив процесс создания аккаунта, Ofo мог бы помочь мне быстро воспользоваться их сервисом, просто отсканировав QR-код. Но вместо этого приложение показало мне рекламу с предложением попробовать сервис бесплатно. Однако нажав «Попробовать бесплатно», я оказался на странице «Выберите тарифный план». Только разглядев маленькую черную стрелочку, я смог вернуться к сканированию QR-кода и всё-таки воспользоваться велосипедом бесплатно.

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

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

Но почему

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

Всё началось как обычно: заставка, форма для ввода почтового адреса, запрос на доступ к геоданным. Но сразу после этого приложение предложило мне отсканировать QR-код и заплатить $1. Отлично, подумал я. Поеду прямо сейчас, потому что я только привязал Apple Pay.

Отклоняясь в сторону, скажу, что, интегрировав нативные платёжные платформы, вы можете улучшить процесс оплаты и увеличить конверсию. Hotel Tonight увеличил конверсию на 26%, добавив Apple Pay, a Wish, сделав то же самое, увеличил конверсии в два раза с помощью A/B-тестирования.

Выходит, что пользователям для оплаты проще просто посмотреть на экран (Face ID) или нажать на кнопку (Touch ID), а не вводить данные своей карты на клавиатуре.

Вернёмся к Bird. Я отсканировал QR-код и подключил Apple Pay. Казалось бы, самое время сесть на велосипед и поехать. Но было не совсем так. Меня попросили отсканировать лицевую сторону моих прав, не объяснив, зачем. Странно, подумал я, но решил, что это вполне законная и безопасная процедура, и сфотографировал права, несмотря на мои привычные опасения по поводу использования персональных данных.

После этого меня попросили отсканировать обратную сторону прав, пролистать 15 страниц договора аренды и поставить галочки в шести чекбоксах, соглашаясь носить шлем, обязуясь не ездить под уклоном и подтверждая, что мне есть 18 лет (разве нельзя было это узнать из данных моего водительского удостоверения?).

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

Договор аренды, местное законодательство, верификация водительских прав и всё прочее не очень сочетаются со слоганом бренда — «Просто наслаждайтесь поездкой».

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

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

С самого начала дайте понять, в чём главная ценность вашего приложения

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

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

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

После Lime объяснил, зачем приложению нужен доступ к моей геопозиции, и это самое точное из всех объяснений, с которыми я сталкивался: «Чтобы найти ближайшие к вам велосипеды и скутеры». К сожалению, такого же простого объяснения для запроса на разрешение отправлять мне уведомления у Lime не нашлось. Зато сервис использовал double dialog. Когда я отказался, задали вопрос ещё раз, но уже с нужными пояснениями.

В большинстве приложений запрос на отправку уведомлений в самом начале стал стандартной практикой, потому что 40% людей просто соглашаются на это. И разработчики думают: «Почему бы и нет? Мы получим много отказов, но некоторые люди всё равно согласятся». Думаю, что Lime может изменить свой подход к этому этапу.

Не считая этой проблемы с уведомлениями, Lime работает быстро и эффективно: вы сканируете код (с чётким объяснением, зачем нужен доступ к камере), подключаете Apple Pay и оплачиваете поездку. Приложение даже не предлагает других способ оплаты, так как создатели знают конверсию от Apple Pay и его плюсы и полностью полагаются на эти данные.

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

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

Выводы. Будьте клиентоориентированными. Цели ваших пользователей должны быть главными во всём процессе онбординга. Это должно быть понятно с первого же экрана (например: «Начните поездку прямо сейчас»).

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

Если вы хотите узнать больше про онбординг для мобильных приложений, посмотрите моё выступление на Google Conversions.

{ "author_name": "Вячеслав Шегай", "author_type": "editor", "tags": [], "comments": 3, "likes": 24, "favorites": 65, "is_advertisement": false, "subsite_label": "design", "id": 51491, "is_wide": true, "is_ugc": false, "date": "Thu, 22 Nov 2018 14:43:20 +0300" }
{ "id": 51491, "author_id": 171398, "diff_limit": 1000, "urls": {"diff":"\/comments\/51491\/get","add":"\/comments\/51491\/add","edit":"\/comments\/edit","remove":"\/admin\/comments\/remove","pin":"\/admin\/comments\/pin","get4edit":"\/comments\/get4edit","complain":"\/comments\/complain","load_more":"\/comments\/loading\/51491"}, "attach_limit": 2, "max_comment_text_length": 5000, "subsite_id": 199114, "possessions": [] }

3 комментария 3 комм.

Популярные

По порядку

3

Что-то я не особо понял, почему он бесится... Байкшеринг и т.д. это не такой простой продукт, как "взял и поехал", тем более для нового пользователя, который еще не зарегистрирован в приложении, так что это естественно, что вначале надо прочитать то, сё, разрешить доступ, ввести свои данные.

Ответить
1

Это как раз тот случай когда для теста приложений были подобраны не очень удачные виды бизнеса. Байкшеринг и т.д не просто услуги по прокату. Дело в том,что любое средство передвижения это источник повышенной опасности, в том числе и на Западе. Поскольку риск травматизма или не дай Бог летального исхода велик (по сравнению с арендой стиральной машинки), компании перестраховываются и вынуждены сообщать пользователю о всех нюансах и требуют от него подтверждения. В разных странах разные Законы и требования. Например в части Европейских стран, владелец сервиса должен недвусмысленно и ясно убедиться в том, что пользователю исполнилось определенное количество лет. В этом случае могут потребовать фото прав или паспорта а это в свою очередь является обработкой персональных данных, с которой пользователь должен так же согласиться и т.д. Такова практика. В противном случае, иски к компании будут запредельными. Именно после таких исков в некоторых инструкциях (США) по эксплуатации стиральных машин, появились предостережения о запрете стирки в них своих домашних питомцев. Но в остальных видах деятельности, автор прав. Очень часто, там где это не нужно,появляются всевозможные уведомления-предупреждения и т.д.

Ответить
0

TL;DR: Приложения делают для имбецилов. Ну, в смысле для среднего пользователя. Который ничего не понимает, и ему надо всё объяснить.
Только забывают о том, что у этих "средних пользователей" нет желания что-то изучать, во что-то вникать. Они ведь не зря такие "средние", правда?

Ответить
0
{ "page_type": "article" }

Прямой эфир

[ { "id": 1, "label": "100%×150_Branding_desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox_method": "createAdaptive", "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "ezfl" } } }, { "id": 2, "label": "1200х400", "provider": "adfox", "adaptive": [ "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "ezfn" } } }, { "id": 3, "label": "240х200 _ТГБ_desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fizc" } } }, { "id": 4, "label": "240х200_mobile", "provider": "adfox", "adaptive": [ "phone" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "flbq" } } }, { "id": 5, "label": "300x500_desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "ezfk" } } }, { "id": 6, "label": "1180х250_Interpool_баннер над комментариями_Desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "pp": "h", "ps": "bugf", "p2": "ffyh" } } }, { "id": 7, "label": "Article Footer 100%_desktop_mobile", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fjxb" } } }, { "id": 8, "label": "Fullscreen Desktop", "provider": "adfox", "adaptive": [ "desktop", "tablet" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fjoh" } } }, { "id": 9, "label": "Fullscreen Mobile", "provider": "adfox", "adaptive": [ "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fjog" } } }, { "id": 10, "disable": true, "label": "Native Partner Desktop", "provider": "adfox", "adaptive": [ "desktop", "tablet" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "fmyb" } } }, { "id": 11, "disable": true, "label": "Native Partner Mobile", "provider": "adfox", "adaptive": [ "phone" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "fmyc" } } }, { "id": 12, "label": "Кнопка в шапке", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "p1": "bscsh", "p2": "fdhx" } } }, { "id": 13, "label": "DM InPage Video PartnerCode", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "adfox_method": "createAdaptive", "adfox": { "ownerId": 228129, "params": { "pp": "h", "ps": "bugf", "p2": "flvn" } } }, { "id": 14, "label": "Yandex context video banner", "provider": "yandex", "yandex": { "block_id": "VI-223676-0", "render_to": "inpage_VI-223676-0-1104503429", "adfox_url": "//ads.adfox.ru/228129/getCode?pp=h&ps=bugf&p2=fpjw&puid1=&puid2=&puid3=&puid4=&puid8=&puid9=&puid10=&puid21=&puid22=&puid31=&puid32=&puid33=&fmt=1&dl={REFERER}&pr=" } }, { "id": 15, "label": "Плашка на главной", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "adfox": { "ownerId": 228129, "params": { "p1": "byudx", "p2": "ftjf" } } }, { "id": 16, "label": "Кнопка в шапке мобайл", "provider": "adfox", "adaptive": [ "tablet", "phone" ], "adfox": { "ownerId": 228129, "params": { "p1": "byzqf", "p2": "ftwx" } } }, { "id": 17, "label": "Stratum Desktop", "provider": "adfox", "adaptive": [ "desktop" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fzvb" } } }, { "id": 18, "label": "Stratum Mobile", "provider": "adfox", "adaptive": [ "tablet", "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fzvc" } } }, { "id": 19, "label": "Тизер на главной", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "p1": "cbltd", "p2": "gazs" } } } ]
Приложение-плацебо скачали
больше миллиона раз
Подписаться на push-уведомления
{ "page_type": "default" }