PWA & APPs, No VS.

Sebi Palatnik
El Riesgo Es No Cambiar
14 min readJun 23, 2017

En el mundo se pierden millones de dólares por todavía encontrar páginas web móviles que están mal diseñadas y/o son lentas al momento de cargarse en un “Smartphone”.

By CLINC!

Las razones más usuales de esto son: las redes de datos, falta de flexibilidad en plataformas de desarrollo, comportamientos web replicados en móviles, altos precios para crear soluciones efectivas y lo más importante, el usuario de móviles que demanda una experiencia más profesional. Si te estás preguntando cómo performa tu sitio, fijate en WebPageTest.Org o TestMySite.withgoogle.com para tener un primer insight.

En CLINC! queremos que nuestros clientes brinden una experiencia superadora omnichannel para sus consumidores y por eso trabajamos en la comunicación, decisión y punto de venta de la marca para que, con tecnología, logren ser efectivos, útiles y concretos.

Hace años que Google habla de “micro-momentos digitales” donde una marca debe ser útil, concreta y efectiva para satisfacer al usuario. Las APPs -Nativas- convirtieron este problema en una oportunidad para comenzar a trabajar este comportamiento con muy buenos resultados. En estos últimos días y haciéndose público en el evento más importante de Google en San Francisco (Google I/O) se dieron a conocer nuevas tecnologías que pueden ayudar a que esto siga mejorando: las PWA.

PWA + APP = Canal Mobile

Como lo define Google en su Web las Progressive Web Apps (en sus siglas PWA) son “experiencias que combinan lo mejor de la Web y lo mejor de las apps. Están disponibles para los usuarios a partir de la primera visita en una pestaña del navegador y no requieren instalación. A medida que el usuario genera progresivamente una relación con la app con el paso del tiempo, ésta se hace más y más poderosa. Se carga rápidamente, incluso con redes débiles, envía notificaciones push relevantes, tiene un ícono en la pantalla principal y se carga como experiencia de pantalla completa y de primer nivel”. Ya no estamos hablando sobre APPs híbridas cuya performance está muy por debajo de lo esperado en comparación a una APP Nativa, sino que estamos evaluando el canal móvil en su totalidad para poder cumplir con la expectativa del consumidor y tener un punto de contacto listo para su comportamiento.

Al leer esto muchos líderes de la industria comenzaron a preguntarse, ¿Es otra falsa expectativa de democratizar la subida de apps a los Stores y, a la vez, aprovechar el máximo potencial del dispositivo? ¿Cómo vivirán las apps -nativas- con esta nueva tecnología? ¿Será un rumor con años de por medio hasta ser lanzado como las Instant Apps?

Sin duda un universo de preguntas con la urgencia de ser respondidas ya que el gigante de la web no tiene tiempos ni amigos para imponer tecnologías que, si bien mejoran la experiencia del consumidor, tienen la intención de ser utilizadas por la mayor cantidad de desarrollos online ubicándolos como líderes en las tendencias de mayor movimiento (y crecimiento) como lo es el tráfico desde móviles.

Pero no todo es color de rosa para esta tecnología que ya fue elegida por grandes de la industria online en diferentes lugares del mundo como Alibaba, OLX, diarios como Infobae, entre otros. Pueden ver casos aquí: https://pwa.rocks/ o los que menciona Google como éxitos en https://developers.google.com/web/showcase/2017.

¿Por qué decimos esto? Hay varias razones, algunas técnicas otras más antropológicas que permiten visualizar ventajas y desventajas de esta tecnología que llegó para quedarse. Luego de un extenso análisis en el aún escaso historial de PWA, conversando con responsables de estos casos y con expertos de PWA de Google logramos conformar este informe con algunos de estos datos. Aún mejor, logramos alcanzar una conclusión compartida e interesante: La PWA y las APPs no compiten, se complementan.

Un Análisis Inicial

