• Proximidad
• Color
• Tamaño
• Orientación
• Dirección
• Forma
• Sombreado

El origen es biológico: cuestión de supervivencia de la especie. Más de un astuto lector de xposible confimará su certeza de que las fuentes del diseño son muy profundas...

Dejando de lado las cinco primeras, me centraré en la última, el sombreado. Muy relacionado con el sol, una fuente de iluminación y calor. Viendo la dirección de la sombra, los hombre primitivos (hablo de cuando twitter no existía en incluso antes) sabían cómo encontrar el sol o la hoguera.

Ahora es cuando doy una pirueta en el discurso, para recordar una frase que me dijo hace unos meses un compañero: en el diseño gráfico, la sombra en los elementos suele estar debajo, porque el sol está arriba. Con el tiempo, me he hecho una pregunta: ¿y si el sol no está arriba? Traduzcamos la pregunta a algo relacionado con la web: ¿Y si el call to action no está arriba?

Por si eres uno de los pocos que no conoce qué narices es un call to action (yo hace poco lo era), basta con resumir que es un elemento que debería captar nuestra atención para realizar una acción concreta: darnos de alta, suscribirnos a sus noticias, buscar, ver las ofertas,... cosas así. En ocasiones se destaca usando apropiadamente los atributos precongnitivos mencionados al principio, entre los que seguramente destaquen el color, el tamaño y la forma.

La tesis que defiendo, y bienvenidos sean los comentarios al respecto, es que la sombra o la intensidad de la luz, puede ser un factor importante a la hora de destacar adecuadamente los elementos, y como extra, puede proporcionar una dirección a seguir, y dentro de esa dirección, una orientación hacia el call to action. Como diría Chicho Terremoto Tres puntos, colega.

A continuación tienes una imagen que pretende ilustrar lo que digo: en una rejilla con nueve elementos, el elemento central actua como "sol" que "ilumina",siendo el sol del ejemplo oscuro el resto de los elementos. Desde cualquiera de esos otros elementos, la dirección de la luz, nos conduce al centro, lo que se supone que es el centro de atención (no sólo por estar en el centro, aunque así sea en el ejemplo). He usado un degradado con dos colores del tema de xposible,... y así ha salido...

En el segundo ejemplo, trasladamos ese centro de atención (de luz y de calor) a la esquina inferior izquierda.

El caso es que los ejemplos usados tienen truco, porque dejo de lado otros factores (color, tamaño, forma y proximidad) que obviamente cambian la relación entre todos los elementos que entran en juego.

De postre, Fundamentos de diseño: Economía de Recursos, de Ale Muñoz, que habla un poco de espacio, color y forma.

Imágenes actualizadas tras el comentario acertado de David

No hagas lo que te digo, haz lo que quiero.

Muy grande. Muy cierto.

Otra frase que dice un compañero, desarrollador también tiene miga:

Me gustaría ser al menos una vez cliente para pedir en vez de intentar adivinar lo que quieren.

Dos caras de la misma moneda. El origen es algo muy sencillo: falta de comunicación. En sus dos vertientes, desde el punto de vista de lo que se quiere hacer:

• El cliente no sabe o no quiere explicar lo que quiere.
• El diseñador-desarrollador-gerente (llámalo "X") no entiende o no sabe cómo saber lo que el cliente quiere.

Por otro lado, lo que se puede hacer que viene a ser lo mismo, pero cambiando los papeles.

Evidentemente no pueden faltar otros detalles como el tiempo, el presupuesto y las consideraciones técnicas. Pero no es de eso de lo que quería hablar.

Para terminar no puede faltar una referencia obligada a Aprende a preguntar de Ale Muñoz, por la parte que nos toca.

The philosophy and ethics of Japanese design concepts are revealed in key words that are laden with cultural meaning. Over the gerations, the Japanese created an extensive vocabulary of aesthetic terms that made it possible for them to describe the physical as well as the metaphysical attributes of their culture, and of their arts and crafts. Although often relatively simple in their original meanings, the terms were expanded to encompass the basic principles and elements of beatuty and design that evolved in the unique Japanese enviroment. The Japanese also created a variety of ritualized practices form enhancing their ability to recognize and appreciate beauty and good design.

