Para crear un flujo, necesitas tener Appcues Builder . Si aún no lo tienes instalado, puedes crear un flujo y previsualizarlo con el builder , pero para publicarlo, primero debes instalar Appcues .

Guía de construcción

En este artículo aprenderás a:

• Crea un flujo desde cero y nómbralo
• Añade pasos y componentes a tu flujo
• Añadir pasos de navegación
• Completa la configuración de tu flujo
• Prueba y publica tu flujo

Paso 1. Crea tu flujo

Tienes dos opciones para iniciar tu flujo.

Puedes crearlo desde Appcues Studio :

En la ventana emergente, proporciona un nombre para tu flujo y una URL de compilación. Esta URL es una página de tu aplicación donde puedes abrir el flujo en el builder y realizar modificaciones. Aunque podría ser la misma URL donde mostrarás el flujo en vivo, este no es el campo que indica Appcues dónde se mostrará la versión en vivo.

O puedes crearlo directamente desde la página donde quieres iniciar tu flujo abriendo Appcues Builder :

Paso 2. Agregar un paso

Ahora, agregarás el primer paso de tu flujo. Tendrás la opción de empezar desde cero o usar una plantilla.

Una vez que agregues el paso, se aplicará tu tema predeterminado. Si quieres usar un tema diferente, puedes cambiarlo. También puedes activar o desactivar la opción de omitir pin o la barra de progreso (estas opciones varían según el tipo de patrón que uses).

Cualquier cambio que realice en el Generador se guardará automáticamente : esto se indica mediante la marca de verificación verde junto al ícono del engranaje.

Paso 3. Agregar un componente

Ahora, agregarás componentes a tu paso, como texto, imágenes y botones. Es altamente personalizable y puedes diseñar tus pasos de forma que se adapten completamente a tu aplicación.

Paso 4. Agregar un paso

Ahora, agregará el segundo paso de su flujo. Al agregar un tipo de patrón diferente, el Constructor le solicitará que agregue un nuevo grupo. Para obtener más información sobre esto, consulte nuestra documentación: Grupos y Grupos de pasos .

Hay dos formas de continuar un flujo al usar tooltips : hacer clic en el botón "siguiente" o hacer clic en el elemento al que apunta la tooltip .

Esta tooltip en particular apunta a un elemento de navegación de la aplicación e invita al usuario a interactuar con él . Por ello, no se utiliza ningún botón y el flujo avanza cuando el usuario hace clic en "Favoritos".

Al colocar una tooltip en un elemento, se utiliza un selector CSS. Es posible que en algunos casos sea necesario ajustarlo para ciertas tooltips o hotspots . Nuestra documentación es un buen recurso para explorar: Colocación de descripciones sobre herramientas/puntos de acceso ; Selector CSS .

Paso 5. Agregar un paso de navegación

Como se mencionó en el paso anterior, la tooltip apunta a un elemento e invita al usuario a interactuar. Dado que esto provocará un cambio de URL, deberá agregar un paso de navegación. Como regla general, cada vez que la URL cambie , deberá agregar un paso de navegación o el flujo se interrumpirá.

Al hacer clic en "Navegar" , el Constructor cambia al modo de navegación y puedes ir al siguiente paso. Después de navegar, haz clic en "Volver al modo de construcción".

En este caso, el usuario navega de /p/all-files a /p/favorites . Hay dos opciones para añadir pasos de navegación: Redirigir o Permitir que naveguen . Dado que el usuario interactúa con la página, la opción Permitir que naveguen es la correcta.

Puede aprender cómo crear un flujo a través de páginas, incluso a través de URL dinámicas, aquí: Crear un flujo a través de páginas.

Para abreviar este artículo, no se añadirán más pasos. En un escenario real, el flujo continuaría con otro paso en la nueva página, explicando al usuario su ubicación.

Paso 6. Obtenga una vista previa de su flujo

Mientras creas tu flujo, puedes previsualizarlo como lo haría un usuario final. Para ello, haz clic en el icono del ojo junto al botón "Publicar".

Después de obtener una vista previa de su flujo, puede hacer clic en "Apuntar y publicar "; este botón no publicará inmediatamente su flujo, pero lo llevará de regreso a Studio, donde puede completar la configuración de su flujo.

Paso 7. Completar la configuración

Una vez que regreses a Studio, puedes definir la configuración de tu flujo. Estas incluyen: Activador , Segmentación de página , Segmentación de audiencia , Prioridad del flujo (opcional), Objetivos y Acciones de finalización del flujo .

Si desea mostrar su flujo cuando el usuario llega a la página , puede seleccionar esa opción. Puede explorar las demás opciones en la siguiente documentación: Manualmente incluirá enlaces permanentes , lista de verificación o Launchpad ; cuando se produce un evento, se utiliza una función llamada Activación de eventos .

Para obtener más información sobre lo que significa Mostrar una vez y Mostrar siempre , consulte nuestra documentación: Configuración de la frecuencia de flujo .

Al segmentar páginas, asegúrese de segmentar la página donde comienza el flujo . No es necesario agregar todas las páginas a las que finalmente accede su flujo; esto se realiza mediante los pasos de navegación. Nuestra documentación sobre segmentación de páginas es útil, incluso si su flujo comienza en una URL dinámica: Segmentación de páginas . Si solo desea segmentar su flujo a dom específicos, puede hacerlo siguiendo las instrucciones de esta documentación: Administrar sus dominios .

En la segmentación por audiencia, puedes decidir si segmentas a todos los usuarios, a usuarios de un segmento o a usuarios específicos . Al seleccionar "Usuarios específicos", podrás segmentar por propiedades de usuario , idioma , flujos , listas de verificación , eventos y segmentos . La documentación enlazada ofrece instrucciones sobre cómo segmentar con estas opciones.

Paso 8. Prueba tu flujo

¡Siempre prueba tu flujo antes de publicarlo en producción !

Aunque la opción de vista previa del Constructor es una excelente manera de familiarizarse con el aspecto de su flujo, no es una prueba real. Por ello, le recomendamos que pruebe sus flujos con el modo de prueba , publicándolos en vivo en un entorno de pruebas o solo para usted . Puede obtener más información sobre estas opciones en nuestra documentación: Pruebas de flujos .

Si su flujo no se muestra o un paso no se muestra, consulte nuestra documentación sobre solución de problemas de flujos: Solución de problemas de flujos , ¿Por qué no se muestra mi flujo ?, ¿Por qué no se muestra un paso ?.

Paso 9. Publicar

Una vez que hayas verificado que tu flujo funciona correctamente, puedes publicarlo en vivo para tu audiencia. Para publicar, haz clic en el botón azul "Publicar". Verás una modal previa de la publicación antes de confirmar que quieres publicar.

Si tienes problemas con tu flujo, comunícate con support@appcues.com. ¡Estaremos encantados de ayudarte!