Instalar tu app web progresiva (AWP) puede facilitar que los usuarios la encuentren y la usen. Incluso con la promoción en el 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 promocionar y habilitar la instalación de tu AWP.
Este artículo no es exhaustivo, pero ofrece un punto de partida para las diferentes formas de promocionar la instalación de tu AWP. Independientemente del 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 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 de los usuarios. 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 capacidad de descartar o rechazar la promoción. Recuerda la preferencia del usuario si hace esto y vuelve a solicitarle permiso solo 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 la instalación.
- Muestra la promoción solo después de que se active 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 se puede instalar tu app web progresiva. Por ejemplo, la versión para computadoras de Chrome muestra un botón de instalación en la barra omni.
Chrome para Android muestra una mini barra de información al usuario, aunque se puede evitar llamando 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 las interrupciones en su recorrido.
Los sitios que tienen en cuenta cuándo activan la IU de la promoción logran una mayor cantidad de instalaciones y evitan interferir en los recorridos 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 funcionalidades 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. Otro contenido del encabezado suele incluir 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 los clientes más leales vuelvan 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 de tu caso de uso instalado para los usuarios. Considera la segmentación selectiva para mostrar tu promoción solo a los usuarios que tengan probabilidades de beneficiarse de ella.
- Usa el espacio del 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 otros elementos de menú.
- Ofrece una presentación breve y relevante de 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 ampliar el alcance 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 lo que obtendrán con la instalación.
Asegúrese de seguir estos pasos:
- Apela a las funciones que más les interesan a 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.
Instala el banner
La mayoría de los usuarios encontraron banners de instalación en experiencias para dispositivos móviles y están familiarizados con las interacciones que ofrecen. 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 tu banner, no lo vuelvas a mostrar, a menos que active un evento de conversión que indique un nivel más alto de participación con tu contenido, como una compra en un sitio de comercio electrónico o el registro para obtener una cuenta.
- Proporciona 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 mencionando que casi no usa almacenamiento en el dispositivo del usuario o que se instalará de inmediato sin un redireccionamiento a la tienda.
IU temporal
La IU temporal, como el patrón de diseño de barra de notificaciones, notifica al usuario y le permite completar fácilmente una acción, en este caso, instalar la app. Cuando se usan correctamente, este tipo de patrones de IU no interrumpen el flujo de usuarios y, por lo general, se descartan automáticamente si el usuario los ignora.
Muestra la barra de notificaciones después de algunas interacciones con tu app. Si aparece cuando se carga la página o fuera de contexto, se puede pasar por alto fácilmente o provocar una sobrecarga cognitiva. Cuando esto suceda, los usuarios simplemente descartarán todo lo que vean. 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 que tengas indicadores de interés sólidos del usuario antes de usar este patrón, por ejemplo, visitas repetidas, un acceso del 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 tener 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 promocionar la instalación de tu AWP. El usuario interactúa claramente con tu contenido, y una conversión suele indicar que el usuario volverá a interactuar con tus servicios.
Recorrido de reserva o confirmación de la compra
Muestra una promoción de instalación durante o después de un recorrido secuencial, como después de los flujos de reserva o confirmación de la compra. Si muestras la promoción después de que el usuario completó el recorrido, a menudo puedes hacerla más prominente, ya que el recorrido está completo.
Asegúrese de seguir estos pasos:
- Incluye un llamado a la acción relevante. ¿Qué usuarios se beneficiarán de instalar tu app y por qué? ¿Qué tan relevante es para el recorrido que está realizando actualmente?
- Si tu marca tiene ofertas únicas para los usuarios de la app instalada, menciónalas.
- No coloques la promoción en el camino de los próximos pasos del recorrido, o podrías afectar negativamente los porcentajes de finalización del recorrido. En el ejemplo de comercio electrónico anterior, observa cómo el llamado a la acción clave para confirmar la compra está sobre la promoción de instalación de aplicación.
Flujo de registro, acceso o salida
Esta promoción es un caso especial del patrón promocional de recorrido en el que la tarjeta de promoción puede ser más destacada.
Por lo general, solo los usuarios comprometidos ven estas páginas, en las que 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 dentro del formulario de registro. Si se trata de un proceso de varios pasos, te recomendamos que esperes hasta que el usuario complete el recorrido.
- Promocionar las funciones más relevantes para un usuario registrado
- Considera agregar una promoción de instalación adicional en las áreas de acceso de tu app.
Patrones promocionales intercalados
Las técnicas promocionales intercaladas entrelazan 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. Quieres que tu promoción se destaque lo suficiente como para que los usuarios interesados la noten, pero no tanto como para que afecte la calidad de la experiencia del usuario.
In-feed
Aparece una promoción de instalación in-feed entre artículos de noticias o 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 forma 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 para descartar.