Contexto
MENU Loyalty se diseñó para ayudarte a retener clientes a través de un programa basado en gasto que les ofrece recompensas. Para crear una experiencia atractiva, debes configurar tu programa Loyalty y personalizar las recompensas según nuestras pautas y tus necesidades específicas.
Moneda Loyalty
Los usuarios acumulan monedas o puntos Loyalty que utilizan para comprar recompensas. Como cualquier otra moneda, tiene su propio símbolo. Debes preparar este símbolo dentro de un contenedor de 24 x 24 píxeles.
Puedes encontrarlo en la plantilla Figma aquí.
Estas imágenes se utilizan para lo siguiente:
- Tarjeta Loyalty
- Mostrar el número de puntos en la pantalla de inicio
- Tarjeta Loyalty en miniatura en la pantalla de inicio
- Mostrar la cantidad de puntos en la pantalla Rewards/Offers (Recompensas/Ofertas)
- Mostar la cantidad de puntos en la pantalla Summary (Resumen)
- Mostrar la cantidad de puntos que el usuario obtendrá en la pantalla Summary
- Mostrar la cantidad de puntos gastados u obtenidos en la pantalla de recibo único
Requisitos
- Tamaño del contenedor de imágenes: 24 x 24 píxeles
- Formato de la imagen: SVG
- Nombre: coin.svg
Fondo de la tarjeta Loyalty
La tarjeta Loyalty se utiliza para mostrar información básica sobre el usuario, la cantidad de puntos que obtuvo, el nivel que alcanzó, así como para acumular los puntos de la caja registradora o del kiosco.
Puedes encontrarla en la plantilla Figma aquí.
Fondo claro y oscuro
Si creas un fondo oscuro, la app utilizará tipografía blanca, pero si eliges crear un fondo claro, utilizará tipografía negra. Por eso, es muy importante crear el fondo en un tono lo suficientemente oscuro o brillante, de modo tal que el texto se pueda leer con claridad.
Usos
- Anverso de la tarjeta Loyalty
- Reverso de la tarjeta Loyalty (al acumular puntos)
Requisitos
- Tamaño de la imagen: 1200 x 807 píxeles
- Formato de la imagen: PNG
- Nombre: cardbg.png
Ten en cuenta lo siguiente: no debes colocar ningún elemento gráfico sobre este fondo, ya que interferirá con la información de la tarjeta. Recomendamos utilizar colores simples y degradados.
Fondo de la tarjeta Compact Loyalty
La tarjeta Compact Loyalty se utiliza para mostrar información sobre la cantidad de puntos y el nivel que se ha alcanzado en la pantalla de inicio.
Puedes encontrarla en la plantilla Figma aquí
Fondo claro y oscuro de la tarjeta Compact Loyalty
Nuevamente, si creas un fondo oscuro, la app utilizará tipografía blanca, pero si eliges crear un fondo claro, utilizará tipografía negra. Tenlo en cuenta para equilibrar el contraste entre el fondo y el texto que introduces en la app, de modo que sea legible.
Usos
- Tarjeta Compact Loyalty en la pantalla de inicio
Requisitos
- Tamaño de la imagen: 1200 x 433 píxeles
- Formato de la imagen: PNG
- Nombre: compact_cardbg.png
Logotipo de la tarjeta Loyalty
Si tu app tiene la posibilidad de acumular puntos Loyalty en la caja o en el kiosco, esta mostrará en el reverso de la tarjeta un código QR o de barras. Junto a ese código, mostraremos el logotipo de tu marca.
- Si utilizas un fondo oscuro en la imagen de la tarjeta Loyalty, usa la versión negativa del logotipo (brillante/blanco).
- Si utilizas un fondo claro, usa la versión habitual del logotipo.
Puedes encontrarlo en la plantilla Figma aquí.
Requisitos
- Tamaño de la imagen:
- Altura máxima: 36 píxeles
- Ancho máximo: 89 píxeles
- Formato de la imagen: SVG
- Nombre: loyalty_card_logo.svg
Imágenes de descripción del programa
Las imágenes de descripción del programa hacen que la información sea más inmersiva y fácil de entender. Cada imagen pertenece a un párrafo que debe explicar un hecho sobre el programa. Puede haber tres párrafos como máximo.
Puedes encontrarlas en la plantilla Figma aquí.
Usos
- Página de información del programa Loyalty
Requisitos
- Tamaño de la imagen: 224 x 224 píxeles
- Formato de la imagen: PNG
- Nombres:
- loyalty_desc_heading1.png
- loyalty_desc_heading2.png
- loyalty_desc_heading3.png
Iconos
Debes diseñar los iconos Loyalty de modo que coincidan con el resto de iconos de la app, pero que también reflejen el estilo de tu marca. Los iconos deben representar el nombre y la función que tienen en la app.
Puedes encontrar esos iconos en ambos conjuntos Thinner y Bolder en las secciones de Loyalty.
Requisitos
- Tamaño del icono: se define debajo de cada icono en la imagen
- Formato: SVG
- Convención de nomenclatura adecuada
Imagen de la pantalla de inicio con Loyalty
Esta se utiliza como imagen de bienvenida en la página de inicio de la app. Puedes elegir una imagen de inicio regular o compacta.
Ten en cuenta lo siguiente: es muy importante no colocar ningún texto ni logotipo fuera del área segura, ya que, de hacerlo, quedará oculto tras el botón, la barra de estado y el componente de puntos Loyalty.
También recuerda lo siguiente: en el caso de las marcas que no utilizan Loyalty, el área segura es diferente. Comprueba los requisitos de la pantalla de inicio en “Home Screen Images” (Imágenes de la pantalla de inicio).
Imagen regular de la pantalla de inicio
Requisitos
- Tamaño de la imagen: 1125 x 1665 píxeles
- Área segura: 1125 x 1026 píxeles
- Formato: PNG, JPG
- Nombre del archivo: hero_image.png
Imagen compacta de la pantalla de inicio
Requisitos
- Tamaño de la imagen: 1125 x 996 píxeles
- Área segura: 1125 x 357 píxeles
- Formato: PNG, JPG
- Nombre de archivo: hero_image_compact.png
Destaca el último nivel de recompensas
Si tus recompensas se organizan en niveles, puedes configurar el último nivel para que se destaque visualmente (lo destacas en la app). Si utilizas esta función, debes proporcionar el icono de último nivel como se muestra en la imagen debajo.
Requisitos
- Tamaño del icono: 32 x 32 píxeles
- Formato: SVG
- Nombre del archivo: final_tier.svg
Comentarios
0 comentarios
Inicie sesión para dejar un comentario.