Nos centramos en brindarte configuraciones predeterminadas atractivas para que puedas crear contenido de Flow rápidamente. Además, te ofrecemos una personalización mucho más profunda de tu estilo, para que tu contenido se sienta acorde con tu marca y sea nativo de tu aplicación.

Uso de temas

Los temas sirven para crear estilos estandarizados y repetibles para tus flujos móviles. Los diseñadores de producto pueden crear un tema que se ajuste a las directrices de marca de tu aplicación para que los flujos se sientan como propios de tus usuarios finales. Posteriormente, se puede aplicar un tema a tus flujos, lo que da a los compañeros de equipo más dom para centrarse en el contenido del mensaje.

Los temas incluyen opciones básicas de fuentes, colores y estilo de botones. También se pueden configurar versiones en modo oscuro y claro. Como verá más adelante en este documento, también puede crear variantes dentro de un tema, lo que le permite establecer reglas independientes, además de las predeterminadas, para diferentes estilos de texto y botones.

Crear y editar un tema

Para crear un tema nuevo, haz clic en el icono "Editar detalles del flujo" en la barra inferior del builder móvil. En el menú desplegable "Tema" , haz clic en "Crear nuevo tema" . Dale un nombre al tema y haz clic en "Crear" .

Para editar un tema existente, haga clic en Editar tema en la barra lateral.

Cómo aplicar un tema a un flujo

De forma predeterminada, a un flujo recién creado se le aplicará el tema original de tu cuenta. Para aplicar un tema diferente, haz clic en el icono de edición en la barra inferior del builder y selecciona el tema que desees en la modal "Editar flujo" .

Anulación de estilos de tema

Una vez seleccionado un tema, se aplicará el estilo básico a todo el contenido ya creado en tu Flow. Después de aplicar un tema, podrás editar estilos en bloques de contenido individuales. Si un estilo que editas manualmente anula un estilo aplicado desde el tema, o si un nuevo tema que aplicaste contiene estilos diferentes a los que ya personalizaste en el Flow, te lo notificaremos en la sección "Anulaciones de tema" que aparecerá en el panel de edición del bloque de contenido actual. En esta sección, puedes:

• Restablezca el estilo individual para que coincida con el tema haciendo clic en el ícono de restablecimiento junto a cada estilo
• Restablezca todos los estilos anulados en ese bloque para que coincidan con el tema haciendo clic en el botón Restablecer instancia
• Guarde los estilos anulados en ese bloque como una nueva variante de tema (lea la siguiente sección para obtener más información sobre las variantes) haciendo clic en la opción Guardar como nuevo en el menú desplegable de botones.
• Actualice el tema aplicado con los estilos reemplazados haciendo clic en la opción Actualizar original en el menú desplegable de botones (Nota: esto aplicará los nuevos estilos a todo el contenido de cualquier flujo que use ese tema)

Creación y gestión de variantes de temas

La configuración del tema te permite establecer estilos básicos para todo el contenido de texto, imágenes y botones de tu Flow. Si necesitas estilos más detallados para diferentes tipos de contenido, puedes usar las variantes del tema . Estas variantes te permiten guardar y reutilizar estilos en instancias individuales de un bloque de contenido en tu Flow, sin anular los estilos predeterminados del tema en el resto del contenido. Puedes usar las variantes del tema para cosas como:

• Creación de estilos de texto independientes para el contenido de texto H1, H2 y párrafo
• Administrar diferentes estilos para sus botones primarios, secundarios y terciarios

Para crear una nueva variante dentro de un tema, primero aplique un tema a un flujo. A continuación, comience a editar un bloque de contenido para que coincida con el nuevo estilo que desea. Como se explicó en la sección anterior, los estilos que anulan el tema harán que aparezca la sección "Anulaciones de tema" . Termine de crear los estilos que desee (por ejemplo, un botón secundario) y seleccione "Guardar como nuevo" en el menú desplegable de botones.

Dale a la variante un nombre que describa su propósito para que el resto del equipo sepa cómo usarla. Luego, haz clic en Guardar.