En primer lugar, este excelente análisis que hacen los expertos de Mobile en Google España. Los primeros datos que comparten tienen que ver con el comportamiento del consumidor con mAPP y mSite (PWA):

Think with Google

Aquí vemos claramente 3 temas que a lo largo de este artículo vamos a repetir constantemente:

  • La Audiencia en web, lógicamente, tiene mayor potencial que una APP ya que ésta suele ser entre un 10 y 30% de la audiencia total quién suele utilizarla.
  • La Distribución en web también tiene mayor potencial para el usuario en el momento en el cual visita la marca. Si bien el rebote (bounce rate) en nuestro sitio es un problema enorme, es aún más interesante para la web ya que la descarga de una app ocurre únicamente cuando hay un beneficio dado (no hablamos de ofertas, sino de un beneficio).
  • El Engagement es uno de los conceptos más interesantes que definen si la marca comprende cómo crear relaciones de largo plazo con sus usuarios. Las apps aún son la tecnología más importante para esto por tiempos de uso, fluidez y funcionalidad.

La velocidad que supo ser uno de las ventajas más importantes de las APPs, en las PWA se soluciona de forma efectiva poniendo ambas a la misma altura al momento de navegación. Antes ese segundo que daba un 27% más de conversión solo en APPs ahora es alcanzable también desde la web móvil.

El diseño o User Interface (UI) desde hace tiempo que ya está disponible tanto para web como para las APPs. De hecho, muchas marcas comenzaron a trabajar en lo que sería el predecesor de las PWA: las Web Apps. Material Design de Google y otros consejos son claves sin importar la tecnología para una excelente experiencia.

Retención

En este video se puede entender por qué una PWA es relevante para retener a los usuarios. Tenemos dos conceptos importantes para analizar que en las APPs siempre fueron clave: el ícono en la pantalla y las notificaciones.

Una de las principales funcionalidades de una APP hasta el momento tenía que ver con el envío de notificaciones push, que tienen 5x mejor click-rate que un email. Enviar notificaciones en PWA también es una opción, lo que permite generar una experiencia omnicanal de mensajes orientados a informar y convertir según el comportamiento del consumidor.

Con la incorporación de esta posibilidad el mundo comenzó a preguntar qué diferencias existen entre las Push de una APP y las Push de una PWA. Los expertos indican que si bien el usuario el mensaje lo visualiza de forma similar, la marca no cuenta con la misma capacidad de enviar mensajes a usuarios. En ambos casos el usuario debe aceptar el envío de notificaciones -subscribirse a ellas- pero en PWA se envía un Identificador Web a backend para ser guardado y utilizado (incluso con el navegador cerrado) en el envío de la Push. Lo que Web Push no guarda es lo que conocemos como el Identificador de Dispositivo, propio del aparato en sí mismo. Más abajo, explicamos técnicamente qué sucede con este ID que ubica a las APPs aún por encima de las PWA en algunos casos de uso. El análisis de contexto desde una APP por el momento está algo más evolucionado que en PWA lo que permite segmentar las push más efectivamente.

Google Documentation

Por otro lado, recomendamos que se solicite aceptar las notificaciones en PWA en un momento que tenga sentido (ej: si el usuario se interesa por un producto, recién ahí preguntarle si quiere recibirlas). La razón es que si niega este permiso, lo estará haciendo a nivel de sitio, con lo cual Chrome no volverá a mostrar notificaciones para ese usuario. En las APPs se suele manejar esta configuración desde el Perfil del usuario dentro de la misma. Más importante aún, la marca debe tener sumo cuidado al enviar notificaciones para aquellos usuarios que aceptaron permisos de PWA y tienen instalada la APP para no recibir dos notificaciones duplicadas.

El famoso banner para instalar la APP se estará reemplazando por el Add To Home Screen que permite agregar el ícono del sitio en la pantalla del usuario, lo que permite ingresar al sitio directamente.

Google Documentation

