12 лучших примеров прогрессивных веб-приложений (PWA) в 2022 году
Опубликовано: 2022-01-03Оглавление
Ни для кого не секрет, что производительность жизненно важна для успеха и прибыльности любого онлайн-проекта. Как следствие, веб-сайты в разных отраслях используют новый стандарт Progressive Web Apps (PWA) для повышения своей производительности.
Эта передовая технология, поддерживаемая Google, направлена на обеспечение высокого уровня производительности независимо от устройства или состояния сети. Они достигают этого, дополняя PWA качествами нативных приложений, которые являются надежными, быстрыми и привлекательными. Несмотря на то, что концепция PWA привлекает большое внимание, она является относительно новой для большинства людей.
Чтобы лучше понять, чем прогрессивное веб-приложение отличается от обычных адаптивных веб-сайтов, лучше всего взглянуть на несколько хороших примеров PWA.
Вот список впечатляющих примеров прогрессивных веб-приложений в различных отраслях, чтобы вы могли сами испытать новые веб-технологии.
1. Старбакс
Стремясь предоставить доступный и удобный онлайн-заказ для всех своих клиентов, Starbucks создала PWA системы заказов в Интернете, которая обеспечивает аналогичный опыт их существующего собственного приложения. Другими словами, благодаря возможности работать в автономном режиме Starbucks PWA позволяет своим клиентам просматривать меню, настраивать свои заказы и добавлять товары в свои корзины — и все это без постоянного доступа к Интернету. После подключения к Интернету они могут просматривать цены для конкретных мест и размещать заказы на еду и напитки.
Поскольку большая часть PWA доступна без подключения к сети, это отлично подходит для мобильных клиентов, которые могут подключаться и отключаться в течение дня, или для развивающихся рынков, таких как сельские сообщества, где подключение менее надежно. Запустив новую PWA для заказов, Starbucks уже добилась значительных результатов. PWA на 99,84% меньше , чем существующее приложение Starbucks для iOS, что делает веб-приложение любимым среди пользователей. В результате они удвоили количество веб-пользователей, размещающих заказы каждый день, и теперь пользователи настольных компьютеров делают заказы примерно с той же скоростью, что и мобильные пользователи.
2. Дебенхамс
Говоря о брендах, которые трансформируют свой покупательский опыт в индустрии моды, нельзя не упомянуть Debenham. Известный британский бренд понял, что хотя их старый сайт увеличил мобильный трафик, коэффициент мобильной конверсии не рос. Поэтому они пришли к выводу, что пришло время для цифровой трансформации, иначе их цифровой и общий рост вскоре замедлится. Бренд искал решение, которое могло бы обеспечить удобство работы пользователей, особенно на мобильных устройствах.
PWA был ответом для команды Debenhams. После преобразования их старого веб-сайта в PWA их усилия, безусловно, окупились. Они улучшили качество обслуживания клиентов, убрав препятствия на пути клиента — медленные страницы, сложная для навигации структура, сложный процесс оформления заказа. В целом, выручка Debenhams от мобильных устройств увеличилась на 40 % , а число конверсий — на 20 % .
3. БМВ
Как новаторский бренд в автомобильной промышленности, BMW доказывает, что они не уклоняются от новых технологий, будь то их автомобили или их веб-сайт. Чтобы улучшить качество обслуживания клиентов, бренд стремился предоставить качественный и привлекательный контент, отражающий их ценности.
Новый PWA от BMW определенно производит впечатление «вау». Первое, что заметит каждый, — это изображения и видео в высоком разрешении, и Интернет загружается практически мгновенно со всеми этими функциями (в 4 раза быстрее, чем на старом сайте). Их отчеты также показали другие впечатляющие цифры после создания PWA: 4- кратное увеличение числа людей, переходящих с главной страницы на сайт продаж BMW; Увеличение числа мобильных пользователей на 50% и увеличение посещений сайта на 49% по сравнению со старым сайтом.
4. Флипборд
Будучи самым популярным социальным журналом в мире, Flipboard позволяет читателям быть в курсе всех тем, новостей и событий, которые им интересны, из одного места. В зависимости от интереса пользователя платформа объединяет новости и истории со всего мира в формате журнала. Пользователи Flipboard могут следить за своими любимыми источниками и сохранять истории, изображения и видео в свои собственные журналы Flipboard, чтобы читать их позже или делиться ими с другими.
Flipboard — один из лучших примеров PWA для онлайн-новостей. PWA сводит к минимуму использование данных, обеспечивая удобный и быстрый просмотр в красивом интерфейсе. До запуска PWA Flipboard был мобильным приложением, которое представлено только на мобильных устройствах. Следовательно, теперь PWA позволяет Flipboard предоставлять возможности, аналогичные их полнофункциональному нативному приложению в Интернете, что делает его доступным и для пользователей настольных компьютеров.
5. Звуковой фрагмент
Soundslice — это передовое программное обеспечение для музыкального образования в Интернете, которое революционизирует то, как музыканты изучают и практикуют музыку. Компания использует PWA, чтобы предоставить лучший опыт создания музыки и обучения. Программное обеспечение на основе PWA делает процесс изучения музыкального произведения проще и эффективнее для музыкантов-самоучек с помощью инновационного музыкального проигрывателя. Плеер Soundslice позволяет пользователям разучивать музыкальное произведение, читая и слушая его на любом устройстве, будь то телефон или настольный компьютер с большим экраном. Кроме того, учителя музыки могут использовать этот инструмент для создания интерактивных уроков музыки. Компания Soundslice, специализирующаяся на обучении на основе записей, также имеет магазин, в котором продаются уроки и транскрипции.
6. 2048 Игра
Игра-головоломка 2048 изначально была выпущена как бесплатное приложение для Android и iOS в 2014 году. Менее чем через неделю после запуска она сразу же стала вирусным хитом с более чем 4 миллионами пользователей. Игра проста и затягивает. Описанная как «Candy Crush для любителей математики», ее цель состоит в том, чтобы объединить блоки с одинаковыми числами, чтобы в итоге получить 2048. Официальная версия PWA доступна на 2048game.com, поэтому игроки могут получить мгновенный доступ из любого веб-браузера. Благодаря плавным переходам и полноэкранному режиму трудно отличить PWA от родного приложения. Кроме того, в PWA 2048 можно полноценно играть в автономном режиме.
7. Соверши путешествие
Сайт MakeMyTrip.com — отличный пример PWA. Ежемесячно сайт ведущей туристической компании Индии посещают около восьми миллионов человек, причем две трети приходится на мобильный трафик. Поскольку мобильные устройства становятся наиболее предпочтительным каналом для бронирования среди клиентов MakeMyTrip, они разработали PWA, что привело к быстрому, надежному и безупречному мобильному интернету.
Новый интерфейс PWA утроил коэффициент конверсии, сократив время загрузки страницы на 38%. По сравнению с предыдущим мобильным сайтом, MakeMyTrip увеличил количество пользовательских сеансов на 160 % и снизил показатель отказов на 20 % .
8. Убер
По мере того, как компания выходит на новые рынки, ее веб-сайт Uber был перестроен с нуля в виде PWA, чтобы предложить возможности бронирования, сопоставимые с родным мобильным приложением. Uber PWA разработан для того, чтобы сделать бронирование автомобиля доступным в низкоскоростных сетях 2G. Созданный на основе концепции приложения, доступного во всех современных браузерах, PWA отлично подходит для пользователей недорогих устройств, которые могут быть несовместимы с родным приложением Uber.
Благодаря нативному интерфейсу сверхлегкого веб-приложения Uber позволяет выполнять запросы на быструю поездку независимо от местоположения, скорости сети и устройства. Основное приложение размером всего 50 КБ позволяет ему загружаться в течение 3 секунд в сетях 2G.
9. Копа (падочник )
Kopa (ранее называвшаяся Padpiper) — это платформа, которая помогает учащимся легко находить надежное жилье для школьных семестров и стажировок, а арендодателям — быстро находить подходящих арендаторов для своих помещений. Фактически, платформа теперь поддерживает 9000 школ и имеет более 100 списков на PWA. Они проверили арендодателей и разместили отзывы, чтобы студенты могли сэкономить время на поиске наиболее подходящего жилья. После того, как учащиеся добавят рабочий адрес, они смогут искать направления работы в каждом списке на странице результатов. Веб-приложение также может связывать учеников с другими людьми, которые работают рядом с ними, или узнавать, где их одноклассники находятся в кооперативе.
10. Пинтерест
Сосредоточившись на международном росте, Pinterest начал свой новый мобильный веб-опыт с нуля как PWA. Социальная сеть обнаружила, что только 1% их мобильных пользователей конвертируются в регистрации, входы в систему или установки приложений из-за низкой производительности на мобильных устройствах.
Поняв, что возможности улучшить конверсию огромны, они перестроили мобильную сеть с помощью технологии PWA, что привело к нескольким положительным результатам: затраченное время увеличилось на 40% по сравнению с предыдущей мобильной сетью, увеличился доход от пользовательской рекламы. 44%, а основные обязательства выросли на 60%
11. Вкуснятина
Yummly — это интеллектуальная платформа для изучения кулинарии, которая изучает индивидуальные вкусы, потребности в питании, уровень навыков и многое другое, чтобы рекомендовать персонализированные рецепты, списки покупок и доставку продуктов в течение часа. Наряду со своим родным приложением для Android и iOS, Yummly также доступен в веб-браузерах как PWA. Как и его родное присутствие, The Yummly PWA предлагает поисковую систему для еды, кулинарии и рецептов. Он позволяет пользователям осуществлять поиск по более чем миллиону рецептов, полученных с популярных сайтов о еде, нишевых блогов или местных продуктовых брендов. Кроме того, результаты поиска можно фильтровать по ингредиентам, диете, аллергии, питанию, цене, кухне, времени, вкусу, блюдам и т. д.
12. Спотифай
Ваш любимый музыкальный плеер теперь поддерживает PWA. Из-за некоторых разногласий между Spotify и Apple относительно 30-процентной комиссии магазина приложений Apple, Spotify счел своевременным возможность начать разработку PWA-версии своего приложения, как это сделали многие другие крупные бренды. По сравнению со своим родным приложением версия PWA значительно быстрее благодаря собственному уникальному и адаптивному пользовательскому интерфейсу, который меняет свой фон по мере того, как пользователь продвигается по приложению. Как и во многих других PWA, пользователям также предлагается добавить Spotify PWA на главный экран, что делает Spotify PWA более доступным и сопоставимым с другими версиями.
Подведение итогов
PWA можно применять во многих разделах технологической сферы, от PWA-игр до PWA Magento. Чтобы лучше понять PWA и варианты его использования в вашей конкретной области, ознакомьтесь с другими нашими специальными статьями:
Дальнейшее чтение
