Paradigmas de decisión en paletas de color

Una paleta de color bien pensada da coherencia y claridad a un sistema de diseño. Cuando los colores se eligen sin reglas, aparecen catálogos enormes y confusos. Aquí verás cómo definir paradigmas de decisión, construir jerarquías visuales y documentar tu paleta para que todo el equipo la entienda y la use con confianza.

¿Cómo clasificar colores en un sistema de diseño?

La clave es clasificar y categorizar los colores para su uso por todo el equipo. Puedes usar varios enfoques según el producto, pero lo importante es que exista una lógica compartida que puedas explicar y defender ante equipo y usuarios.

¿Qué propone Material Design con primarios y secundarios?

• Usar colores primarios y colores secundarios.
• Definir action colors para los call to action visibles e inequívocos.
• Priorizar alto contraste y brillo en las acciones como comprar, cancelar o confirmar.
• Entender que los secundarios complementan sin competir con el foco principal.

¿Cómo afectan los brand colors?

• Los brand colors trasladan el color de la marca a la plataforma.
• Si la marca es muy dominante (ejemplo: Platzi es verde), el action color puede confundirse con comunicación de marca.
• En marcas rojas, los CTAs rojos son retadores pero posibles; hay ejemplos que lo hacen así.
• Decide si el color de marca se reserva a comunicación y se usan otros tonos para acciones.

¿Qué son grises y backgrounds y por qué importan?

• Define una escala de grises del blanco al negro con una tonalidad coherente.
• Elige backgrounds para dar contraste a acciones, marca y grises.
• Aun sin pantallas diseñadas, un buen fondo ayuda a evaluar combinaciones.
• Ajusta y calibra con el tiempo: el consenso del equipo es parte del proceso.
• Los paradigmas de decisión fundamentan tu paleta cuando alguien pregunte: “¿por qué ese naranja para el botón?”.

¿Cómo construir jerarquía visual y una paleta práctica?

Empieza con una línea de color sencilla. Por ejemplo, un primario morado y un secundario azul. Asigna el primario al botón de acción y usa el secundario en botones secundarios o títulos. Ajusta la intensidad (por ejemplo, con opacity) para que la jerarquía no se pierda.

¿Cómo generar jerarquía con primarios y secundarios?

• Asegura que el primario sea más profundo que el secundario.
• Si compiten, baja la intensidad del secundario para clarificar el orden.
• Mantén la coherencia: el mismo color debe comunicar el mismo nivel de importancia.

¿Qué hacer con colores booleanos rojo y verde?

• Necesitas colores afirmativos y negativos (también llamados booleanos): verde positivo y rojo negativo.
• Son difíciles cuando coinciden con la marca, pero se resuelve con variantes más sobrias o distinta intensidad.
• Distingue brand colors de action colors cuando generen confusión.
• Puedes definir por cada color varias variantes de menor intensidad para combinar con flexibilidad.

¿Con cuántos colores empezar y cómo escalar?

• Comienza con uno, dos o tres colores que entiendas y puedas justificar.
• Evita tablas de 40 colores sin propósito.
• Alinea la paleta con los objetivos del cliente.
• Si el producto usa colores por secciones (clientes, ventas, compras), combina más de un paradigma sin perder la lógica global.

¿Cómo documentar colores y compartirlos con el equipo?

Documentar hace visible la lógica de tu paleta y facilita su adopción. Usa tu documentación en Notion y apóyate en DexD para presentar la paleta como referencia consultable por todos.

¿Qué pasos seguir para documentar bien?

• Crea muestras: toma screenshot o exporta el elemento (command E o control E).

• Prefiere exportar para evitar fondo blanco en la muestra.

• En tu sección de foundations > colors, coloca la muestra y el hexadecimal.

• Añade descripciones breves: uso, jerarquía, variantes.

• Mantén una paleta pequeña pero clara, suficiente para decisiones reales.

• Si la marca es dominante (ejemplo: verde de Platzi), clasifícala para comunicación de marca y define un action color distinto para evitar ambigüedad.

• Consejos prácticos.

  • Usa una pantalla de referencia para probar combinaciones reales.
  • Ajusta con opacity o intensidad si se pierde jerarquía.
  • Itera con el consenso del equipo y documenta cambios.
  • Etiqueta tu paleta por paradigmas: primarios, secundarios, acción, marca, grises, backgrounds, booleanos.

¿Tienes dudas sobre cómo nombrar variantes o separar acción de marca en tu producto? Cuéntame en los comentarios cómo estás clasificando tus colores y qué decisiones te han funcionado mejor.