Boyé Lafayette De Mente autor de Elements of japanese design.

Un libro con ciertas analogías a Universal principles of design. Tras una introducción (arriba puedes leer un extracto) expone de forma clara una serie de elementos en los que se fundamenta el diseño japonés. En total son alguno más de setenta, expuestos brevemente —dos o tres páginas—, de lectura fácil. Algunos de esos elementos son lo suficientemente genéricos como para aplicarse, porqué no, al diseño web. Y puede dar muchas y buenas ideas cuando buscamos la inspiración. Es un buen libro para leer y releer.

Para situarnos mejor en el cotexto, profundiza levemente en las raíces históricos del diseño japonés (influencia de China, Corea, budismo, sintoísmo,...) y las características geográficas del archipiélago japonés. Es una gran ayuda. Personalmente echo en falta ilustraciones, pero eso elevaría el precio del libro (ahora mismo en the book depository cuesta poco más de cinco euros y no cobran gastos de envío), y siempre podemos contar con internet para intentar buscar imágenes relacionadas.

He leído también el libro Leonard Koren (Wabi-Sabi for artist, designers, poets and philosophers) en principio bastante relacionado, y me ha parecido bastante más limitado. Cuestión de gustos.

Termino algunos elementos que se desarrollan: wa (armonía), heisei (mente en paz), kaizen (búsqueda de la perfección), kanso (conseguir más con menos), makoto (construyendo sinceridad en los productos), miekakure (la atracción oculta), medatsu (crear puntos de atención), kuwashii (belleza en los detalles),... y por supuesto wabi (belleza desolada), sabi (objetos "gastados") y  shibui (eliminación de lo no esencial).

95% of the information on the web is written language. It is only logical to say that a web designer should get good training in the main discipline of shaping written information, in other words: Typography.

Oliver Reichenstein - Web Design is 95% Typography

Echando un poco la vista atrás - basta un simple vínculo -, uno se encuentra con una frase como la anterior publicada en el 2006 (recordada, eso si, por twitter hoy mismo). Y yo soy uno de esos que no han intentado profundizar en algo tan importante, hasta hace no mucho tiempo. Y con la mala suerte de que el libro que me compré, no me ha servido para mis propósitos: un libro para introducirse en el arte y la ciencia de la tipografía (hablo de "¿Qué ocurre mientras lees? Tipografía y legibilidad." de Gerard Unger). Tal vez con el próximo libro tenga más suerte (¿sugerencias?).

Pero bueno, hay algunos recursos que me parecen útiles y aquí los dejo, para que no se me olviden.

• Thinking with Type, con cuatro apartados (letras, texto, rejilla y extras). Información relativamente breve y con posibilidad de descargar bastantes secciones en ficheros pdf para observar los detalles con mejor resolución.
• The Elements of Typographic Style Applied to the Web . El título lo dice todo, tipografía práctica para la web.
• typetester, una herramienta para comprobar a la vez tres fuentes diferentes, permitiéndose variar algunas características como el color, alineación, separación entre letras,...
• Periodic Table of Typefaces, es una forma bastante curiosa y desde mi punto de vista lograda, de mostrar las fuentes tipográficas más populares con información extra, como el año de creación, el autor y familia. En forma de tabla periódica.
• Typography Deconstruction Un fichaje de última hora a la lista de recursos, recomendado por un compañero de trabajo y que se encarga de analizar los elementos básicos en el diseño de fuentes de forma clara y muy visual. Me gusta mucho.

In graphic design, nothing is what it actually is. Everything other than content is representative of something else. Additionally, much of the content is also merely representative of something other than what it actually is.

Andy Rutledge : The Design Lesson: 1 of 1

¿A qué se refiere? ¿De qué habla exactamente? En el artículo original lo cuenta de forma más extensa, explicando las funciones que tienen en el diseño los elementos como las líneas, las cajas, el espacio en blanco, degradado, color,...

Demasiado tarde, y demasiado mal, me estoy dando cuenta, a mis años, de lo que es realmente el diseño y su importancia en la vida.