Nota histórica: este artículo fue publicado originalmente en octubre de 2011. Refleja los debates de la época sobre la transición del diseño gráfico tradicional al soporte digital, las limitaciones de los navegadores de entonces (como Internet Explorer) y el nacimiento del diseño responsivo. Lo conservo en el archivo como registro de esa evolución.
Este artículo trata de develar los aspectos básicos que debe tener un diseñador gráfico al afrontar proyectos webs. Estas ideas y conceptos de diseño son algunas de las reflexiones de los tantos puntos de inflexión a la hora de diseñar. Sería muy bueno ir extendiendo estas ideas y que ustedes colaboren a la redefinición de la problemática.
La primera respuesta que puedo tener a punta de lengua es un “diseñador”, pero… ¿es en realidad un diseñador gráfico? Se suelen presentar sinfines de pseudocapacitados del diseño: desde audaces, creativos, artistas, arquitectos, amigos, el vecino, programadores y, alguna vez, un valiente diseñador gráfico.
Esta realidad no se da porque contemos con un parque limitado, sino todo lo contrario. El problema radica más profundamente en el corazón de las escuelas de diseño, donde no se educa, adiestra, ni presenta la herramienta, ni se debate la problemática.
Este es un tema que lo he charlado hasta el cansancio con varios docentes de diferentes instituciones. Los motivos son miles: desde porque no son suficientes tres años de carrera, porque la informática e internet evolucionan a velocidades que no dan respiro a preparar y ajustar un programa sin que este caiga en desuso, porque no hay profesionales que puedan claramente transmitir los conceptos y técnicas sobre las herramientas, o porque los alumnos de diseño gráfico son solo “gráficos”.
Aclaro que, para mí, el diseño web es “diseño gráfico”, por el simple motivo de ser un “medio visual”. Ojo, algunos se apresurarán a corregir que es audiovisual, interactivo y demás cosas (lo cual es verdad), pero desde el origen de las salidas en el caso del monitor, los elementos fueron solo visuales. A duras penas, con los escasos píxeles disponibles más la buena voluntad de la imaginación, se lograron cosas fabulosas. Por lo tanto, los problemas que se plantearon originalmente no distan tanto de los actuales. El cliente pretenderá dar solución a una necesidad de comunicar, haciendo uso de las más variadas técnicas básicas o avanzadas del diseño, como el color, la forma, la tipografía, la escala, la gama, el espacio y el orden.
Todos estos recursos son propios y pertinentes a un diseñador gráfico. Queda claro que él mismo es la persona más adecuada para dar solución a las funciones y comunicaciones que requieran de orden, jerarquía y semántica de los signos.
Pero sabemos que los matices van más allá de las fronteras actuales del diseño académico: hay elementos que nos obligan a entender y saber cómo funciona el medio o soporte donde se plasmará nuestro diseño. Así como el diseñador establece un lienzo o soporte predefinido (ancho, alto), también se deberá familiarizar, por ejemplo, con el medio de impresión que se utilizará para producir la pieza. El diseño puede verse enriquecido o desfavorecido con el simple cambio de una variable, por ejemplo, el sistema de impresión: la serigrafía no será adecuada para algunos cuerpos tipográficos que la impresión offset puede reproducir sin problemas.
Constantes y variables
Estas palabras en el mundo del diseño web son muy recurrentes en diferentes ámbitos y contextos, pero el fin es similar. El diseño web y el gráfico tienen los mismos elementos constantes que aprendimos con nuestros profesores: la jerarquía y el orden de los elementos para favorecer la lectura o crear un recorrido sobre la pantalla son los mismos principios que en el papel.
El color también cumple un rol importante en la comunicación web, aunque haya colores que son rápidamente relacionados con grandes marcas impuestas. De todos modos, las reglas y técnicas siguen siendo efectivas: un titular de color rojo despertará más interés que uno gris.
El tamaño, el espacio y el orden también son recursos muy utilizados en la gráfica para generar secuencias de lectura, acentuar un mensaje o dotarlo de significado. Pero por el contrario, cuando el diseñador se dispone para la web, pareciera que entra en pánico, ataque y locura, a tal punto que realiza diseños que jamás propondría en una pieza gráfica tradicional.
Hasta aquí, definimos las constantes generales que se presentan al diseñar para la web; este punto no es realmente el que más complicaciones presenta, ya que a un buen diseñador todo lo nombrado le es habitual y cotidiano.
El problema está en las variables: cuando la información debe adecuarse a una resolución, una limitación tipográfica, una lectura forzada lineal, un scroll, un dispositivo de salida particular, una superficie, la interactividad, la navegación, una cultura de lectura, un redimensionamiento, la accesibilidad o el posicionamiento. Aquí, el diseñador gráfico va rumbo al neuropsiquiátrico.
Para que esto no suceda, el diseñador debe estar adaptado al tiempo y la forma de los recursos, técnicas, tendencias, herramientas y dispositivos actuales. No quiere decir que tenga que migrar a ser un híbrido ni mucho menos programador: el diseñador debe conocer el medio donde se desenvuelve sin quitar el foco en su función principal; para el resto existen programadores, analistas y técnicos especializados. Hoy en día, el destino del diseñador es el mismo que hace años: diseñar. Cambian los medios y los paradigmas, pero creo que el siguiente paso del diseñador es dirigir, supervisar y coordinar grupos interdisciplinarios donde el fin es prestar soluciones y comunicar.
Algunas variables
Multidimensional
En la gráfica tradicional, por lo general se nos presenta una sola dimensión del soporte a trabajar; en la web pasa todo lo contrario, ya que en la pantalla (aunque sea un elemento plano bidimensional) se pueden crear múltiples dimensiones de lienzos, unos sobre otros o unos al lado de otros. Este concepto de apilamiento o capa (layer) es una de las características actuales más básicas, como lo es la vieja técnica de perspectiva isométrica para simular un espacio tridimensional.
También lo multidimensional es afectado por la evolución y disponibilidad de los equipos. Con la aparición de las tabletas, lo multidimensional hace un cambio rotundo, ya que se presenta como recurso normal el uso de múltiples escritorios, resultando tan natural que la mayoría de los dispositivos táctiles lo adoptan.
Podemos plantear un diseño basado en capas, donde la información adopte importancia según el orden de apilamiento, donde el objeto en primer plano sea el discurso actual del mensaje. Múltiples escritorios, múltiples capas ya están aquí: lo podemos ver en un simple lightbox.
Resolución
Esta es una de las limitaciones más grandes para el diseñador, ya que la capacidad de representación de píxeles ha ido variando con el tiempo. El diseño se debía adecuar a caber sobre la pantalla para evitar el scroll horizontal. Por entonces, se diseñaba basándose en medidas de no más de 740 píxeles de ancho para no superar los 800 píxeles totales. Con el tiempo se impuso el modelo de 960 píxeles, y hoy en día conviven resoluciones muy diversas.
Con la aparición de pantallas de smartphones y tabletas, las páginas se enfrentan al reto de la rotación y el cambio de aspecto. Para esto surge el diseño responsivo, que responde según el dispositivo y su orientación, organizando, reestructurando o quitando elementos según sea necesario para la mejor lectura de la información.
Scroll
Al scroll, por alguna razón, muchos se encargaron de eliminarlo u odiarlo. La realidad es que la información en la web es lineal. Comenzamos a ver páginas donde la animación y el movimiento titilante circundaban la información básica, generando esperas y confusión. Ese modelo no soportó la prueba del tiempo y hoy entendemos que la información es lo que la mayoría de las personas buscan.
El scroll aparece como nuestro aliado, porque al disponer de él disponemos de más espacio lineal para contar y mostrar información, organizándola en un orden de lectura natural (porque el usuario naturalmente sabe scrollear).
La lectura
Al leer información sobre una web se deben establecer los criterios básicos aprendidos en diseño editorial, sumando pautas que favorezcan la lectura en el soporte digital. El ojo salta de módulo en módulo. Nuestro deber como diseñadores es evitar el estrés visual utilizando recursos simples: tipografías jerarquizadas, buen contraste, espacios de descanso y estructuras repetitivas que establezcan un sistema de lectura.
Usuarios
El usuario web se comporta de manera errante y a veces impredecible. Establecer criterios claros de navegabilidad es fundamental: menús principales claros con buen contraste, evitar la recarga innecesaria de páginas, no autocargar elementos multimedia y ajustar el diseño a estándares de accesibilidad.
Navegadores
La diferencia de renderización entre navegadores siempre ha sido un desafío, históricamente acentuado por Internet Explorer. Hoy en día, los motores modernos facilitan la normalización, pero el diseño siempre debe partir de la accesibilidad y la disponibilidad tecnológica.
Agradecimiento: la colaboración y aportes de la diseñadora gráfica Mercedes Olano, con quien gratamente cuento con su amistad y calidad profesional. ¡Gracias Mechi!