¿Qué hace Calm, Dense Design?
Un gusto, no una skin. Linear y Things 3 son referencias para el juicio — cómo presentar mucha información sin ruido, y cómo mantenerse calmado sin volverse vago. Tomar su tema oscuro, acento púrpura o color de marca azul/verde no es tomar el gusto.
Dos lecciones contienen la mayor parte del valor:
- Linear — densidad sin ruido. Muestra trabajo denso con jerarquía contenida.
- Things — calma sin debilidad. Mantén la superficie principal calmada ocultando el detalle hasta que se gane su lugar, no vaciando la pantalla.
Principios
Cada uno es una regla más el corte que impone. Aplícalos al construir o criticar una superficie.
- No compitas por atención que no has ganado. Los cromados, separadores, metadatos, pestañas inactivas e iconos repetidos se retraen; el contenido principal y la única acción primaria se leen primero sin gritar.
- La estructura se siente, no se ve. Obtén jerarquía de la alineación óptica, un ritmo de espaciado consistente, separadores de 0.5–1px, pasos de opacidad, fondos agrupados y tipografía — no de bordes pesados, sombras grandes, degradados decorativos, paneles saturados o contenedores de iconos.
- Densidad sin desorden. Filas compactas con alineación predecible y divulgación progresiva del detalle. No: texto minúsculo ilegible, cada fila exponiendo todos los controles, o relleno inflado vendido como "premium".
- Calma que aclara, no calma que esconde. La calma proviene de una jerarquía clara y una siguiente acción obvia — no de espacios en blanco pálidos, texto de bajo contraste fingiendo ser silencioso, o estados vacíos usados como decoración.
- Color semántico contenido. El acento marca selección, foco, estado importante y estado positivo/completado — nunca decoración. Respeta el acento del sistema; no repintes todo con un color de marca. Un "verde de completado" es una señal semántica, no el color primario de la app.
Tipografía y movimiento
- Tipografía: fuentes del sistema a menos que haya una razón sólida en contrario; jerarquía mediante tamaño, peso, opacidad y colocación. Dirección: título de pantalla (claro, no sobredimensionado) → título de fila (peso medio) → metadatos (más pequeño, menor opacidad) → estado (compacto, semántico, no recargado de insignias) → cuerpo (corto, legible).
- Movimiento: explica continuidad o cambio de estado (un compositor apareciendo, una selección moviéndose, una actualización de estado en línea). Nunca ornamental. Respeta siempre el movimiento reducido.
Dos pruebas de decisión
- Prueba de drama: si un tratamiento añade drama visual pero no mejora la orientación, velocidad, confianza o finalización de la tarea — elimínalo.
- Prueba de calma: si la "calma" hace que la jerarquía, densidad o la siguiente acción sean más difíciles de leer — no es calma, es vaguedad. Apriétala.
Autoverificación
Lee una pantalla contra estos puntos. Un "no" es un hallazgo, no una preferencia:
- ¿La tarea principal es obvia de un vistazo, sin que el ojo tenga que buscar?
- ¿El cromado secundario se retrae, o compite?
- ¿Están las filas/elementos alineados en una cuadrícula y línea base predecibles?
- ¿La pantalla es densa porque es informativa — o escasa porque el relleno está inflado?
- ¿El color comunica estado, o es decoración de marca?
- ¿Podrías eliminar un separador, sombra, degradado o contenedor de iconos y no perder nada?
Profundizando
references/in-practice.md — valores concretos (ilustrativos), listas expandidas de Preferir/Evitar, y cómo aplicar este gusto durante una revisión.
No es trabajo de este skill
Este es un gusto agnóstico de plataforma. Las convenciones, controles y arquitectura de plataforma viven en otro lugar:
- Apple (iOS/iPadOS/macOS) UI + HIG + SwiftUI/AppKit + QA visual →
apple-app-design-guidelines. - Arquitectura de escritorio multiplataforma con sensación nativa (shell + WebView + IPC) →
native-feel-desktop.
Cuando el gusto y la plataforma entran en conflicto, la plataforma gana — difiere a esos skills.