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

«Нам нужно мобильное приложение!» — эту фразу я слышу от каждого второго клиента. Кажется, что без приложения в сторах бизнес неполноценный. Но когда речь заходит о стоимости: нативное приложение для iOS и Android стоит от 1,5 до 3 млн рублей (за каждую платформу отдельно) и требует постоянной поддержки (обновления, модерация в сторах, разные языки программирования).

Альтернатива есть — PWA (Progressive Web App). Это веб-сайт, который можно установить на телефон как приложение: с иконкой на рабочем столе, полноэкранным режимом, push-уведомлениями и офлайн-доступом. Причём одно PWA работает и на Android, и на iOS. Мы используем PWA во всех своих проектах на Falcon Space. И наши клиенты экономят миллионы.

Расскажу, как PWA заменяет нативное приложение, в каких случаях его достаточно, а когда без «натива» не обойтись.

Что такое PWA и почему это работает

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

Как это выглядит для пользователя:

• Он заходит на ваш сайт через браузер.
• Видит баннер «Установить приложение» (на Android) или инструкцию (на iOS).
• Нажимает «Добавить на экран «Домой»».
• На телефоне появляется иконка, при нажатии на которую открывается сайт в полноэкранном режиме (без адресной строки).
• Если пользователь открывал сайт недавно, некоторые страницы доступны офлайн.
• Вы можете отправлять push-уведомления, даже когда браузер закрыт.

По сути, пользователь не видит разницы между PWA и нативным приложением. Для CRM, маркетплейса, сервиса услуг этого достаточно. Исключение — игры, сложная анимация, плотная интеграция с железом телефона (датчики, Bluetooth).

Реальный кейс: сервис загородных домов (PWA вместо нативного)

Один из наших проектов — площадка по обслуживанию коттеджей (уборка, сантехника, электрика). Основные пользователи — мастера-исполнители, которые находятся на выезде. Им нужно: видеть список заказов, кнопку «Прибыл на место», чат с клиентом, push-уведомления о новых заказах. Раньше они пользовались сайтом через браузер, но это было неудобно — каждый раз вводить адрес, логин, пароль.

Клиент хотел нативное приложение. Мы предложили сначала попробовать PWA. Затраты: 0 рублей на разработку (потому что PWA включается настройкой в Falcon Space за 1 день). Через месяц клиент забыл про нативное приложение. Мастера установили PWA на свои телефоны, получают уведомления, открывают приложение в один клик. Сайт уже адаптивен, всё отлично выглядит.

Экономия — около 2 млн рублей, которые ушли бы на разработку приложений под iOS и Android. А если бы понадобилось их поддерживать (обновлять, исправлять баги под новую версию ОС), то ещё по 200-300 тыс. в год.

Из отзыва: «PWA — это отличная замена нативному приложению для наших исполнителей. Установили за минуту, не нужно публиковать в App Store. Экономия времени и денег».

Как включить PWA в Falcon Space (без программиста)

В платформе уже есть встроенная поддержка PWA. Вам нужно:

• Подготовить иконки разных размеров (72x72, 128x128, 512x512). Их можно сгенерировать бесплатно в онлайн-генераторе.
• Заполнить настройки PWA в админке: название приложения, цвет темы, пути к иконкам.
• Скопировать сгенерированный код в шаблон сайта (одна строка).
• Проверить, что при заходе с телефона появляется баннер «Установить».

Всё это делается за 2-3 часа без единой строчки кода. Мы предоставляем инструкцию. Если нужна помощь — настраиваем за 10-15 тыс. руб.

Push-уведомления через PWA

Push-уведомления — одна из главных фишек. Клиенты думают, что для этого нужно нативное приложение. Нет, PWA поддерживает push с 2018 года. Уведомления приходят даже когда браузер закрыт (на Android и на iOS, но в iOS с ограничениями).

В Falcon Space настройка push-уведомлений через PWA выполняется через внешнее действие (вызов API). Пользователь должен дать разрешение на уведомления (один раз). После этого вы можете отправлять ему сообщения при смене статуса заказа, новых акциях, напоминаниях.

Мы используем бесплатный сервис OneSignal для отправки push (или можно напрямую через Firebase). Стоимость — 0 рублей для 10 000 устройств. Интеграция — 1 день работы разработчика.

Важный нюанс: на iOS push-уведомления через PWA появились только в iOS 16.4 (2023 год). На старых устройствах они не работают. Но у большинства пользователей уже новые версии. Если ваша аудитория — владельцы старых iPhone, лучше добавить и Telegram-уведомления как резерв.

Когда PWA не заменит нативное приложение (честно)

Мы не говорим, что PWA — панацея. Есть случаи, когда без нативного не обойтись:

• Сложная анимация, игры, 3D-модели. PWA работает в браузере, производительность ниже, чем у нативного кода.
• Плотная интеграция с железом. Bluetooth, NFC, беспроводная связь с принтерами и сканерами — в PWA поддержка есть, но ограничена.
• Офлайн-режим со сложной синхронизацией. PWA может кешировать страницы, но не умеет синхронизировать десятки таблиц в фоне.
• Публикация в App Store как маркетинговый ход. Некоторые компании хотят быть «в сторах», чтобы повысить доверие. Хотя PWA нельзя официально загрузить в App Store, есть обходные пути (обёртки), но это оверхед.
• Аудитория с очень старыми устройствами (iOS ниже 16.4). Тогда push-уведомления не будут работать.

Для 90% малого бизнеса (CRM, личные кабинеты, каталоги, сервисы услуг) PWA более чем достаточно. И это подтверждают наши проекты: прачечные, доставка, автосервисы, школы единоборств — все используют PWA и не жалеют.

Как убедить клиентов установить PWA

Пользователи не знают, что такое PWA. Они привыкли к иконкам на экране. Поэтому не используйте слово «PWA». Просто добавьте на сайт инструкцию: «Установите наше приложение — нажмите "Добавить на экран «Домой»"». Покажите скриншоты.

Можно добавить попап (всплывающее окно) при первом заходе: «Установите приложение для быстрого доступа». Это повышает конверсию в установку.

В личном кабинете можно добавить кнопку «Установить приложение» для мобильных устройств. При нажатии — инструкция.

Пользователи устанавливают PWA, видят иконку и считают, что это настоящее приложение. Им не важно, что внутри — веб.

Заключение: считайте деньги

Нативное приложение для iOS и Android стоит от 1,5 млн руб за каждую платформу (разработка + дизайн) плюс 200-300 тыс. руб в год на поддержку. PWA на Falcon Space — 0 рублей, если вы настраиваете сами, или 15-30 тыс. руб, если заказываете нам. Push-уведомления — бесплатно до 10 000 пользователей.

Экономия — минимум 1,5 млн рублей. Эти деньги можно потратить на маркетинг или на улучшение основного сайта.

Если ваш проект не подпадает под исключения (игры, сложное железо), начинайте с PWA. Через полгода, когда получите прибыль, сможете заказать нативное приложение, если оно действительно нужно. Но скорее всего, PWA вас полностью устроит.

Насколько полезной была статья?