Una métrica importante de retención tiene que ver con la cantidad de personas que quitaron el ícono de la pantalla a los cuales no podemos pedirles que ingresen de forma rápida desde sus dispositivos. En PWA no se puede medir este “Uninstall” y nos deja un hueco en comprender el comportamiento del usuario al momento que decide que la marca no es más relevante. Por ejemplo, no podemos trazar un cohort para saber en qué semana se desinstaló.

Por último, la atribución de un usuario y su capacidad para seguirlo no es posible en PWA ya que no podemos obtener los IDs para Ads de iOS o de Google: GAID/IDFA. Con APPs es fácil identificar estos IDs y usarlos dinámicamente para retargeting. Si el usuario mira un producto dentro de la APP, puede ser targeteado por Facebook u otra ad-network. En este gráfico lo explica AppsFlyer, empresa que se dedica a medir la atribución de las campañas. Mismo Appsflyer indica que aún no tuvieron que agregar a su roadmap cómo atribuir una instalación de PWA, sino que sigue siendo la APP líder en esta funcionalidad.

AppsFlyer Documentation

El deeplink es el recurso que tiene una APP para redirigir a un usuario directo a una vista particular, así como PWA tiene su link. Sin embargo al hacer click en un link, no se abrirá la PWA instalada sino que se abrirá el browser. Al hacer click en el Deeplink, se abrirá la APP.

Técnicamente Hablando

Tanto las APPS como PWA hoy tienen lenguajes que permiten respetar los elementos de cada sistema operativo. Google Developers tiene a disposición toda la documentación necesaria para esto y también lanzó un curso de Primeros Pasos en Udacity.

Cuando empezamos a hilar fino las PWA al correr en web no cuentan aún con el soporte necesario para todo el hardware que un dispositivo puede maximizar desde una APP. Por ejemplo, WebVR está en beta en varios navegadores pero aún no es algo comercial; para las APPs VR es una realidad que ya es un caso de uso desde las escuelas hasta la NASA. El listado completo de features soportados en este momento se puede encontrar en https://whatwebcando.today. Es bueno ir haciendo seguimiento de ese sitio para ver cuándo se van incorporando.

Como mencionamos arriba, las Web Push no guardan un Device ID, pero permiten identificar unívocamente a ese browser, e instancia del Service Worker en un device determinado. Cada navegador maneja las notificaciones push a través de su propio push service, cuando el usuario se subscribe lo hace a este servicio. Esto crea un objeto que contiene una public key y el “endpoint URL del push service”, el cual es diferente para cada browser. La notificación se envía a esta URL, encriptada con la clave pública, y el servicio lo envía al cliente correcto. ¿Cual es el correcto? El endpoint URL contiene un identificador único que se usa para direccionar el mensaje al dispositivo correcto que luego el browser procesa para identificar qué servicio debe correrse. No se puede determinar información personal del identificador ni se puede usar para trackear usuarios, lo cual diferencia a las APPs.

PWA no permite que dentro de las opciones de “Compartir” se considere la marca como una APP a la cual compartir, por ejemplo: Si estás en chrome y queres compartir un link, cuando te da opcion de las apps donde lo queres compartir, PWA Icon no aparece ahí. Para ShoppingApps no tiene mucho sentido.

El punto más débil para las PWA viene asociado a algo más allá que la tecnología ya que hablamos de industria, de líderes de mercado: en este caso Apple, dueño del otro 50% de los usuarios online. Sin ceder el brazo a torcer para soportar PWA es así que el Install Banner o las WebPush solo están funcionando en dispositivos Android, lo que deja afuera a gran parte de tu audiencia y, en algunas casos, al 100% de la misma. ¿Cómo es esto? iOS no ha incorporado aún soporte para Service Workers ni en Safari, ni en otros Browsers como Chrome, ya que, por restricciones a terceras partes, los distintos browsers en iOS deben utilizar el Webkit rendering engine, que aún no los ha incorporado.

