Apps web progresivas

Una app web progresiva (AWP) es una app web que usa mejoras progresivas para brindar a los usuarios una experiencia más confiable, usa capacidades nuevas para brindar una experiencia más integrada y se puede instalar. Además, como es una app web, puede llegar a cualquier persona, en cualquier lugar y dispositivo, con una sola base de código. Una vez instalada, una AWP se parece a cualquier otra app y, específicamente, tiene la siguiente apariencia:

  • Tiene un ícono en la pantalla principal, el selector de aplicaciones, el panel de lanzamiento o el menú de inicio.
  • Aparece cuando buscas apps en el dispositivo.
  • Se abrirá en una ventana independiente, completamente separada de la interfaz de usuario de un navegador.
  • Tiene acceso a niveles más altos de integración con el SO, por ejemplo, manejo de URLs o personalización de la barra de título.
  • Funciona sin conexión.

La plataforma web

La Web es una plataforma increíble. Su combinación de universalidad en los dispositivos y sistemas operativos, su modelo de seguridad centrado en el usuario y el hecho de que ninguna empresa controle su especificación o implementación la convierte en una plataforma potente para entregar software.

Combinado con la capacidad de vinculación inherente de la Web, es posible buscar en ella y compartir lo que encuentras con cualquier persona, en cualquier lugar. Cada vez que visitas un sitio web, se trata de la versión más reciente que implementó el publicador, y tu experiencia con ese sitio puede ser tan temporal o permanente como desees.

Las aplicaciones web pueden llegar a cualquier persona, en cualquier lugar y dispositivo, con una sola base de código. Para los desarrolladores, la Web también les ofrece un mecanismo de implementación transparente y sencillo. No es necesario empaquetarlo, revisar el contenido adicional ni generar demoras en las actualizaciones. Los usuarios siempre obtienen la versión más reciente cuando visitan tu app. Con nuevas capacidades y técnicas, una app web ahora te permite interactuar o ver contenido incluso sin conexión, un obstáculo que hace unos años era imposible superar.

Apps específicas de la plataforma

Las apps específicas de cada plataforma, tanto en dispositivos móviles como en computadoras, son conocidas por ser enriquecidas y confiables. Están siempre presentes en las pantallas principales, en la estación de carga y en las barras de tareas. Funcionan sin importar la conexión de red y se inician en su propia experiencia independiente. Pueden leer y escribir archivos desde el sistema de archivos local, acceder al hardware conectado a través de USB, en serie o Bluetooth, e interactuar con los datos almacenados en tus dispositivos, como contactos y eventos de calendario. En aplicaciones específicas de la plataforma, puedes tomar fotos, reproducir canciones en la pantalla principal o controlar la reproducción de contenido multimedia mientras estás en otra app. Estas aplicaciones se sienten como parte del dispositivo en el que se ejecutan.

Un desafío para las apps específicas de una plataforma es que no son compatibles con varias plataformas y dispositivos, por lo que no es fácil, si es posible, mover una app para Android a iOS o iOS a Windows o ChromeOS sin crear una app nueva desde cero.

Lo mejor de ambos mundos

Si piensas en las apps de plataforma y las apps web en términos de capacidades y alcance, las apps de plataforma representan lo mejor de las capacidades, mientras que las apps web representan el mejor alcance. Las aplicaciones web progresivas se sitúan en la intersección de las capacidades de las aplicaciones de plataforma y el alcance de las aplicaciones web. Una aplicación web progresiva incluye funciones de ambos mundos.

Web

  • Vinculabilidad
  • Accesible de forma predeterminada
  • Ubicuo
  • Fácil de implementar
  • Fácil de actualizar
  • Todos pueden publicar el contenido.

Apps de plataforma

  • Compatible sin conexión
  • Alto rendimiento
  • Integración de dispositivos
  • Experiencia independiente
  • Ícono instalado
  • Enriquecedora y confiable

La adopción tiene sus beneficios

