Principios de diseño gráfico que todo diseñador debería adoptar
Los diseñadores gráficos resolvieron los problemas de jerarquía, cuadrícula, ritmo y sobriedad hace décadas. Esta es la guía definitiva sobre lo que los diseñadores digitales deberían adoptar en 2026.
Los diseñadores gráficos ya resolvieron casi todos los problemas con los que lidiamos en pantalla. Lo hicieron antes de que naciéramos, con presupuestos más reducidos, herramientas menos avanzadas y la implacable disciplina de una fecha límite que marcaba el inicio de la producción a las tres de la mañana.
Cada oleada de diseño digital redescubre su trabajo, lenta y torpemente. Inventamos un nuevo sistema de cuadrícula cada cinco años. Renombramos la jerarquía como "peso visual" y fingimos que es algo novedoso. Discutimos sobre el espacio en blanco como si fuera una presentación de una startup.
El sector ya resolvió la mayor parte de esto. El trabajo está ahí, en una edición encuadernada de Wired de 1995 o en un libro de bolsillo de Penguin de 1947, esperando a que lo revises. La impresión no es un museo. Es una biblioteca en funcionamiento a la que puedes entrar, tomar lo que necesites y salir.
Por qué la impresión resolvió esto primero y seguimos olvidándolo
La impresión tenía limitaciones de las que el diseño digital aún pretende estar exento. Una página es un lienzo fijo. Imprimir y distribuir una doble página de una revista cuesta dinero real.
Cada decisión tenía un costo, y ese costo obligaba a la editorial a ser más comedida. Los diseñadores de medios impresos también tenían que competir por la atención del lector con la siguiente página, no con TikTok. La competencia era justa. Las herramientas se limitaban a tipografía, imagen, color, papel y cuadrícula.
Con esos cinco elementos, Massimo Vignelli creó la identidad Unimark para American Airlines. Paula Scher diseñó los carteles más icónicos de Pentagram. Wim Crouwel creó el lenguaje visual del Museo Stedelijk. Cinco herramientas, décadas de tradición.
Los diseñadores digitales tienen miles de herramientas y la mayoría aún no logra crear una página de destino que respete al lector. La limitación no son las herramientas. La limitación es que nadie nos obligó a estudiar la tradición.
Los siete principios que la impresión dominó
Dejando de lado el romanticismo, encontramos siete principios que la impresión dominó y en los que el mundo digital sigue tropezando.
-
Jerarquía. Una cosa es la principal. Todo lo demás está al servicio de la principal.
-
Cuadrícula. Una cuadrícula es un contrato con el lector, no una jaula para el diseñador.
-
Ritmo. Página tras página debe sentirse como una pieza musical, no como una máquina tragamonedas.
-
Escala. Lo grande es grande porque se lo merece, lo pequeño es pequeño porque también se lo merece.
-
Contraste. Grosor, color, densidad y escala de la tipografía. El contraste es cómo se mueve la vista.
-
Modernidad. La mayoría de las decisiones son decisiones de eliminar, no de añadir.
-
Respeto por el lector. El tiempo, la atención y la inteligencia del lector son el presupuesto que se invierte.
Estos siete principios subyacen a toda gran obra impresa. Aparecen en un libro de bolsillo de Penguin de la época de Tschichold y en una portada de Bloomberg Businessweek bajo el sello de Richard Turley. Aparecen de la misma manera en un mapa del metro de Vignelli y en la introducción de un artículo de The New York Times Magazine. Los nombres cambian, pero los principios permanecen.
Jerarquía y cuadrícula: elige un titular y asócialo a un contrato
Abre cualquier número de Bloomberg Businessweek de la época de Richard Turley, aproximadamente entre 2010 y 2014. Cada doble página tiene un titular. El titular es enorme, el texto de apoyo es pequeño, la imagen es o muy llamativa o muy sutil, y no hay duda de por dónde empezar.
Compáralo con una página de marketing típica de SaaS en 2026. El titular principal, la ceja, el subtítulo, los tres puntos destacados, el testimonio y el degradado intentan ser el titular. Ninguno lo consigue. El lector abandona la página.
La solución para la impresión es drástica. Observa tu pantalla, pregúntate cuál es el titular y luego reduce visiblemente el tamaño, la luminosidad o la discreción de todos los demás elementos. Si dos elementos compiten entre sí, no hay jerarquía. Hay ruido disfrazado de jerarquía.
El titular tiene que ubicarse en algún lugar. Ese lugar es la cuadrícula. Jan Tschichold rediseñó la línea de libros de bolsillo de Penguin a finales de la década de 1940 utilizando una cuadrícula tan disciplinada que los libros aún se ven modernos.
Wim Crouwel hizo lo mismo con el diseño cívico holandés. Massimo Vignelli implementó el sistema Unigrid en todos los folletos del Servicio de Parques Nacionales de Estados Unidos, y esos folletos siguen imprimiéndose, legibles y hermosos, cincuenta años después.
Una cuadrícula no es la estructura de doce columnas con la que viene de fábrica tu interfaz. Una cuadrícula es la garantía de que los titulares comiencen siempre en el mismo lugar, que los pies de foto se ubiquen en una columna fija, que los márgenes interiores no se muevan y que la vista pueda confiar en la página. El lector no ve la cuadrícula; la siente.
La mayoría de los productos digitales no tienen cuadrícula. Tienen un diseño que sobrevivió a la última revisión. Eso no es lo mismo.
Ritmo y escala: diseña la segunda página, justifica su tamaño
Un diseñador gráfico piensa en pliegos, no en páginas. Un director de arte de una revista planifica cómo un artículo comienza, respira, acelera y culmina, del mismo modo que un editor de cine corta una escena. Wired, en la época de Carson y Plunkett, era famosa por esto. Cada artículo era una pieza musical, no una sola nota.
El diseño digital se centra abrumadoramente en pantallas individuales. El artículo principal recibe cien horas de atención, el segundo quince minutos, el tercero nada. Luego nos preguntamos por qué nuestras páginas de marketing se desploman en la parte inferior de la página.
Aprenda de esta técnica. Diseñe la página completa como una secuencia de ritmos. Si no puede describir el ritmo en voz alta, la página no lo tiene.
La escala es la prima ruidosa del ritmo. Los carteles del Public Theater de Paula Scher son una lección magistral sobre la escala. El texto llena el cartel, recortado en los bordes, con un solo grosor que lo hace todo.
El tamaño es el mensaje. Se lee el texto porque el texto define el espacio.
El diseño digital tiende a usar tipografías grandes para crear una atmósfera, en lugar de para hacer una declaración. Los titulares de 48 píxeles que dicen "Bienvenido a la plataforma que potencia a tu equipo" no son grandes porque se lo hayan ganado. Son grandes porque el sistema de diseño envió un token display-xl y alguien lo usó.
La regla de impresión es simple: si un texto es grande, las palabras que contiene deben justificar ese espacio. O las palabras merecen el tamaño o este se reduce. No hay una tercera opción.
Los cinco pecados digitales que los principios de impresión corrigen
La mayoría de los malos diseños digitales se basan en uno de cinco errores recurrentes. Cada uno tiene un principio de impresión que lo corrige al instante.
| Principio de impresión | Pecado digital común | La solución |
|---|---|---|
| Jerarquía | Todo tiene el mismo tamaño, nada lidera | Elige el único líder, reduce visiblemente el resto |
| Cuadrícula | Diseño decorativo, sin estructura subyacente | Establece una cuadrícula real, alinea cada elemento con ella, sin excepciones |
| Moderación | Demasiadas fuentes, demasiados efectos | Limita las fuentes a dos, elimina bordes, sombras y degradados innecesarios |
| Escala | Tipografía grande con palabras débiles | Ajusta el tamaño de las palabras para que justifiquen el efecto, o reduce el tamaño de la fuente |
| Contraste | Interfaz plana gris sobre gris sin anclaje | Añade contraste de grosor real, anclaje de color real, cambio de densidad real |
Lee la tabla una vez y luego analiza tu propio producto. Encontrarás al menos tres de estos errores en la pantalla que lanzaste este mes. No te preocupes, casi todos los cometen. Lo importante es identificarlos para poder corregirlos.
Moderación y respeto: los dos principios difíciles de aprender
La trayectoria profesional de Vignelli fue una lucha contra la ornamentación. A partir de cierto punto, utilizó solo cinco tipografías durante el resto de su carrera. Creía que la mayoría de los problemas de diseño se debían a añadir elementos que deberían haberse eliminado. Tenía razón en casi todos ellos.
La moderación es el principio más difícil de interiorizar porque el trabajo visible en el diseño reside en lo que se añade. Nadie aplaude el degradado que eliminaste, el icono que recortaste, la tercera fuente que te negaste a cargar. El lector aplaude, en silencio, al terminar de leer la página.
Una regla práctica: antes de publicar una pantalla, elimina tres elementos y comprueba si el diseño sigue funcionando. Si es así, mantén los elementos eliminados.
El respeto por el lector es el principio que rige la moderación. El formato impreso trata al lector como un adulto. Penguin asumió que podías leer una novela de cuatrocientas páginas con letra Garamond de once puntos sin indicadores de desplazamiento, sin barra de progreso, sin tiempo de lectura estimado.
El formato digital lleva quince años insultando silenciosamente a sus lectores. Marcadores de tiempo de lectura, barras de progreso, secciones de "TLDR" dentro de artículos que son, en sí mismos, resúmenes. Se da por sentado que el lector no puede leer sin ayuda.
Olvídate de esa suposición. Tu lector es un adulto. Te recompensará leyendo.
Cómo leer un excelente artículo de opinión
Tome un número antiguo de la revista del New York Times, o un ejemplar de Bloomberg Businessweek de la época de Turley, o cualquier informe anual de Pentagram. Abra un artículo de opinión. Ahora, observe con atención.
Fíjese en el texto principal. Hay uno solo. Puede ser el titular, la imagen o una cita.
Observe dónde se ubica el texto principal, casi siempre en una intersección de la cuadrícula, nunca centrado por el mero hecho de estar centrado. Observe el texto de apoyo, más pequeño, a menudo más claro, que nunca compite con el principal.
Observe el espacio en blanco, más abundante de lo esperado, con forma definida, no accidental. Observe los pies de foto, diminutos, anclados a una columna fija. Observe los folios, que se encuentran en un lugar fijo y no se mueven.
Así funciona la cuadrícula. Así funciona la jerarquía. Así funciona el ritmo.
Cada una de estas decisiones fue tomada a propósito, por una persona, pensando en el lector.
Lecciones de tipografía que se traducen con claridad
La tipografía impresa lleva décadas de ventaja a la tipografía digital en tres aspectos clave.
Primero, la proporción. Los diseñadores de impresión eligen una escala tipográfica y se ciñen a ella: tercio mayor, cuarto perfecto, proporción áurea, etc.
El diseñador digital, en cambio, elige: «Bueno, el sistema de diseño tiene ocho tamaños, y usaré la mayoría». Eso no es una escala, es un buffet libre.
Segundo, la longitud de línea y el interlineado. El canon de la impresión se estableció en torno a sesenta y seis caracteres por línea para el cuerpo del texto, con un interlineado de aproximadamente el ciento cuarenta por ciento del tamaño de la fuente. El diseño web suele publicar párrafos de ciento veinte caracteres de ancho con un interlineado mínimo porque así lo dicta el sistema de diseño.
Tercero, la combinación de tipografías. La regla de la impresión es de un máximo de dos familias tipográficas, y deben cumplir funciones diferentes: texto y títulos, o serif y sans.
La regla digital, de alguna manera, se convirtió en «usar Inter y luego añadir otras cuatro fuentes porque al equipo de marketing le gustan». Limita tus fuentes a dos y tu jerarquía visual se vuelve mucho más nítida.
Lecciones sobre espacio en blanco y diseño de portadas
El espacio en blanco no es lo negativo del diseño. Es diseño. La escuela suiza lo enseñó en la década de 1950 y, de alguna manera, lo hemos perdido dos veces desde entonces.
Observa un póster de Müller-Brockmann. El espacio en blanco cumple una función estructural. Enmarca el texto, guía la mirada y proporciona un espacio para los elementos más llamativos.
El espacio en blanco no es la ausencia de contenido. Es la parte de la página que hace que el contenido sea legible. Los productos digitales le temen al espacio en blanco porque los píxeles vacíos se perciben como espacio desperdiciado. No lo son.
Son el respiro que permite al lector quedarse. Una página de destino con el doble de espacio en blanco convierte mejor que la misma página con el doble de texto. Pruébalo con tu propio producto. Observa qué sucede.
La portada de una revista tiene dos segundos para cumplir su función en un quiosco. Debe transmitir la marca, destacar la noticia principal y verse bien en miniatura. Los diseñadores editoriales llevan cien años resolviendo este problema.
La imagen principal de tu página de inicio, la pantalla de bienvenida, el icono de tu app, la imagen para compartir en redes sociales: todas son portadas. La misma regla de los dos segundos.
Adopta la fórmula. Una idea dominante, un ancla tipográfica, una imagen que no parpadee. Si tu imagen principal necesita tres líneas de texto para explicarse, no es una imagen principal.
Lo que no se traslada del formato impreso al digital
La impresión no lo solucionó todo. Sé honesto sobre lo que el formato impreso no te puede ofrecer.
La impresión no solucionó la interactividad. Una página no responde a un toque. El formato impreso no te enseña nada sobre el estado, la retroalimentación, el manejo de errores ni el momento en que el usuario hace algo que no anticipaste.
La impresión no solucionó el movimiento. Los diseñadores editoriales piensan en la quietud. El movimiento es un arte que se aprende de la animación, el cine y los videojuegos, no de una página de revista.
La impresión no solucionó el diseño adaptable. La cuadrícula impresa te enseña disciplina, pero la cuadrícula adaptable es un problema que se resuelve además de eso.
El principio perdura, la implementación no. Toma los principios, deja las suposiciones. Así es como se roba correctamente.
Creando un sistema de diseño inspirado en la impresión
Puedes incorporar todo esto a un sistema de diseño sin que nadie te tache de pretencioso. El truco está en codificar los principios como restricciones, no como adornos.
Limita tus tipografías a dos. Limita tus tamaños de fuente a seis, a escala real. Limita tus tokens de color a un conjunto funcional, con un solo acento que justifique su presencia.
Limita tus tokens de espaciado a un ritmo que se mantenga en todos los puntos de ruptura. Limita tus tokens de sombra y borde al conjunto mínimo que cumpla su función.
Luego, escribe las reglas de uso. El elemento principal en cualquier vista es el más grande. La cuadrícula es sagrada y la alineación es innegociable. El espacio en blanco es un token, no un sobrante.
La decoración se añade solo cuando cumple una función estructural. Estas reglas se encuentran dentro de la documentación del sistema de diseño, junto a los componentes, y se revisan en la crítica de diseño de la misma manera que se revisa el código en las solicitudes de extracción.
Un sistema de diseño sin principios es como un paquete de pegatinas. Un sistema de diseño con principios de impresión integrados es una publicación.
La Bauhaus lo entendió en la década de 1920. Tschichold lo codificó en La Nueva Tipografía en 1928. La escuela suiza lo puso en práctica en la década de 1950.
Pentagram lleva sesenta años comercializándolo. Los principios son estables; lo que cambia es el medio.
Un breve taller que puedes realizar con tu propio producto
Elige una pantalla de tu producto actual: la página de inicio, el panel de control, la página de configuración, la que sea. Observa un objeto impreso que admires: una doble página de revista, una página de informe anual, la portada de un libro de bolsillo, cualquier cosa de Pentagram, Vignelli o Scher. Colócalas una al lado de la otra.
Hazte cinco preguntas: ¿Cuál es la introducción en cada una? ¿Dónde se dirige la mirada primero, segundo y tercero? ¿Cuántas fuentes y tamaños se utilizan, y cuánto espacio en blanco es intencional y cuánto accidental?
Luego, haga los recortes. Elimine tres elementos, reduzca el tamaño de la ceja, limite las fuentes a dos. Mueva el inicio a una intersección de cuadrícula real. Añada espacio en blanco hasta que la página respire.
Pruebe la nueva versión con las mismas cinco preguntas. La mejora será evidente.
Haga esto una vez por semana durante un mes. Su vista se recalibrará. Sus pantallas se volverán más nítidas y resistentes. Su equipo comenzará a notarlo.
Eso es lo que logra la formación en diseño impreso, y puede adquirirla en una tarde.
El canon es una biblioteca en constante funcionamiento; trátelo como tal.
Los nombres que aparecen en este documento no son historia. Vignelli, Tschichold, Crouwel, Scher, Müller-Brockmann, Carson, Turley, Pentagram, Penguin, Bloomberg Businessweek, The New York Times Magazine. Son una biblioteca en constante funcionamiento de la que puede nutrirse esta semana.
Sus libros siguen imprimiéndose. Sus artículos siguen disponibles en línea. Sus principios siguen vigentes.
Compra una monografía. Suscríbete a una revista impresa. Ten a mano un anuario de diseño en tu escritorio. Consúltalos cuando te quedes sin ideas.
El canon siempre te resultará más útil que tu tablero de Pinterest. El campo ya ha resuelto la mayoría de tus problemas. El trabajo está ahí, esperando a que lo descubras. Descúbrelo.
If your product screens feel noisy and flat, hire Brainy to rebuild them with editorial discipline.
Get Started