En general, aquí pueden ver el estado de adopción de SW en distintos browsers, y aquí podrán realizar seguimiento de la incorporación de Service Workers por parte de Apple (el cual se encuentra “en consideración” en estos momentos). En cuanto a la forma de dar compatibilidad, al desarrollar una PWA, siempre se programa con un enfoque basado en “Progressive Enhancement”, consultando si un feature se encuentra disponible, y sino, no se utiliza dicha funcionalidad. En el caso de iOS, el sitio funcionará perfectamente, pero no incluirá los últimos features que proporciona un Service Worker (Offline, WebPush, etc).

El análisis que hace Aaron Gustafson para Microsoft es muy interesante y está online (inglés) donde habla un poco de todo esto aquí.

Encontrarán “un pero” argumentando resultados igualmente relevantes como con AliExpress en iOS, lo que no quita que cada marca deba hacer un análisis previo de su audiencia, su comportamiento y qué espera en cuanto a esto para implementar PWA. Más aún, se reafirma un acercamiento a la conclusión que proponemos donde PWA y APP deben convivir en la estrategia móvil de una marca.

Posicionamiento

Es parte de la ecuación de la innovación que el usuario marque su aceptación en el mercado y que esto demuestre quiénes lideran el mercado. Para el usuario descargar una APP del Store es un paso más en su Customer Journey pero para la marca es un éxito que al buscar su nombre el primer resultado sea su APP.

Las reviews y las calificaciones son parte intrínseca de saber qué servicio es mejor para lo que estamos buscando. De hecho, son múltiples las ocasiones en las cuales un usuario decide descargar una APP por sobre otra dependiendo de su calificación. En PWA, el posicionamiento ocurre dentro del buscador de Google y quienes usen esta tecnología posicionarán mejor por el nivel de calidad que se analiza para listar los resultados.

No confundir PWA con AMP Project, una propuesta open-source que busca optimizar la construcción de sitios web móviles.

No es solo un rumor

Hace un tiempo Google comenzó el rumor de que las APPs no iban a requerir ser descargadas sino que con una tecnología innovadora iban a poder abrir una vista de una APP directo. Esto se llama Instant Apps. Google define esta tecnología como “…un salto evolutivo en el uso compartido y el descubrimiento de apps, que permite ejecutar apps de Android de manera instantánea sin necesidad de instalarlas. Gracias a Instant Apps, puedes experimentar los aspectos que más te gustan de las apps (interfaces de usuario rápidas y atractivas, alto rendimiento y grandes capacidades) con solo un toque.”

Google Documentation

Este año se lanzó la documentación para comenzar a utilizar las mismas aunque todavía no se sabe muy bien la confiabilidad y el caso de uso validado. De hecho, hay que solicitar entrar a la prueba limitada. ¡Insóilito!

En Google I/O del 2016 se comentó que las Instant Apps iban a permitir que desde una búsqueda de Google, por ejemplo, el link abra directamente una vista de la APP sin tener que descargarla. No cuenta con trabajo en segundo plano, ni notificaciones o trackeo de información.

Conclusión

Con lo cual, hoy en día en una PWA se puede hacer prácticamente lo mismo que en una app, pero sin la fricción de dirigirnos a un Store, y con el consiguiente ahorro de espacio de almacenamiento (Twitter Lite, por ejemplo, es una PWA que pesa 600KB y ofrece prácticamente la misma funcionalidad de la app, que pesa 23.5MB).

Si contamos con que iOS aceptará esta tecnología y que el soporte al hardware incrementará para Bluetooth, NFC, y otros, aún mercado distingue las APPs como una tecnología confiable y necesaria para el usuario. La experiencia y la naturalidad de las APPs parecería no poder ser copiable por su prima hermana la PWA. Desde otro punto de vista, entramos a decenas de sitios por semana pero solo vemos pocas apps: el usuario puede cansarse fácilmente de los constantes pedidos de PWA que ve reiteradamente y de cientos de notificaciones, lo que puede llevar a no aceptar ninguna de ambas acciones desde un sitio web móvil. Dependerá, tal vez, de la profesionalidad de las marcas para controlar cuándo mostrar un install o enviar una web push.

