Instalar tu app web progresiva (AWP) puede facilitar que los usuarios la encuentren y la usen. Incluso con la promoción del navegador, algunos usuarios no se dan cuenta de que pueden instalar una AWP, por lo que puede ser útil proporcionar una experiencia en la app que puedas usar para promover y habilitar su instalación.
Este artículo no es exhaustivo, pero ofrece un punto de partida para diferentes formas de promover la instalación de tu AWP. Sin importar el patrón o los patrones que uses, todos conducen al mismo código que activa el flujo de instalación, que se documenta en Cómo proporcionar tu propia experiencia de instalación integrada en la app.
Prácticas recomendadas
Existen algunas prácticas recomendadas que se aplican sin importar los patrones promocionales que uses en tu sitio.
- Mantén las promociones fuera del flujo de los recorridos del usuario. Por ejemplo, en la página de acceso de una AWP, coloca el llamado a la acción debajo del formulario de acceso y el botón Enviar. El uso invasivo de patrones promocionales reduce la usabilidad de tu AWP y tiene un impacto negativo en las métricas de participación.
- Incluye la posibilidad de descartar o rechazar la promoción. Recuerda la preferencia del usuario si lo hace y solo vuelve a preguntar si hay un cambio en la relación del usuario con tu contenido, por ejemplo, si accedió o completó una compra.
- Combina técnicas en diferentes partes de tu AWP, pero ten cuidado de no abrumar ni molestar al usuario con la promoción de instalación.
- Solo muestra la promoción después de que se haya activado el evento
beforeinstallprompt.
Promoción automática del navegador
Cuando se cumplen ciertos criterios, la mayoría de los navegadores le indican automáticamente al usuario que tu app web progresiva se puede instalar. Por ejemplo, Chrome para computadoras de escritorio muestra un botón de instalación en el cuadro multifunción.
Chrome para Android le muestra al usuario una minibarra de información, aunque puedes evitarlo si llamas a preventDefault() en el evento beforeinstallprompt.
Si no llamas a preventDefault(), el banner se mostrará la primera vez que un usuario visite tu sitio y cumpla con los criterios de instalación en Android y, luego, después de aproximadamente 90 días.
Patrones promocionales de la interfaz de usuario
Los patrones promocionales de la interfaz de usuario se pueden usar para casi cualquier tipo de AWP y aparecen en lugares como la navegación del sitio y los banners. Al igual que con cualquier otro tipo de patrón promocional, es importante tener en cuenta el contexto del usuario para minimizar la interrupción del recorrido del usuario.
Los sitios que consideran el momento de activar la IU de promoción logran una mayor cantidad de instalaciones y evitan interferir en el recorrido de los usuarios que no están interesados en la instalación.
Botón de instalación simple
La UX más simple posible es incluir un botón "Instalar" o "Obtener app" en una ubicación adecuada de tu contenido web. Asegúrate de que el botón no bloquee otras funciones importantes y esté fuera del recorrido del usuario por la aplicación.
Encabezado fijo
Este es un botón de instalación que forma parte del encabezado de tu sitio. A menudo, otros contenidos del encabezado incluyen el desarrollo de la marca del sitio, como un logotipo y el menú de opciones. Los encabezados pueden tener position:fixed o no, según las funciones de tu sitio y las necesidades del usuario.
Cuando se usa de manera adecuada, promocionar la instalación de la AWP desde el encabezado de tu sitio es una excelente manera de facilitar que tus clientes más leales regresen a tu experiencia. Los píxeles del encabezado de la AWP son muy valiosos, así que asegúrate de que tu llamado a la acción de instalación tenga el tamaño adecuado, sea más importante que otro posible contenido del encabezado y sea no intrusivo.
Asegúrese de seguir estos pasos:
- No muestres el botón de instalación, a menos que se haya activado
beforeinstallprompt. - Evalúa el valor del caso de uso instalado para los usuarios. Considera usar la segmentación selectiva para presentar tu promoción solo a los usuarios que probablemente se beneficien de ella.
- Utilice el valioso espacio en el encabezado de manera eficiente. Considera qué más sería útil ofrecer al usuario en el encabezado y sopesa la prioridad de la promoción de instalación en relación con otras opciones.
Menú de navegación
El menú de navegación es un excelente lugar para promover la instalación de tu app, ya que los usuarios que lo abren indican que están interactuando con tu experiencia.
Asegúrese de seguir estos pasos:
- Evita interrumpir el contenido de navegación importante. Coloca la promoción de instalación de la AWP debajo de los demás elementos del menú.
- Ofrece una presentación breve y relevante que explique por qué el usuario se beneficiaría de instalar tu AWP.
Página de destino
El propósito de una página de destino es promocionar tus productos y servicios, por lo que es apropiado aumentar el tamaño a la hora de promocionar los beneficios de instalar tu AWP.
Primero, explica la propuesta de valor de tu sitio y, luego, infórmales a los visitantes qué obtendrán de la instalación.
Asegúrese de seguir estos pasos:
- Destaca las funciones más importantes para tus visitantes y enfatiza las palabras clave que podrían haberlos llevado a tu página de destino.
- Haz que la promoción de instalación y el llamado a la acción sean atractivos, pero solo después de haber dejado clara tu propuesta de valor. Después de todo, esta es tu página de destino.
- Considera agregar una promoción de instalación en la parte de la app en la que los usuarios pasan la mayor parte del tiempo.
Banner de instalación
La mayoría de los usuarios encontraron banners de instalación en las experiencias en dispositivos móviles y están familiarizados con las interacciones que ofrecen los banners. Los banners deben usarse con cuidado, ya que pueden interrumpir al usuario.
Asegúrese de seguir estos pasos:
- Espera hasta que el usuario haya demostrado interés en tu sitio antes de mostrar un banner. Si el usuario descarta el banner, no vuelvas a mostrarlo, a menos que active un evento de conversión que indique un mayor nivel de participación con tu contenido, como una compra en un sitio de comercio electrónico o el registro para obtener una cuenta.
- Brinda una breve explicación del valor de instalar tu AWP en el banner. Por ejemplo, puedes diferenciar la instalación de una AWP de una app para iOS o Android si mencionas que casi no usa almacenamiento en el dispositivo del usuario o que se instalará al instante sin un redireccionamiento a la tienda.
IU temporal
La IU temporal, como el patrón de diseño Snackbar, notifica al usuario y le permite completar una acción con facilidad, en este caso, instalar la app. Cuando se usan correctamente, estos tipos de patrones de IU no interrumpen el flujo del usuario y, por lo general, se descartan automáticamente si el usuario los ignora.
Muestra la barra de notificaciones después de algunas interacciones con la app. Si aparece durante la carga de la página o fuera de contexto, puede pasarse por alto con facilidad o generar una sobrecarga cognitiva. Cuando esto sucede, los usuarios simplemente descartan todo lo que ven. Recuerda que es posible que los usuarios nuevos de tu sitio no estén listos para instalar tu AWP. Por lo tanto, es mejor esperar hasta obtener fuertes indicadores de interés del usuario antes de usar este patrón, por ejemplo, visitas repetidas, acceso de usuario o un evento de conversión similar.
Asegúrese de seguir estos pasos:
- Muestra la barra de notificaciones durante 4 a 7 segundos para que los usuarios tengan tiempo suficiente para verla y reaccionar, sin interferir.
- Evita mostrarlo sobre otra IU temporal, como banners, etcétera.
- Espera hasta obtener indicadores de interés sólidos del usuario antes de usar este patrón, por ejemplo, visitas repetidas, el acceso de un usuario o un evento de conversión similar.
Después de la conversión
Inmediatamente después de un evento de conversión del usuario, por ejemplo, después de una compra en un sitio de comercio electrónico, es una excelente oportunidad para promover la instalación de tu AWP. El usuario está claramente comprometido con tu contenido y una conversión a menudo indica que el usuario interactuará con tus servicios nuevamente.
Recorrido de la reserva o la confirmación de la compra
Muestra una promoción de instalación durante o después de un recorrido secuencial, como después de la reserva o los flujos de confirmación de la compra. Si muestras la promoción después de que el usuario complete el recorrido, a menudo puedes destacarla más, ya que se completó el recorrido.
Asegúrese de seguir estos pasos:
- Incluye un llamado a la acción relevante. ¿Qué usuarios se beneficiarán si instalan tu app y por qué? ¿Qué relevancia tiene para la experiencia en la que se encuentra actualmente?
- Si tu marca tiene ofertas únicas para usuarios de apps instaladas, menciónalas.
- Mantén la promoción fuera de los próximos pasos del recorrido, o puedes afectar de forma negativa las tasas de finalización del recorrido. En el ejemplo de comercio electrónico anterior, observa que el llamado a la acción clave para la confirmación de la compra se encuentra sobre la promoción de instalación de la app.
Flujo de registro, acceso o salida
Esta promoción es un caso especial del patrón promocional de recorrido en el que la tarjeta promocional puede destacarse más.
Por lo general, solo los usuarios comprometidos ven estas páginas cuando ya se estableció la propuesta de valor de tu AWP. Además, a menudo hay poco contenido útil para colocar en estas páginas. Como resultado, crea un llamado a la acción más grande, siempre y cuando no sea un obstáculo.
Asegúrese de seguir estos pasos:
- Evita interrumpir el recorrido del usuario en el formulario de registro. Si se trata de un proceso de varios pasos, es posible que quieras esperar hasta que el usuario haya completado el recorrido.
- Promocionar las funciones más relevantes para los usuarios registrados
- Considera agregar una promoción de instalación adicional dentro de las áreas a las que se accedió en la app.
Patrones promocionales intercalados
Las técnicas promocionales integradas combinan las promociones con el contenido del sitio. Esto suele ser más sutil que la promoción en la interfaz de usuario, que tiene compensaciones. Te recomendamos que tu promoción se destaque lo suficiente como para que los usuarios interesados la noten, pero no tanto como para perjudicar la calidad de tu experiencia del usuario.
In-feed
Aparece una promoción de instalación in-feed entre artículos de noticias y otras listas de tarjetas de información en tu AWP.
Tu objetivo es mostrarles a los usuarios cómo acceder al contenido que disfrutan de una manera más conveniente. Enfócate en promocionar características y funcionalidades que serán útiles para tus usuarios.
Asegúrese de seguir estos pasos:
- Limitar la frecuencia de las promociones para evitar molestar a los usuarios
- Brinda a los usuarios la posibilidad de descartar las promociones.
- Recuerda la elección del usuario de descartar.