Branding

En esta página explicaremos cómo puedes aplicar tu propia marca a tu programa de Rewards.

🧰 Primeros pasos

La configuración de la marca se puede acceder desde Rewards > Mis Recompensas y haciendo clic en la versión que desees editar. Aquí, puedes configurar un perfil de marca base que puedes ajustar para cada Perfil de Comunicación configurado en tu entorno Fast Track CRM.
En nuestro ejemplo, te mostraremos cómo diseñar el programa de Recompensas para nuestros jugadores del Reino Unido en el Starry Spins Origen.
Accediendo a la configuración de marca para Starry Spins - Perfil de Comunicación del Reino Unido
Accediendo a la configuración de marca para Starry Spins - Perfil de Comunicación del Reino Unido
Si tienes la solución Origin habilitada en tu entorno, podrás configurar diferentes versiones de tu programa de Recompensas y aplicar diferentes ajustes de marca para cada Origin.
A continuación, puedes hacer clic en Perfil de marca base para Starry Spins, cualquier cambio realizado aquí se aplicará a los ajustes de marca base para todos Perfiles de Comunicación.
De lo contrario, haz clic en Ajustes de marca para Perfil de Comunicación - Reino Unido para modificar el estilo solo para jugadores del Reino Unido.

​🎨‍ Estudio de Marca

Al hacer clic en un perfil de marca se abrirá el Branding Studio, donde puedes afinar el estilo de tu programa de Recompensas. La configuración de marca (también conocido como Branding Studio) se puede acceder desde Rewards > Mis Recompensas haciendo clic en la versión que desees editar. Aquí, puedes configurar un perfil de marca base que puede ajustarse para cada Perfil de Comunicación en tu entorno Fast Track CRM.
Accediendo a la configuración de marca para Starry Spins - Perfil de Comunicación del Reino Unido
Accediendo a la configuración de marca para Starry Spins - Perfil de Comunicación del Reino Unido
Si tienes la solución Origin habilitada en tu entorno, podrás configurar diferentes versiones de tu programa de Recompensas y aplicar diferentes ajustes de marca para cada Origin.
Haz clic Editar Apariencia para abrir el Branding Studio. Aquí encontrarás tres pestañas para personalizar tu experiencia de Recompensas:
  1. Apariencia – Edita colores, tipografías, ajustes base y el estilo de componentes individuales, como el Modal, Popup, Barra de Progreso, Tarjetas, Botones, Menú y Notificaciones. También puedes controlar la velocidad de la rueda y otros elementos visuales.
  2. Traducciones – Traduce todo el contenido de Recompensas, incluidos botones, mensajes de error y ventanas emergentes.
  3. Ajustes de Experiencia – Habilita o deshabilita funcionalidades específicas de Recompensas, como Lealtad, Monedas Virtuales y Niveles. Desde allí también puedes habilitar/deshabilitar ajustes adicionales como Comportamiento post-compra o Desafío Múltiple Activo.
Cualquier cambio que realices se reflejará en el panel de vista previa a la izquierda, para que puedas ver los resultados al instante — por ejemplo, cambiar el color de fondo del modal de Recompensas.
En este artículo, demostraremos cómo diseñar el programa de Recompensas para jugadores del Reino Unido en el Origin de Starry Spins.
Cualquier cambio realizado se reflejará en la vista previa a la izquierda, por ejemplo, aquí se muestra cómo puedes cambiar el color de fondo del modal de Recompensas:Cualquier cambio realizado se reflejará en la vista previa a la izquierda, por ejemplo, aquí se muestra cómo puedes cambiar el color de fondo del modal de Recompensas:
Estudio de Marca
Estudio de Marca

​☸‍ Rueda

Cuando la versión de la rueda está configurada en "Legacy", utiliza ajustes predefinidos de posicionamiento y escala optimizados para diferentes tipos de dispositivos. Este modo ofrece una experiencia coherente lista para usar con comportamiento responsive automático.
Ajustes de Rueda Legacy
Ajustes de Rueda Legacy
Seleccionar "Default" desbloqueará opciones avanzadas de personalización, permitiendo control total sobre el posicionamiento y el tamaño de la rueda en diferentes tipos de dispositivos (Escritorio, Móvil, Tableta). Usar la rueda con su anchura y posicionamiento predeterminados hará que la rueda esté centrada con un tamaño óptimo para todos los tipos de dispositivos mencionados.
Ajustes de Rueda Default
Ajustes de Rueda Default
Al usar los ajustes predeterminados de la rueda, puedes ajustar:
  1. Anchura de la rueda: Establece la anchura de la rueda como un porcentaje del ancho de la ventana
  2. Ancho máximo de la rueda: Define el ancho máximo en píxeles para la rueda
  3. Horizontal: Ajuste de posicionamiento horizontal como porcentaje
  4. Vertical: Ajuste de posicionamiento vertical como porcentaje
Estos ajustes se pueden configurar de forma independiente para vistas de Escritorio, Móvil y Tableta, asegurando una visualización óptima de la rueda en todos los tipos de dispositivos. El componente de la rueda se integra con el ft-wheel elemento y proporciona capacidades de diseño responsivo.
Para información sobre imágenes de la Rueda y nuestra guía de tamaños, haz clic aquí.

​🛡‍ Badge de Recompensas

Al hacer clic en Badge de Recompensas ahora se mostrará una insignia no reclamada (si la función está habilitada), mostrando el número de Ruedas, Bonos y Desafíos no reclamados que tiene un jugador, junto con una vista previa de la propia insignia.
Esta insignia se mostrará junto con el ft-my-rewards-toggle componente y puede configurarse para cambiar la posición, el estilo y la tipografía de la insignia.
Para leer más sobre la implementación front-end de ft-my-rewards-toggle lee aquí​
Ajustes de la insignia de Recompensas
Ajustes de la insignia de Recompensas