Las variables te permiten mostrar contenido dinámico en tus flows — precios de productos, detalles de ofertas y otros datos que se actualizan según el contexto de cada usuario. Úsalas para controlar la visibilidad de elementos y personalizar el contenido de las pantallas.

Para abrir el panel de variables, haz clic en el icono { } en el panel izquierdo. El panel tiene tres pestañas:

• Personalizadas: Variables que creas y gestionas tú mismo.
• Producto: Variables integradas que extraen datos localizados de productos y ofertas del store.
• Elemento: Variables vinculadas a los estados de los elementos en el lienzo.

Variables personalizadas

Crear una variable personalizada

1. En el panel de variables, haz clic en +.
2. Escribe un nombre para la variable.
3. Selecciona un tipo: String, Number o Boolean.
4. Establece un valor inicial. Este es el valor que tendrá la variable cuando comience el flow.
5. Haz clic en Create variable.

Actualizar una variable mediante una interacción

Puedes actualizar el valor de una variable en tiempo de ejecución añadiendo una acción Set up variables a cualquier elemento.

1. Selecciona un elemento en el lienzo.
2. En la pestaña Interactions, haz clic en Add trigger.
3. Selecciona On tap y haz clic en Add action. En el desplegable Action type, selecciona Set up variables.
4. Haz clic en Add variable. Selecciona la variable y establece el nuevo valor.

Variables de producto

Las variables de producto obtienen datos localizados directamente de las stores. Úsalas en campos de texto para mostrar precios localizados, títulos y detalles de ofertas, o en condiciones para mostrar u ocultar contenido según la elegibilidad de la oferta.

Variable	Descripción	Ejemplo
prod_title	Título localizado del producto	Premium Subscription
prod_price	Precio localizado para un período de facturación	$9.99
prod_price_per_day	Precio de la suscripción dividido entre los días del período de facturación. Vacío para productos que no son suscripciones.	$0.33
prod_price_per_week	Precio de la suscripción dividido entre las semanas del período de facturación. Vacío para productos que no son suscripciones.	$2.33
prod_price_per_month	Precio de la suscripción ajustado a un mes. Vacío para productos que no son suscripciones.	$9.99
prod_price_per_year	Precio de la suscripción ajustado a un año. Vacío para productos que no son suscripciones.	$119.88
offer_price	Precio localizado de una oferta introductoria o promocional. Vacío si el usuario no es elegible para ninguna oferta.	$0.99
offer_billing_period	Período de facturación localizado de una oferta. Igual que offer_full_duration para ofertas de prueba gratuita y pago por adelantado. Vacío si el usuario no es elegible.	1 week
offer_full_duration	Duración total localizada de una oferta. Vacío si el usuario no es elegible.	1 month
is_free_trial	Devuelve true si el usuario es elegible para una oferta con prueba gratuita.	true
is_pay_up_front	Devuelve true si el usuario es elegible para una oferta de pago por adelantado.	true
is_pay_as_you_go	Devuelve true si el usuario es elegible para una oferta de pago por uso.	true

Los valores de las variables de oferta dependen del tipo de oferta para la que el usuario es elegible. Para ilustrarlo, tomemos una suscripción semanal llamada “Premium Subscription” a $5, con tres posibles ofertas:

• Pay As You Go: Las primeras 3 semanas por $3 (facturado semanalmente), luego $5/semana.
• Pay Up Front: Las primeras 3 semanas por $8 (facturado de inmediato), luego $5/semana.
• Free Trial: Primera semana gratis, luego $5/semana.

En este ejemplo, prod_title devuelve “Premium Subscription” y prod_price devuelve $5. Los valores de las variables de oferta dependen de la oferta para la que el usuario sea elegible:

Variable	Pay As You Go	Pay Upfront	Free Trial
offer_price	$3	$8	$0
offer_billing_period	1 semana	3 semanas	1 semana
offer_full_duration	3 semanas	3 semanas	1 semana
Para las ofertas de pago por adelantado y prueba gratuita, offer_billing_period y offer_full_duration devuelven el mismo valor. En cambio, para Pago por uso, difieren porque el período de facturación es una semana, pero la duración total es de tres semanas.

Variables de elemento

Las variables de elemento capturan las elecciones del usuario: qué seleccionó en los cuestionarios, en qué pestaña está y si el toggle de prueba está activado.

Los tipos de variables de elemento dependen del grupo:

• Opción única: Cuestionarios de opción única y pestañas:
  • selected_id: ID del elemento para usar en condiciones
  • selected_title: Título del elemento para usar en texto dinámico
• Opción múltiple: Cuestionarios de opción múltiple:
  • selected_ids: IDs de elementos para usar en condiciones
  • selected_titles: Títulos de elementos para usar en texto dinámico
• Toggle: Toggle de prueba:
  • is_selected: Valor booleano Los casos de uso más habituales son:
• Mostrar contenido diferente según si el interruptor de prueba está activado.
• Navegar a los usuarios a distintas pantallas según sus respuestas al cuestionario

Usar variables en texto

Para insertar una variable en un elemento de texto:

1. Selecciona un elemento de texto en el canvas.
2. En la pestaña Design, busca el campo Content y escribe tu texto.
3. Haz clic en el icono { } del campo.
4. Selecciona una variable de la lista.

Variables de estilo

No puedes aplicar formato de texto enriquecido a una variable de forma individual. Seleccionar una variable en el campo Content y aplicar negrita, cursiva, subrayado, tachado o cambio de color no tiene ningún efecto.

Los ajustes de texto enriquecido se aplican únicamente al bloque de texto completo. Para dar estilo al texto, usa la sección Typography de la pestaña Design, o aplica un estilo de texto guardado.

Reutilizar contenido en varias pantallas

Algunos contenidos se repiten en tu flow: una etiqueta de botón como “Continuar”, una llamada a la acción recurrente o un aviso legal que aparece en varias pantallas. Lo mismo ocurre con textos más largos, como la descripción de una función reutilizada en múltiples pantallas. En lugar de escribir ese contenido en cada elemento, guárdalo en una variable personalizada. Esto resulta especialmente útil cuando diriges a distintos usuarios a diferentes pantallas pero quieres mantener un texto coherente en todas ellas.

1. Crea una variable personalizada de tipo String y establece su valor inicial con el texto que quieres reutilizar. Por ejemplo, nómbrala button.navigation y establece el valor como Continue.
   
2. Inserta esta variable en el campo Content de cada elemento donde deba aparecer el texto. Para cambiar el texto en todas partes, actualiza el valor inicial de la variable una sola vez. Todos los elementos que usan la variable se actualizan automáticamente, así que no tienes que editar cada pantalla a mano.