Las apps web progresivas son fáciles de instalar gracias a un nuevo botón de instalación en la barra de direcciones (cuadro multifunción) de Chrome.
Por lo general, en computadoras de escritorio, no hay una indicación para el usuario de que una app web progresiva se puede instalar y, si lo es, el flujo de instalación está oculto en el menú de tres puntos.
En Chrome 76 (versión beta a mediados de junio de 2019), estamos agregando un botón de instalación a la barra de direcciones (cuadro multifunción) para facilitar a los usuarios la instalación de apps web progresivas en computadoras de escritorio. Si un sitio cumple con los criterios de instalación de app web progresiva, Chrome mostrará automáticamente un ícono de instalación en la barra de direcciones. Cuando se hace clic en el botón, se le solicita al usuario que instale la AWP.
Al igual que otros eventos de instalación, puedes escuchar el evento appinstalled para detectar si el usuario instaló tu AWP.
Agrega tu propio mensaje de instalación
Si tu AWP tiene casos de uso en los que es útil que un usuario instale tu app, por ejemplo, si tienes usuarios que usan tu app más de una vez por semana, deberías promocionar la instalación de la AWP dentro de la IU web de tu app.
Para agregar tu propio botón de instalación personalizado, busca el evento beforeinstallprompt. Cuando esté activada, guarda una referencia al evento y actualiza la interfaz de usuario para que el usuario sepa que puede instalar tu app web progresiva.
Patrones para promocionar la instalación de tu AWP
Existen tres formas clave de promocionar la instalación de tu AWP:
- Promoción automática del navegador, como el botón de instalación de la barra de direcciones.
- Promoción de la IU de la app, en la que los elementos de la IU aparecen en la interfaz de la app, como banners, botones en el encabezado o el menú de navegación, etcétera
- Los patrones promocionales intercalados entrelazan las promociones dentro del contenido del sitio.
Consulta Patrones para promocionar la instalación de AWP (dispositivos móviles) para obtener más detalles. Su enfoque se centra en los dispositivos móviles, pero muchos de los patrones se aplican a las computadoras de escritorio o se pueden modificar fácilmente para que funcionen en las experiencias de este tipo.