Hulu, un servicio de transmisión de video por Internet de EE.UU., creó una versión de app web progresiva de su experiencia para reemplazar las apps de escritorio que tenían malas opiniones de los usuarios y poco uso. Como se compartió en Google I/O 2019, un desarrollador podría investigar e implementar esta experiencia desde su aplicación web existente en dos semanas.

En cinco meses, el 96% de los usuarios de su app heredada adoptaron la AWP, con un aumento del 27% en las visitas recurrentes y un aumento del 5.5% en la participación. Debido a que se encuentran en el selector y en las barras de tareas, es más fácil volver a las AWP que si solo estuvieran en una pestaña.

JD.ID, una plataforma de comercio electrónico de Indonesia que proporciona servicios de entrega para muchos productos, quería expandir su presencia en línea centrándose en el rendimiento y en una experiencia sólida independiente de la red para su AWP. Con esta experiencia mejorada, aumentaron su porcentaje general de conversiones móviles en un 53%, 200% para los usuarios instalados, y sus usuarios activos por día, en un 26%.

Clipchamp es un editor de video en línea para computadoras de escritorio y integrado en el navegador que permite que cualquier persona cuente historias que valga la pena compartir en videos. Observó un aumento del 9% en la retención de usuarios con su AWP en comparación con sus usuarios estándar de aplicaciones para computadoras de escritorio, y sus instalaciones de AWP aumentaron un 97% por mes en los primeros cinco meses de lanzamiento.

Gravit Designer de Corel Corporation es una herramienta potente de diseño de vectores para computadoras de escritorio que entrega a decenas de miles de usuarios activos por día un software de ilustración de vectores valioso, asequible y accesible. Desde que se agregó una AWP como opción de instalación para los usuarios, observaron que los usuarios de AWP son un 24% más activos, que la AWP representa un 31% más de usuarios recurrentes y que los usuarios de AWP tienen 2.5 veces más probabilidades de comprar Gravit Designer PRO, en comparación con sus otras plataformas y opciones de instalación.

Lo que cambió las reglas del juego

Un gran ejemplo del poder de las apps web progresivas es la industria de las plataformas de transmisión, incluidos los videojuegos en la nube y la computación remota. Desde 2021, la mayoría de los proveedores de juegos en la nube lanzaron apps web progresivas, lo que te permite jugar juegos de consola desde cualquier dispositivo y solo desde un navegador o una instalación de AWP: iPhone, Android, iPad, laptops, Macs o PCs. Amazon Luna, Microsoft Xbox Cloud Gaming, Facebook Gaming, Google Stadia, Nvidia GeForce Now y BlueStacks X ofrecen soluciones de videojuegos en la nube por medio del navegador como AWP. Todos proporcionan una gran experiencia con un rendimiento similar al nativo en todas las plataformas gracias a tecnologías web como las APIs de WebRTC, WebAssembly y GamePad.

Desafíos

Ahora que explicamos las ventajas de usar la plataforma web para publicar AWP, también es importante que tengas en cuenta los desafíos a los que te puedes enfrentar.

Compatibilidad entre navegadores

Apple es una empresa crucial para el mundo de múltiples dispositivos, con iOS, iPadOS, macOS y Safari. Si bien Apple nunca usó el término AWP en público, desde 2018 en Safari para iPhone y iPad, se respaldan las tecnologías que permiten que una AWP se pueda instalar y funcione sin conexión.

Sin embargo, la implementación de Apple de las especificaciones de la AWP no incluye muchas funciones de otros navegadores, en particular, aquellos con tecnología del motor Chromium.

En el medio, también tenemos Firefox y su motor Gecko con implementaciones que incluyen más especificaciones de AWP en Android y menos capacidades de instalación en computadoras de escritorio.

Las limitaciones incluyen la falta de notificaciones push, APIs de integración (como Web Bluetooth o WebNFC) y técnicas de promoción de instalación que ayudan a los usuarios a saber que pueden instalar el sitio web actual para obtener una experiencia en la app. Además, hay varios errores con las funciones implementadas.

Al igual que con todo el desarrollo web, es obligatorio probar tu experiencia en todas las plataformas cuando lanzas tu AWP y cuando se lanza una versión importante del navegador o del SO. Siempre debes proporcionar soluciones de resguardo o experiencias alternativas cuando una función no esté disponible.

