Всё ушло на front: как PWA меняют правила игры в онлайн-торговле
Пять лет назад считалось, что онлайн-торговлю будут двигать мобильные приложения. Но довольно быстро им нашли замену: удобную, простую, приятную в использовании и администрировании. Разбираемся, почему 2019 год можно назвать годом PWA и за что эту технологию так любят маркетологи.
Онлайн как двигатель торговли
Уже понятно, что главным двигателем торговли становится онлайн-сегмент: по законам бизнеса торговые площадки «следуют» за покупателем.
Но и здесь не всё так гладко. Чтобы захватить все каналы конверсии, интернет-магазину приходится вкладываться минимум трижды: разрабатывая сайт, приложение под iOS и приложение под Android. А результат?
Ещё лет 5–7 назад специалисты прогнозировали, что будущее — за мобильными приложениями, а браузер будет собирать жалкие крохи конверсии. Но статистика 2018–2019 годов показывает, насколько они ошибались.
Среднестатистический пользователь скачивает ежемесячно ноль приложений. Среднестатистический пользователь проводит львиную долю своего времени — примерно 85 % — в пяти любимых приложениях.
Да и вообще, пользователю проще сказать «Окей, Google» и перейти по ссылке, чем искать что-то в App Store или «Play Маркете».
В результате — новая дилемма. Обычные сайты не создают столько возможностей для повторного касания, как мобильные приложения. Они не «живут» у пользователя на рабочем столе и не напоминают о себе push-уведомлениями. Они дольше грузятся и нестабильно работают при медленном соединении с Интернетом. А приложения не приносят результатов, которые от них ожидают.
Идея Progressive Web Applications (PWA, или прогрессивные web-приложения) на этом фоне не нова. Информационный продукт, который удобен как приложение и прост как сайт, появился уже давно. Но только последние пару лет PWA переживают настоящий расцвет. Причина этой тенденции — в политике корпорации Google, которая задалась целью сделать Chrome самым нужным приложением в мире и поэтому активно «открывает» для браузера новые возможности.
PWA как способ изменить мир e-Commerce
Что такое PWA? Вкратце — это мобильное приложение в браузере. Оно не требует обязательной установки и при этом «наследует» все лучшие качества нативных приложений: привлекательный и быстрый интерфейс, гибкость в разработке, независимость от back'а.
Но добавляет к этому собственные бонусы: легко ищется через тот же Google и «весит» в разы (а то и в десятки раз) меньше, чем обычное приложение.
Пример PWA, перевернувшего продажи
Сеть Starbucks в дополнение к обычному мобильному приложению разработала PWA для сбора заказов. В PWA был реализован привычный для пользователей приложения Starbucks user-friendly интерфейс, но «вес» PWA оказался меньше на 99,84 %. Результат не заставил себя ждать: заказы через мобильный Интернет удвоились и почти сравнялись с заказами через десктоп.
Такой взлёт PWA стал возможен, когда изменились технологии web. То, что раньше казалось принципиально невозможным: работа в офлайне, push-уведомления, вход за один клик, оплата картами и системами Apple Pay и Google Pay — теперь стало реальностью. Если раньше по технологическим возможностям web просто недотягивал до нативных приложений, то сейчас они практически сравнялись.
Работает и человеческий фактор: больше половины пользователей вообще ничего не скачивают из магазина приложений. Это официальная статистика. Те же самые пользователи охотно посещают сотни сайтов в месяц — это нормальное для них поведение в сети.
В результате стоимость привлечения клиентов через PWA (сайты) до 10 раз ниже, чем через мобильное приложение: пользователю удобнее и искать информацию, и устанавливать приложения в обход магазина.
В числе первых возможностями PWA воспользовались игроки сектора e-Commerce и уже оценили возможности технологии.
9 плюсов PWA
- Адаптируется для всех устройств.
Загрузить PWA можно на десктоп, смартфон, планшет и на терминал в торговом зале. Его работоспособность не зависит от ОС, установленной на устройство: создавать отдельные приложения под Windows, iOS, Android не придётся. - Находится через Google(и любую другую поисковую систему).
- Быстро грузится.
Например, ядро PWA Uber «весит» 50 килобайт. Оно грузится за миллисекунды даже в 2G. - Быстро работает.
Никаких зависаний и скроллов: PWA реагирует на все действия пользователя мгновенно. - Стабильно работает с нестабильной сетью.
Разрывы соединения и медленное соединение с Интернетом никак не повлияют на user experience. PWA, в отличие от сайта, будет работать стабильно. Более того, само приложение откроется при полном отсутствии Интернета, хотя для работы ему и требуется информация о товарах и ценах, которую нужно получить через сеть. - Front отделён от back'а.
А значит, меньше времени и ресурсов тратится на разработку и переработку дизайна и логики взаимодействия PWA с клиентом. - Следствие шестого плюса — PWA устойчив к высоким нагрузкам.
На user experience не влияет то, что происходит «внутри», пока он выбирает и делает заказ. Он уверен: его заказ попадёт в систему и будет исполнен в срок. Даже в периоды сверхнагрузок — в «чёрную пятницу» или во время новогоднего шопинга. Ведь PWA умеет сохранять данные, если back недоступен или перегружен, и передавать их, когда связь с back'ом восстанавливается или нагрузка на него снижается. - Можно добавить на стартовый экран в обход App Store и Google Play.
- Можно загрузить в App Store и Google Play.
Почему PWA становятся так популярны?
PWA удачно попали на стык ожиданий пользователя и маркетолога.
Пользователь видит красивый интерфейс, с которым удобно и приятно взаимодействовать. Страницы быстро грузятся, товары — ищутся, добавлять в избранное или оформлять заказы легко.
Путь от решения до покупки сокращается до трёх шагов: «Окей, Google» – открытие PWA – заказ.
В результате пользователь проводит на сайте больше времени, чаще конвертируется в покупателя и больше заказывает.
Показателен пример PWA AliExpress
После внедрения технологии на 74 % увеличилось среднее время сеанса, средний пользователь стал просматривать в два раза больше страниц. Конверсия новых пользователей в покупателей увеличилась на 104 %!
PWA интернет-магазина La Nature, разработанного kt.team, уже в первые месяцы показал рост конверсии на 65 % с мобильных устройств, пользователи стали просматривать на 30 % больше товаров, а время загрузки страниц сократилось до 0,1 секунды.
Маркетолог видит не только эти результаты, но и внутренние процессы, связанные с внедрением PWA. Он привык слышать «OK, мы переставим эту кнопку, но это неделя разработки». CMS диктует определённую логику, которой вынужден подчиняться дизайн интернет-магазина. Создание PWA освобождает маркетолога от жёстких рамок и позволяет тестировать новые инструменты и логику, не тратя на это космических бюджетов.
Маркетолог привык бороться за место на стартовом экране своего покупателя — и с PWA, в отличие от сайта, он легко займёт это место.
Маркетолог — давайте будем честными — не хочет трижды платить за один и тот же продукт. С PWA его расходы на разработку сократятся в разы.
Почему внедрять PWA нужно именно сейчас?
Технология PWA известна с 2015 года. Но по-настоящему её время настало именно сейчас.
Только с середины 2018 года PWA начали поддерживать операционки iOS младше 11.3 и все последние версии Android. PWA открываются на всех современных браузерах без искажений и проблем. С февраля 2019 года PWA можно добавлять в App Store и Google Play, давая пользователю возможность скачать приложение из привычного источника.
Vue Storefront vs PWA Studio: выбираем технологию
PWA Studio — «штатная» технология для Magento, с которой мы часто работаем. Она идеально совместима с другими функциями этой системы. Но даже Magento-интеграторы не всегда рекомендуют использовать для разработки PWA именно эту технологию.
«Есть два момента, почему мы не советуем своим заказчикам разработку PWA в PWA Studio. По крайней мере, на сегодняшний день.
Первое — в PWA Studio до сих пор не реализована технология SSR (server-side rendering). Он „не умеет" выдавать поисковику готовую страницу по продукту. Vue Storefront для поискового робота выглядит так же, как и обычный сайт — а это важно для SEO...
Второе — у PWA Studio меньше абстракция стека. Он „заточен" под Magento, а вот совмещение с другими платформами e-Commerce проходит уже не столь гладко. Независимый Vue Storefront без проблем интегрируется с любым back'ом и обменивается с ним данными».
Как вы думаете, остались ли ещё у нативных приложений преимущества перед PWA в e-Commerce? Какая технология сможет удержать лидерство в будущем?
Автор красавчик....
Пуши на айфоны не получить, вот пожалуй самый жирный минус PWA.
APNS?
вопрос не только и не столько в пушах. Сами пуш-нотификации довольно спорны - ведь, как вы знаете, сейчас вообще каждый сайт считает своим долгом запросить у тебя разрешения на пуши. Безусловно, здесь должны устояться отраслевые стандарты (в каких случаях это норм, в каких - вредно). Apple пошла по пути "на сайте - нет, но если ты опубликовал апп - пушь". APNS (спасибо, коллегам).
Workaround напрашивается сам собой, которые немного увеличивают косты конкретно для пушей. Это некоторые минусы, поддерживаю.
Мой посыл был в том, что на сегодня в JS можно и машинное обучение (и даже обучать на устройствах - tensorflow.js), внедряется Generic Sensor API и так дальше - получается, что сбылась мечта Стива Джобса и вот-вот вообще не нужны будут нейтивы. Я уже не говорю про скорость рендера CSS (60FPS и более) и революциями в CSS которые менее громкие, но происходят на наших глазах. Получается, что PWA при всех минусах на сегодня имеет такое количество плюсов!
Маркетинговый буллшит какой то
Можно загрузить в App Store и Google Play.
В App Store? А как? Кажется нельзя!