Hacer que la aplicación web fuera instalable generó un aumento en el tráfico, la retención de visitantes, las ventas por cliente y las conversiones.
Rakuten 24 es una tienda en línea proporcionada por Rakuten, una de las empresas de comercio electrónico más grandes de Japón. Ofrece una amplia selección de artículos cotidianos, como comestibles, medicamentos, cuidado de la salud y utensilios de cocina, entre otros. El objetivo principal del equipo durante el último año era mejorar la retención de clientes que usan dispositivos móviles y volver a generar participación. Cuando la app web fue instalable, observó un aumento del 450% en la tasa de retención de visitantes en comparación con el flujo web móvil anterior en un período de 1 mes.
Destacar la oportunidad
En su esfuerzo por ganar participación de mercado y mejorar la experiencia del usuario, Rakuten 24 identificó las siguientes áreas de oportunidades:
- Como servicio relativamente nuevo, Rakuten 24 no estaba en posición de invertir el tiempo y el costo en el desarrollo de una app específica para cada plataforma, tanto para iOS como para Android, y buscaban una forma alternativa y eficiente de llenar este vacío.
- Dado que Rakuten-Ichiba (el mercado de comercio electrónico de Rakuten) es el más grande de Japón, muchas personas creen que Rakuten 24 es un vendedor de Rakuten-Ichiba. Como resultado, reconoció la necesidad de invertir en el reconocimiento de la marca y generar una mayor retención de usuarios.
Las herramientas que usaron
Instalación
Para captar las dos oportunidades identificadas anteriormente, en Rakuten 24 decidió compilar funciones de app web progresiva (AWP) de forma incremental, comenzando por la instalabilidad. La implementación de la capacidad de instalación generó un aumento en el tráfico, la retención de visitantes, las ventas por cliente y las conversiones.
beforeinstallprompt
Para obtener más flexibilidad y control sobre el comportamiento del diálogo de instalación, el equipo implementó su propia solicitud de instalación con el evento beforeinstallprompt
. De esta manera, pudieron detectar si la app ya estaba instalada en Android o iOS, y proporcionar una experiencia más significativa y relevante para sus usuarios.
Instrucciones de instalación personalizadas
Para los usuarios que no pudieron instalar la AWP desde el banner, crearon una guía personalizada (vinculada desde el banner) con instrucciones sobre cómo instalarla de forma manual en dispositivos iOS y Android.
![Capturas de pantalla de las instrucciones de instalación personalizadas.](https://web.developers.google.cn/static/case-studies/rakuten-24/image/screenshots-the-custom-i-b01425f726ccd.png?authuser=7&hl=es-419)
Caja de trabajo para service workers
El equipo de Rakuten 24 usó Workbox (el complemento workbox-webpack-plugin para ser más precisos) a fin de garantizar que su AWP funcionara bien incluso cuando el usuario no tenía conexión o tenía una red deficiente. Las APIs de Workbox para controlar la caché funcionaban mucho mejor que la secuencia de comandos interna anterior de Rakuten 24. Además, con workbox-webpack-plugin (y Babel), se pudo automatizar el proceso de compatibilidad con una variedad más amplia de navegadores. A fin de desarrollar aún más la resiliencia de la red, implementaron una estrategia centrada en la caché para sus elementos de CSS y JS, y usó stale-while-revalidate para las imágenes que no cambian con frecuencia.
Resultados generales de la empresa
Mediante la implementación de la capacidad de instalación, Rakuten 24 pudo aumentar la frecuencia de visitas por usuario en un 310% en comparación con el resto de sus usuarios web. También observó un aumento del 450% en la retención de visitantes (en comparación con el flujo anterior de la Web móvil), un aumento del 150% en las ventas por cliente y un aumento del 200% en el porcentaje de conversiones. Todas las mejoras se observaron durante un período de 1 mes.
![310% de aumento en la frecuencia de visitas por usuario 450% de aumento en la tasa de retención de visitantes 150% de aumento en las ventas por cliente.200% de aumento en el porcentaje de conversiones.](https://web.developers.google.cn/static/case-studies/rakuten-24/image/310-increase-visit-freq-335fa9556e79f.png?authuser=7&hl=es-419)
Otras formas en que el negocio mejoró con la instalación
- Reconocimiento de la marca:Dado que los usuarios pueden acceder directamente a Rakuten 24 desde su pantalla principal, ayudó a ambos y a Rakuten a separar Rakuten 24 de Rakuten-Ichiba.
- Eficiencia: Rakuten 24 pudo impulsar estos resultados sin invertir mucho tiempo y dinero en crear apps específicas de la plataforma para iOS y Android.
Nuestra misión es crear valor a través de la innovación y el espíritu emprendedor para contribuir a la sociedad. Un paso para lograrlo fue mejorar la experiencia del cliente de Rakuten 24 con la implementación de A2HS. En un futuro cercano, también planeamos mejorar la interacción con las AWP y la propuesta del cliente mediante el desarrollo de notificaciones push con la API Web Push.
Masashi Watanabe, gerente general, departamento de Marketing de Grupo, Rakuten Inc.
Consulta la página Casos de éxito de Scale on Web para obtener más historias de éxito de India y Asia.