Conocimiento de las AWP

Como desarrollador de AWP, es probable que tengas un problema de reconocimiento tanto a nivel empresarial como de usuario. Algunos propietarios de empresas no sabrán de las AWP o tendrán ideas erróneas sobre el poder y los desafíos de las aplicaciones web progresivas.

Cuando publicas una AWP, tu próximo desafío es asegurarte de que los usuarios comprendan que el sitio web se puede instalar, lo que lleva a una experiencia de la app instalada.

El desafío de instalación es más significativo en algunas plataformas, como iOS y iPadOS, y, a veces, los diseñadores de UX incluyen pantallas que le explican al usuario cómo instalar la app.

Compatibilidad

Debes recordar que una app web progresiva es solo una app web, por lo que el contenido y los servicios se ejecutan sobre las especificaciones y los protocolos estándar. Por lo tanto, técnicamente, una AWP se ejecuta en cualquier lugar donde se ejecute la Web; no es necesario que la plataforma sea compatible con ninguna "especificación de la AWP".

Sin embargo, cuando hablamos de AWP y compatibilidad, por lo general, pensamos en las capacidades para cruzar los límites del navegador y los contextos solo en línea: instalación de íconos y soporte sin conexión.

Además de la compatibilidad con la plataforma web clásica, analicemos la compatibilidad con las funciones básicas de la app, como la instalación de íconos y las capacidades sin conexión.

    97 %

    Navegadores sin conexión

    88 %

    Los usuarios web pueden instalar una AWP

Datos obtenidos de StatCounter y Can I Use

Computadoras de escritorio y laptops

En un mundo de dispositivos de varios factores, es un desafío saber qué es un dispositivo de escritorio. Aun así, al menos desde el punto de vista del sistema operativo, estos navegadores y almacenes son compatibles con la instalación de la AWP y las capacidades sin conexión:

Windows 10 y 11
Google Chrome (desde la versión 73), Microsoft Edge (desde la versión 79), Microsoft Store
ChromeOS
navegador Chrome integrado (a partir de la versión 72), Play Store (desde la versión 85)
macOS, Linux, y Windows 7 y 8.x
Google Chrome (a partir de la versión 73), Microsoft Edge

En el siguiente video, el usuario instala una AWP desde el navegador en una computadora de escritorio y, luego, accede a ella como cualquier otra app con su ventana independiente.

Dispositivos móviles

En cuanto a los teléfonos celulares y las tablets, una app web progresiva se puede instalar con capacidades sin conexión a través de los siguientes navegadores y tiendas de aplicaciones:

iOS y iPadOS
Safari (a partir de iOS 11.3), AppStore (a partir de iOS/iPadOS 14, con algunas limitaciones) y configuración móvil para la distribución empresarial
Android
Firefox, Google Chrome, Samsung Internet, Microsoft Edge, Opera, Brave, navegador Huawei, Baidu, UCWeb, Play Store (de la versión 72 con Google Chrome instalado o navegadores compatibles con TWA), Galaxy Store, iframe de Play administrado para distribución empresarial.

En el siguiente video, el usuario instala una AWP desde el navegador en un dispositivo móvil usando el diálogo del navegador y también el menú Agregar a la pantalla principal.

Otros dispositivos

Otros dispositivos pequeños admiten AWP, como las consolas de juegos (Xbox con Microsoft Store) o los dispositivos XR (Microsoft Hololens, planes para Oculus de Facebook). Sin embargo, el resto de los dispositivos con navegador no suelen aceptar AWP, incluidos los siguientes:

  • Consolas de juegos
  • Smart TVs
  • Relojes inteligentes
  • Autos

Tu AWP siempre funcionará en el navegador de todos los dispositivos con sus limitaciones específicas. Esta capacidad de funcionar en muchos dispositivos te permite crear recorridos multidispositivo, en los que el usuario puede iniciar una tarea en un dispositivo y completarla en otro, con datos sincronizados entre ellos, exactamente con la misma app implementada.

Recursos