Colores y paletas
Fenómenus trabaja a partir de una paleta y no de colores libres. Cada ajuste individual elige una casilla de esa paleta, y eso es lo que hace que un menú parezca un único diseño en lugar de una colección de decisiones.
De dónde sale la paleta
El asistente de configuración la construye a partir de tres respuestas:
- Claro u oscuro — el fondo, el texto principal y los colores de los enlaces;
- Color de resaltado 1 — la familia de colores principal;
- Color de resaltado 2 — la familia de colores secundaria.
A partir de los dos colores de resaltado obtiene cinco tonos de cada uno y añade un conjunto fijo de neutros que va del blanco a los grises y al negro. También genera los estilos de botón estándar: principal relleno, secundario relleno, contorno oscuro y claro, y subrayado oscuro y claro.
Cambiar la paleta más adelante
Volver a ejecutar el paso de color del asistente de configuración regenera la paleta y los estilos de botón. Es un cambio a nivel de todo el sitio: cada menú, cada elemento de navegación y cada hoja de estilos generada lo siguen.
Trátalo como un rediseño deliberado y no como un experimento, y vuelve a comprobar cada menú después.
Qué ajustas por tipo de menú
En Settings → Restaurant settings → Content settings → Content settings, tres grupos de ajustes de paleta:
Navegación de categorías
- color del divisor;
- color del texto, usado por los enlaces y el indicador activo;
- color de fondo, usado detrás de la barra y sus fundidos laterales.
Conmutador fijo de contacto
- color del texto, para la etiqueta y los iconos;
- color de fondo, para el botón flotante y su etiqueta.
Opciones fijas de contacto
- fondo y texto de la opción inactiva;
- fondo y texto de la opción activa.
Cada uno de estos elige una casilla de la paleta, no un color arbitrario.
Elegir colores que funcionen en un comedor
- Empieza por la sala. Las paredes, la vajilla, el logotipo. Una paleta que existe físicamente en el restaurante siempre parece intencionada.
- Claro u oscuro es una decisión de la sala. Un menú oscuro encaja en un comedor oscuro y resulta más difícil de leer en una terraza soleada.
- El contraste no es opcional. Los menús se leen en móviles a la distancia de un brazo, a menudo con poca luz y a menudo por comensales que no trajeron sus gafas.
- El estado activo debe ser evidente. Si la opción fija activa y las inactivas se parecen, los comensales pierden la pista de qué menú están leyendo.
La elección claro/oscuro llega más lejos de lo que crees
Varios diseños adaptan los fondos, las sombras y las superposiciones de sus tarjetas según si el fondo del sitio es claro u oscuro. Cambiarlo después de construir los menús modifica más que el color de fondo, así que comprueba cada diseño después.
Colores en el PDF
El menú imprimible tiene sus propios ajustes de color, por tipo de menú, elegidos como valores explícitos y no como casillas de la paleta: color del encabezado de categoría, color del encabezado de artículo y color del texto del artículo.
No heredan de la paleta del sitio, así que un menú impreso puede alejarse del digital salvo que los configures para que coincidan. Consulta Tipografía y colores en el PDF.
Compruébalo
- [ ] El texto se lee bien sobre el fondo, en un móvil, con la iluminación real de la sala.
- [ ] Los precios se leen tan bien como los nombres de los platos.
- [ ] La categoría activa y la opción fija activa son inconfundibles.
- [ ] Los iconos de alérgenos son visibles sobre el fondo.
- [ ] Los botones se reconocen como botones.
- [ ] Cada tipo de menú parece del mismo restaurante.
- [ ] Los colores del PDF son deliberados, no dejados en sus valores predeterminados por accidente.