Elementos seleccionables y grupos
Los elementos seleccionables son elementos del flow que los usuarios pueden pulsar para seleccionar o deseleccionar. Su estado puede controlar la navegación, la visibilidad y otra lógica a lo largo del flow. Esto es lo que puedes hacer:
- Usar elementos seleccionables por defecto — las opciones de quiz, productos, pestañas y toggles de prueba son seleccionables de serie
- Hacer cualquier elemento seleccionable — convierte cualquier elemento en seleccionable y asígnalo a un grupo
- Crear y gestionar grupos — organiza los elementos seleccionables en grupos de selección única, selección múltiple o toggle
- Usar el estado seleccionado en condiciones — referencia los valores de grupo en condiciones de cualquier pantalla del flow
Elementos seleccionables por defecto
Algunos tipos de elementos son seleccionables por defecto: ya pertenecen a grupos creados automáticamente y no necesitan configuración adicional:
- Opciones de quiz: Cada respuesta de un quiz es un elemento seleccionable dentro del grupo del quiz. Consulta Quizzes.
- Productos: Tarjetas de producto dentro de un grupo de productos. Consulta Bloque de producto.
- Pestañas: Elementos de pestaña dentro de un grupo de pestañas. Consulta Pestañas.
- Toggles de prueba: Un contenedor que pertenece a un grupo y adquiere un estado seleccionado. Consulta Toggles.
Hacer un elemento seleccionable
En algunos casos, puede que quieras hacer que elementos adicionales sean seleccionables. Por ejemplo, puedes añadir una casilla No volver a preguntar que funcione como un elemento dentro de un grupo de quiz.
Para hacer un elemento seleccionable:
- Selecciona el elemento en la pantalla o en el panel Layers.
- A la derecha, cambia al panel Interactions.
- Selecciona Turn into selectable element.
- En el desplegable Group, selecciona un grupo existente o crea uno nuevo.
- Establece el Element ID — un identificador único para este elemento dentro del grupo.
- Si quieres que este elemento esté seleccionado por defecto, marca la casilla Set as default in group.
Crear un grupo
Los grupos organizan los elementos seleccionables de una pantalla y definen cómo funciona la selección: si los usuarios pueden elegir una opción, varias opciones o activar/desactivar.
Para crear un grupo:
- Selecciona un elemento y hazlo seleccionable.
- En el desplegable Group, selecciona Create group.
- Introduce un Group name.
- Selecciona el tipo de grupo.
El grupo ya estará disponible en el desplegable Group para otros elementos seleccionables de la misma pantalla.
Tipos de grupo
La mayoría de los presets de quiz son de opción múltiple por defecto. Cambia el tipo de grupo para permitir solo una respuesta.
- Opción única: Solo se puede seleccionar un elemento del grupo a la vez. Al seleccionar uno nuevo, se deselecciona el anterior.
- Opción múltiple: Se pueden seleccionar varios elementos al mismo tiempo.
- Toggle: Cada elemento alterna entre seleccionado y deseleccionado en cada toque, de forma independiente a los demás.
Gestionar grupos
Para ver y editar grupos, abre el panel Screen settings y busca la sección Selectable groups. Aquí aparecen todos los grupos de la pantalla actual.
Haz clic en el ID de un grupo para:
- Cambiar el ID del grupo
- Cambiar el tipo de grupo
- Ver cómo se referencian los elementos del grupo en las condiciones
Usar el estado de selección en condiciones
Puedes referenciar el estado de selección de un grupo en condiciones de cualquier pantalla del flow, no solo en la pantalla donde está definido el grupo. Por ejemplo: IF quiz.photo is selected, THEN navigate to the Photo screen.
Todos los elementos de un grupo deben estar en la misma pantalla. No puedes añadir elementos de diferentes pantallas a un mismo grupo. Sin embargo, puedes referenciar los valores del grupo en condiciones de cualquier pantalla del flow.
Usa el estado de selección con:
- Acciones condicionales: Redirige a los usuarios a distintas pantallas o activa diferentes acciones según los elementos seleccionados.
- Navegación dinámica: Ramifica el flow según las respuestas a un quiz, los estados de los toggles u otras selecciones.
- Visibilidad condicional: Muestra u oculta elementos según lo que los usuarios hayan seleccionado en pantallas anteriores.