Aprende › Diseño de Menú › Detalle del producto

Botón «Agregar», contador e instrucciones

Lección 41 de 51 · 2 min

El video de esta lección llega pronto.

Mientras tanto, sigue los pasos escritos.

Al terminar sabrás

  • Personalizar el texto, el color y la forma del botón de agregar
  • Dar estilo al contador de unidades
  • Estilizar el campo de instrucciones especiales

En el panelTu Menú › Diseño del menú › Detalle › Botón de agregar al carrito

Las tarjetas Contador de unidades y Botón de agregar al carrito del Inspector de Detalle.
  1. Fondo del contador y Color del contador.
  2. Texto del botón («Agregar al pedido»).
  3. Fondo y Redondez del botón.
  4. Tipografía del botón.

Botón de agregar al carrito

Texto del botónLo que dice. Si queda vacío usa «Agregar al pedido».Prueba «Sumar al pedido» o «Lo quiero».
FondoEl color del botón.Tu color primario suele ser la mejor opción: es el botón más importante.
RedondezEl redondeo del botón, en píxeles. Es por dispositivo.
Tipografía del botónEl editor de tipografía del texto del botón.

Contador de unidades

Fondo del contadorEl color de la pastilla del contador (− 1 +).
Color del contadorEl color del contador y de los avisos del panel que no tienen color propio. Solo cambia el contador de unidades: el resto de textos conserva su color.

Instrucciones especiales

Es el campo donde tu cliente escribe notas («sin cebolla», «bien cocido»). La tarjeta Instrucciones especiales controla su aspecto.

Título del campoLa tipografía de la etiqueta del campo.Si el título no se ve, revisa su color contra el fondo del panel.
Fondo del campoEl color de fondo del campo.
Contorno del campoEl color de su borde.
Texto del campoEl color de lo que escribe el cliente.

Haz esto

  • El botón de agregar con el color más fuerte del panel.
  • Un contador con buen contraste: lo toca con el dedo.
  • Un campo de instrucciones que se vea como un campo: fondo y contorno distintos al panel.

Evita esto

  • Un botón del mismo color que el fondo del panel.
  • Un contorno de campo casi invisible: el cliente no sabe que puede escribir.
OpcionalPon a prueba lo que aprendiste2 ejercicios

Ejercicios opcionales: 0 de 2 acertados

Los ejercicios son opcionales: si los haces y aciertas todos, la lección se completa sola. Si no, márcala tú.

¿Algo no coincide con lo que ves en tu panel? Cuéntanos.