Fundamentos de diseño: Expresa claramente tu intención

Cuando estés diseñando algo, expresa claramente tu intención.

Cuando tu intención sea alinear elementos, usa guías y retículas. Ajusta al milímetro, al pixel.

Cuando no alinees, separa tus elementos lo suficiente como para dejar clara tu intención.

fd_alineacion

Un corolario de este fundamento es el siguiente:

Si un elemento de tu diseño no tiene intención, plantéate si lo necesitas

Y tú: ¿qué fundamentos de diseño quieres compartir? Añádelo a los comentarios (o publícalo en tu blog :)

Typotheque

Desde que descubrí el trabajo de Typotheque hace años soy fan total de todo lo que hacen.

Sus diseños aúnan cualidades técnicas, artísticas y funcionales en una combinación que merece al 100% el título de “Tipografía” (más allá del “diseño de fuentes”)

Algo que siempre me ha llamado la atención del material que generan Peter y Johanna Biľak es su extremada atención al detalle. Si has tenido la suerte de recibir alguna de sus piezas promocionales en papel verás que el continente está tan bien pensado como el contenido.

Recuerdo espcialmente el poster de Jigsaw (disponible en su tienda online), que enviaron para la presentación de la susodicha tipografía.

Sus “Typotheque Specimens” son una maravilla de producción gráfica, impresos magníficamente, y probablemente ni siquiera merezcan el calificativo de “material promocional”.

Ayer recibimos en la oficina un pedido que hicimos a su tienda online:

Typotheque Bling Bling

En la imagen, “Detail in typography”, “The Elements of Typographic Style”, Multicolor sketchbook, Pocket calendar / sketchbook 2009 y de fondo Typotheque Monthly Planner.

A “Detail in typography” tendría que dedicarle un post entero. Es, por resumirlo de alguna manera, una auténtica joya de la literatura tipográfica. Diseñado por su autor, tiene una de las encuadernaciones más bonitas que he tenido la suerte de ver. El contenido está a la altura del diseño, y en ocasiones llega a emocionar tanta pasión y atención por el detalle más puñetero (el capítulo que habla del kerning es particularmente brillante).

El “Elements…” no lo he empezado aún, pero sólo diré que tiene una parte que habla de “retículas tipográficas y su relación con las escalas musicales”.

Del material de escritorio diré que, en su conjunto, te hace desear que todo el mundo se tomara su trabajo como Typotheque se toma el diseño y producción de sus cositas.

Hasta la factura en papel es una pieza de museo…

Los gastos de envío de la tienda no son baratos, y los productos que venden tienen un precio que sólo te parecerá razonable si ya has tenido algo suyo en las manos. Pero si puedes, pídeles algo aunque sólo sea por tener en tus manos un pedacito de historia del diseño de este siglo.

Lectura recomendada: Change Order

Si no tienes problemas con el inglés, y te interesa el mundo del diseño desde el punto de vista del proceso (“metadiseño”, si quieres) añade inmediatamente este blog a tu lector de feeds: http://changeorder.typepad.com/weblog/

Si sólo tienes tiempo para leer dos posts, estos son francamente interesantes:

Querido empresario…

…si te preocupa la imagen de tu empresa, cuelga en alguna parte de su web la imagen corporativa en formato vectorial.

Los diseñadores del mundo te lo agradeceremos, y no tendremos que usar esos amasijos de pixels que algunos se empeñan en llamar “logos” para “ponerlos destacados en la web”.

Gracias.

Atajos de teclado en Fireworks

Ya he comentado en alguna ocasión que en la Gran Corporación somos fans de Fireworks. Tengo pendiente un post más detallado explicando por qué, pero de momento aquí va un pequeño adelanto : )

Independientemente del software que utilices, ya sabrás que los atajos de teclado son el mejor aliado de la productividad y la vagancia.

Lo que a lo mejor no sabes es que los atajos de teclado de Fireworks, además de ser personalizables de una forma bastante sencilla, pueden asignarse a tus propios comandos.

Para personalizar los atajos de teclado, abre el menú Fireworks » Keyboard Shortcuts…

Panel de asignación de atajos de teclado de Fireworks

Puedes seleccionar varios grupos de atajos por defecto (Illustrator, Freehand, Photoshop…) para que no tengas que reaprender lo que ya sabes, y puedes guardar tu propio set personalizado (ideal para transportarlo de un equipo a otro si usas varios ordenadores)

Si te fijas en el panel verás que aparece el menú “Commands”, que es donde se encuentran cosas como Reticulator y otros comandos personalizados:

Panel de atajos con teclas personalizadas

Si seleccionas un item de menú podrás asignarle la combinación de teclas que más rabia te de, y lo mejor es que el atajo funcionará siempre (ahora veremos por qué esto es importante)

Un ejemplo práctico (al menos para mi : )

Una cosa que siempre me ha molestado de Fireworks (y de Illustrator, y de Freehand, y de…) es que no es fácil cambiar el color de una selección sin hacer malabarismos con el ratón. Tienes que moverlo a donde tengas la paleta de colores, seleccionar el color, y luego volver a donde estabas. Si además tienes las paletas ocultas la operación es un coñazo. Y en el caso de Fireworks, si tienes un texto seleccionado el 90% de las veces te lo acabarás cargando al darle a TAB para mostrar las paletas.

Solución: un comando de Fireworks, claro : )

Guarda el fichero Show Color Picker.jsf en tu carpeta de comandos (en Mac es ~/Library/Application Support/Adobe/Fireworks CS3/Commands/) y asígnale un atajo de teclado (yo he usado Ctrl + Shift + C). A partir de ahora, cuando quieras cambiar el color de cualquier cosa sólo tienes que pulsar el atajo de teclas, y un bello selector de color aparecerá en la posición donde tengas el ratón:

Show Color Picker en acción

Aún tengo que arreglar un par de bugs, a saber:

  • si el objeto seleccionado no tiene relleno, inexplicablemente no funciona con el color #FFFFFF (con todos los demás si). Esto parece un bug de Fireworks, pero tengo que confirmarlo. Bug corregido! Es un fallo de Fireworks, pero he encontrado un bonito “workaround” :P
  • si usas el comando con una selección de texto se colorea toda la caja de texto y no sólo la selección. Más que un bug es un “así funciona Fireworks”, pero ya tengo más o menos claro cómo resolverlo, sólo es cuestión de tiempo.

Espero que os sea útil!