Alec Oxenford, CEO de LetGo & Cofundador de OLX, cuenta que en LetGo están probando PWA aunque aún el comportamiento de los usuarios elige la APP por costumbre, facilidad y, como decimos anteriormente, PWA aún no logra esa experiencia recibida al 100%. En LetGo miden sus métricas en todo el canal mobile unificando APP y Web Mobile, y consideran que una de sus funcionalidades claves es el Chat. El Chat-Commerce como caso es una realidad en el mundo de las APPs, lo que en PWA aún no está muy claro, por ejemplo, para saber si la conversación puede seguir con la marca a través del navegador sin tenerlo registrado. Los líderes de la industria irán marcando el ritmo de cuán importante es contar con ambos puntos de venta, recomendamos seguir sus estrategias día a día.

Uno de los pilares de esta conclusión tiene que ver con la capacidad de ser flexible y rápido para probar un poco de todo, medir y seguir al usuario. Recordemos que cientos de tecnologías fueron lanzadas al mercado para mejorar la experiencia del consumidor y nunca llegaron a ser adoptadas por los mismos. Esto nos obliga a tener cuidado en decidir NO estar en uno de estos canales: si los usuarios deciden que instalar una app desde el browser no es “tan bueno” como descargar una APP, el Install PWA no va a ser un éxito para reemplazar una APP sino que quedará como un excelente sitio web móvil.

El próximo billón de usuarios sin duda está en el móvil, PWA permitirá darles servicio a todos ellos y la APP permitirá a la marca retenerlos, motivarlos, trackearlos e impulsarlos a la acción, al menos hasta que el smartphone quede obsoleto… pronto (?). PWA llegó como una tecnología que va a dar que hablar y: a) aún no está tecnológicamente completa b) la percepción del usuario aún da unos años de vida a las APPs como la tecnología clave para beneficios y relación directa con la marca. Este billón de usuarios decidirá cuál de las dos tecnologías vivirá.

Esto nos invita a pensar HOY en nuestra estrategia móvil con PWA & APP, no Versus, al menos por unos años o hasta que los usuarios indiquen lo contrario.

¿Te gustó el artículo?

¡Excelente! Tiene mucho análisis y tiempo para dar una opinión relevante del tema. Lo que te pido, compartí la fuente :D ¡Gracias!

Bibliografía

https://developers.google.com/web/fundamentals/getting-started/codelabs/your-first-pwapp/?hl=es-419

https://developers.google.com/web/showcase/2017

https://www.thinkwithgoogle.com/intl/es-es/article/mejorando-la-experiencia-y-la-conversion-movil-segundo-a-segundo/

https://www.thinkwithgoogle.com/intl/es-es/collection/principios-del-diseno-de-aplicaciones-moviles-atrae-a-los-usuarios-y-genera-conversiones/

https://github.com/googlecodelabs/your-first-pwapp/archive/master.zip

https://developers.google.com/web/progressive-web-apps/

https://en.wikipedia.org/wiki/Progressive_web_app

https://developers.google.com/web/fundamentals/native-hardware/?hl=es-419

https://jakearchibald.github.io/isserviceworkerready/

https://blog.itnig.net/what-app-to-build-in-2017-native-hybrid-or-progressive-web-apps-e1dd31c11aa5

https://www.appsflyer.com/resources/3-ways-to-attribute-measure-app-install-campaigns-cheat-sheet

https://yourstory.com/2017/03/progressive-web-vs-native-apps-will-mobile-experience/

https://www.slideshare.net/AaronGustafson/progressive-web-apps-and-the-windows-ecosystem-build-2017

--

--