Ahora podrás seleccionar fácilmente esa variante desde el panel de estilo siempre que necesites diseñar un botón secundario en el futuro.

Siempre puedes actualizar tus estilos de variantes seleccionando Actualizar original en el botón desplegable en la sección Anulaciones de tema .

Las imágenes de todas sus variantes de botones , imágenes y bloques de texto enriquecido aparecen en la vista previa en la pantalla Editar tema .

Mejores prácticas

Adopción de temas con flujos existentes

Si tiene flujos móviles existentes creados que no utilizan temas, puede agregar los estilos que ya ha definido en Mobile Builder a su tema para crear una base para diseñar fácilmente sus flujos futuros:

1. Abra el flujo que contiene los estilos que desea incluir en su tema en Mobile Builder.
2. Aplica el tema que quieras actualizar al flujo. El tema se añadirá a tu flujo, adjuntando la variante predeterminada a cada elemento y conservando todos tus estilos actuales como "Anulaciones de tema" .
3. Para cada estilo que desees incluir en el tema:
   1. Selecciona el elemento (un contenedor modal o tooltip , un bloque de texto, un botón, un bloque de calificación, etc.). Observarás que el elemento tiene aplicada la variante de tema predeterminada con un conjunto de modificaciones que capturan tus estilos específicos.
   2. Expande el panel Anulaciones de tema y, en el menú desplegable de botones en la parte inferior, selecciona Actualizar original si deseas actualizar el estilo de tema predeterminado (por ejemplo, para un botón principal) o Guardar como nuevo si deseas crear una variante de tema para proporcionar opciones de estilo adicionales (por ejemplo, para un botón secundario)
   3. Confirme que desea actualizar o guardar la variante. Verá que ya no aparecen modificaciones de tema, ya que todos los estilos del elemento están incluidos en la variante de tema seleccionada.
   4. Repita esto para cada elemento en su flujo.
4. Repite los pasos 1 a 3 para otros flujos que contengan estilos que quieras incluir en tu tema. Por ejemplo, podrías añadir estilos para una incrustación móvil.
5. ¡Crea un nuevo flujo y observa que los estilos predeterminados del contenedor modal , el texto y los botones ahora coinciden con los estilos que guardaste!

Puedes actualizar tus flujos existentes para usar tu nuevo tema, pero también está bien dejarlos y solo usar tu tema para los nuevos flujos.

Adopción de temas como nuevo usuario

Si no tienes ningún flujo móvil existente, puedes crear un tema con tu primer flujo para asegurarte de que todos tus flujos tengan exactamente el estilo y la apariencia que deseas:

1. Crea un nuevo flujo y, en el Constructor Móvil, crea un nuevo tema y guárdalo en tu flujo. El primer tema que crees será el predeterminado para los flujos futuros.
2. Abre el editor general de temas haciendo clic en "Editar tema" en la barra lateral. Agrega los colores específicos de tu marca y ajusta la configuración de la interfaz hasta que coincida con la apariencia deseada. No te preocupes, ¡puedes ajustar los detalles más tarde! Guarda los cambios.
3. Realiza cambios de estilo en tu Flow en Mobile Builder para crear exactamente el aspecto que deseas: agrega fuentes personalizadas, modifica el espaciado, actualiza los bordes, etc.
   1. Cualquier cambio que realice se indicará en el panel "Anulaciones de tema" . Una vez que esté satisfecho con el estilo, expanda el panel "Anulaciones de tema" y, en el menú desplegable de botones de la parte inferior, seleccione "Actualizar original" .
   2. Confirme que desea actualizar o guardar la variante. Verá que ya no aparecen modificaciones de tema, ya que todos los estilos están incluidos en la variante del tema y listos para usar en el futuro.

Temas y plantillas

Mobile Builder también admite plantillas de pasos para que puedas reutilizar contenido común en varios flujos. Las plantillas de pasos almacenan la estructura de tu contenido, mientras que los temas contienen sus estilos .

Al insertar una plantilla de pasos, se aplicará el estilo de tema predeterminado a su contenido. Puede guardar una plantilla que use variantes de tema para que, en el futuro, se usen esas variantes en lugar del estilo de tema predeterminado.