PWA для интернет-магазина контактных линз

1. Вводная задача от заказчика, проблематика, цели

Linzmarket.by – интернет-магазин контактных линз и средств по уходу за ними. Разработали для интернет-магазина прогрессивное веб-приложение или Progressive Web Application (PWA). Теперь благодаря PWA пользователи могут установить сайт интернет-магазина на смартфон и пользоваться им как мобильным приложением.

2. Описание реализации кейса и творческого пути по поиску оптимального решения

Как это работает

Пользователь открывает сайт Linzmarket на смартфоне и через 5 секунд видит баннер с предложением установить приложение. Баннер показывается пользователям, начиная со второго посещения сайта.

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

Пользователь соглашается на скачивание, и приложение устанавливается на смартфон. При чем происходит это мгновенно, т.к. в отличие от классического мобильного приложения, PWA очень легкое: весит не более 50 Мб. Чаще — менее 1 Мб.

Есть еще один крутой момент: чтобы установить PWA, пользователям Linzmarket не нужно идти в Google Play или App Store. Приложение скачивается сразу на сайте.

На рабочем экране смартфона появляется иконка интернет-магазина.

Так установка PWA интернет-магазина выглядит на Android. Немного другая история с iOS. Айфоны пока блокируют появление баннера с предложением установить PWA. Поэтому, чтобы установить приложение Linzmarket, владельцам айфонов нужно зайти в меню браузера и нажать кнопку «Add to Home Screen».

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

Страницы, которые посетил пользователь, записываются в память браузера. Благодаря этому, покупатели могут пользоваться сайтом даже при плохом интернет-соединении или при его полном отсутствии — страницы из кэша продолжают быть доступными.

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

Благодаря PWA интернет-магазин может отправлять Push-уведомления. Linzmarket использует уведомления в первую очередь для оповещения покупателей о статусе заказа. Таким образом push-уведомления помогают магазину экономить на смс-рассылке.

Также Linzmarket использует Push-уведомления, чтобы напоминать своим клиентам об истечении срока ношения линз. Такие уведомления полезны как самим покупателям, так и магазину, поскольку помогают стимулировать повторные заказы.

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

Важный момент: айфоны пока блокируют отправку push-уведомлений.

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

3. Результаты сотрудничества

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