Una cosa por día

Para los que, en el tiempo libre que os deja la apasionante labor de leer mis posts, os dedicáis al diseño gráfico, una recomendación: suscribíos a Abduzeedo. Es una fuente constante de material, mucho del cual ya me dedico yo a enlazaros aquí, pero no está de más beber de las fuentes.
Hoy os dejo otro regalo que he encontrado allí. Si sois de los que opinan que el que mucho abarca poco aprieta, seguro que le encontráis sentido y gracia a esta imagen que os dejo.
Ah, y sigue nevando.

Don't make me think

Para cualquier otro libro sería un título horrendo pero en este libro sobre usabilidad no puede ser más descriptivo ni más acertado. Hace ya bastante tiempo que tengo en casa este "Don't make me think" de Steve Krug, probablemente la mejor guía sobre usabilidad que se puede encontrar para un diseñador web. Las habrá más completas o más "sesudas" pero esta permite aclarar los conceptos fundamentales sobre como los usuarios se adentran en las webs en una obra que se puede leer perfectamente en menos de tres horas (medido, la releí hace unas pocas semanas en una mañana). El mensaje fundamental está en el título, los usuarios no usan internet de forma pausada y reflexiva, escanean las páginas para buscar los pedazos de información que necesitan en escasos segundos y pasan a la siguiente. Si les haces pensar para encontrar las cosas estás haciendo algo mal.
En Designer Daily hacen hoy una pequeña reseña, no mucho más de lo que os he contado aquí, sobre un libro que se publicó hace tres años en su segunda edición. Creo que eso resume el impacto que ha tenido en el mundillo del diseño web. En resumen, imprescindible para todo el que aspire a diseñar webs con un poco de fundamento.

Uso de PNG en IE6 y una presentación

Durante mucho tiempo, la única forma de poner una imagen en una web con alguna parte transparente era recurrir a usar un GIF. Este formato de imagen tenía un severo defecto, sólo entendía un sí o un no, o un pixel se ve o no se ve pero no hay términos medios. Luego llegaron los PNG, que nos permiten introducir niveles de transparencia graduales en las imágenes y hoy día muchas de las páginas web que visitáis hacen uso de este formato de imagen que, por desgracia, tiene un enemigo declarado: cualquier Internet Explorer por debajo del 7.
Afortunadamente el IE5 está prácticamente desaparecido y el 6 va por el mismo camino pero aún nos queda algo de tiempo para poder llegar a despreocuparnos tranquilamente de los múltiples problemas del IE6 (el de las transparencias de los PNG es sólo uno de ellos). Mientras el ansiado momento llega hay varias técnicas que permiten a IE6 mostrar archivos PNG con transparencias correctamente. En Nettuts nos explican cinco de ellos aunque en realidad son cuatro más un "no me sale de las narices diseñar para Explorer 6". Yo he aplicado el DD_belatedPNG y doy fe de que funciona. Si no os lo creéis y tenéis IE6 podéis pasarlos por la que será la nueva casa de este blog (y de alguna otra cosa) cuando consiga terminarla: lamalamemoria.com
He empezado hoy, así que nada de meter prisa.

P.D.: Canté victoria demasiado pronto. El sistema funciona en el emulador de IE instalado en local pero cuando lo subo al servidor deja de funcionar. Habrá que seguir investigando...

P.D.(II): El script funciona a la perfección, el problema estaba en un sistema de protección de imágenes que tenía activado en el hosting. Ni os cuento las vueltas que he dado para encontrar el fallo, ha tenido que llegar la mañana de navidad para solucionarlo.

Agenda analógica 2009

PDAs, iPhones, miniportátiles... puede llegar a parecer que hoy todo el mundo está conectado en cualquier sitio y no estarlo puede llegar a parecer una "tragedia" si no tienes a mano la agenda analógica para 2009. No estarás conectado pero al menos te parecerá que podrías estarlo [Vía Abduzzedo].

Más enlaces sobre jQuery

Ya sé que parece la semana de jQuery pero juro que es casualidad que esté encontrando enlaces interesantes sobre este tema uno detrás de otro. Lo primero es recordar la serie de tutoriales en vídeo que están publicando en Theme Forest, además de los que mencionaba el otro día ya han colgado los de los días 10 y 11. Otro enlace interesante es este que os pongo de Nettuts en el que podéis encontrar una "hoja resumen" para esta librería de JavaScript.
Pero la página que ha provocado este post es en realidad tvi design en la que han colgado un post con 25 consejos para mejorear tu uso de jQuery. Unos son más obvios que otros pero todos son interesantes y muy útiles. Que aproveche.

Crítica de libros de diseño

Las webs de críticas suelen resultar bastante útiles. Sean de libros, discos, películas u hoteles, casi todos nos hemos dedicado a ir de una web a otra buscando comentarios sobre el objeto de nuestra próxima compra. El principal objetivo de una web de este tipo es construirse una cierta credibilidad. En algunos casos se consigue recurriendo a que las críticas las hagan los propios usuarios aunque en estas webs siempre te toca leer cantidades ingentes de críticas hasta que sacas una conclusión aproximada. Otras se apoyan en un pequeño grupo de autores (en algunos casos uno solo) con un cierto prestigio ganado por su carrera profesional en el medio en cuestión.
Tratándose de libros de diseño, la mayor parte hemos acudido a algunos blogs o, más directamente, a los comentarios de lectores en Amazon. Ahora encontramos, gracias a CR Blog, una página creada por Andy Polaine y dedicada en exclusiva a la crítica de libros de diseño. En una primera aproximación las críticas de "The Designer's Review of Books" parecen completas y fundamentadas. Incluso dedica parte de sus textos a comentar las características físicas del libros (tipo de impresión, calidad y detalles específicos de la producción) e incluye por sistema una buena cantidad de fotos de los libros de los que escribe. Un buen sitio al que acudir si andas un poco indeciso antes de comprar un libro.

Entrevista a Sol Sender (sí, Obama otra vez)

Sol Sender fue uno de los responsables de la creación del logo de la campaña de Obama y ahora tiene un trabajo nuevo en VSA Partners que, por aquello de aprovechar el tirón, han puesto un par de vídeos en su web entrevistándolo. Para los que estén interesados en el diseño de logotipos es bastante interesante, especialmente el primero de ellos, que es el que os dejo en el post. El otro lo podéis ver aquí o en la página de VSA Partners [vía Brand New].
Quizás lo más curioso sea ver las distintas versiones por las que pasó el logotipo, especialmente los otros dos "finalistas". Los primeros ensayos son los más tópicos y menos interesantes. Los intentos de reflejar o fundir el 08 con la Ob de Obama resultan un poco efectistas pero eso es algo que, por experiencia propia, suele aparecer mucho en las primeras ideas de cualquier diseño y suele quedar como definitivo si no hay el tiempo o los medios de refinar ideas.

De los otros dos finalistas, uno, el que enmascara imágenes dentro de la O, es mucho más elegante y quizás demasiado alejado de lo que es un logotipo político que tiene que alcanzar a todos los sectores sociales, pero también es más moderno e interesante. El de los bocadillos tiene un aire más popular, si el otro pecaba de moderno y elegante este lo hace de informal. Como bien dice el propio Sender, quizás este (y yo diría que ambos) estaban demasiado "out of the box". Vamos, que se salían demasiado de lo que es un logo para un político y corrían el riesgo de no comunicar de una forma lo suficientemente global.
En logodesignlove hay imágenes de las distintas versiones y algunos de los comentarios del vídeo puestos por escrito. Todo en inglés, por no perder la costumbre.
En homenaje a Xordi, aquí dejo enlaces a todos los posts sobre Obama de este blog. ¡Qué no son tantos!
Sí, otra vez Obama
Obama, un resumen
Otro poster por Obama
Posters por Obama

Campaña navideña de TOMS

TOMS es una organización que nace de una imagen, la de un montón de niños descalzos. Precisamente para borrar poco a poco esa imagen, TOMS se compromete a que, por cada par de zapatos que se les compra, un niño que lo necesite recibirá otro. Comenzaron actuando en Argentina y en los últimos años han expandido su actividad a zonas de África. Una causa loable pero no, no nos hemos convertido en un blog sobre causas nobles, es que el vídeo de su última campaña navideña es una gozada. Aquí os lo dejo [vía abduzeedo].

Ajustar contraste y saturación con "Luz suave"

El otro día enlazaba aquí un tutorial de Nettuts y hoy hago lo mismo con la web del mismo grupo dedicada a nuestro gran amigo Photoshop. En Psdtuts nos regalan un vídeo-tutorial sencillo pero que nos da una buena alternativa para ajustar el contraste -y en cierta medida la saturación- de una imagen usando una capa en "luz suave". Existen muchas formas de hacer esto, como casi siempre en Photoshop, desde el uso más tradicional de los ajustes de niveles o curvas o, para el contraste, el uso de capas en modo "multiplicar" pero este es un método sencillo y, visto lo visto, con unos resultados muy buenos. Obviamente, está en una lengua propia de las islas británicas.


Photoshop Soft Light Layer Tutorial de Yanik Chauvin en Vimeo.

De un PSD a XHTML

Pasar de un diseño en Photoshop a una web completa, con su XHTML, su CSS y su pizca de JS, puede llegar a ser un arte. En Nettuts nos muestran en tres vídeos (que suman casi una hora y tres cuartos) todo el proceso, paso a paso, para una web no muy complicada pero con la mayor parte de los elementos que nos encontramos en una web estándar. Es muy interesante aunque tiene momento dignos de un buen bostezo. Para los curiosos, está en inglés y se recomienda cierta familiaridad con XHTML y CSS para no perderse.

Texturas

Vamos a recuperar una costumbre que nunca llegó a ser tal, la de enlazar con páginas de recursos para diseño. En altered advice nos dejan enlaces para 30 páginas de texturas, todas ellas de DeviantART, una página imprescindible si lo que andamos buscando son recursos para diseño (ilustraciones, patrones, texturas, pinceles...).

Verano en Londres

¿Nunca habéis tomado la decisión de raparos el pelo en verano por aquello de que da calor?

[vía abduzeedo | I Believe in Advertising | We heart it]

"The Art & Science of CSS" gratis

En SitePoint tienen la buena costumbre de poner de vez en cuando alguno de sus libros en descarga gratuita. En mayo lo hicieron con un libro sobre técnicas de Phostoshop y hoy lo hacen con el libro "The Art & Sciencie of CSS". Sólo se va a poder descargar durante dos semanas así que lo enlazo antes de poder leerlo para saber qué tal es aunque parece, como en el caso anterior, que se trata de un libro con técnicas básicas, de esas que podemos encontrar explicadas en muchas webs, pero que siempre está bien tener reunidas en un libro para tenerlo de referencia. Obviamente, está en inglés.

Un Photoshop más cercano

Esta imagen lleva unos cuantos días circulando por ahí así que los que trabajéis con Photoshop habitualmente seguramente habréis tenido ocasión de verla en alguna otra página o la habréis recibido en algún correo. Dan ganas de ponerse manos a la obra aunque seguro que también se cuelga cuando tratas de aplicarle un filtro a un imagen de dos metros... [vía adgoodness].
Por cierto, aquí os dejo un enlace a Flickr con algunas imágenes del "cómo se hizo".

The Economist entra en el mercado de la pizza

El otro día enlazaba aquí a una campaña de BBDO para el semanario "The Economist". De la misma empresa y para la misma publicación pero con un público objetivo bastante diferente es esta campaña que suministró cartones para pizza a 20 establecimientos de la zona universitaria de Filadelfia con una publicidad de la revista impresa en ellos. Para redondear el guiño la publicidad consistía en gráficos de tarta (en este caso más bien de pizza) en los que se mostraban datos relacionados con este mercado como la producción mundial de trigo o las importaciones de queso por países [vía Speak Up].

Obama, un resumen

En vista de que todas las encuestas dan como ganador a Barack Obama en las elecciones del martes, en Noisy Decent Graphics han decidido hacer un pequeño recopilatorio de artículos relacionados con el diseño de la campaña del futurible presidente de los Estados Unidos.
Entre los muchos que mencionan hay dos que destacan especialmente. Uno es la entrevista a Michael Bierut que publicaron en Newsweek antes de la nominación de Obama por el partido demócrata. El otro es un análisis del logotipo y sus variantes que apareció en Speak Up.
De este último es especialmente interesante la mención a la multitud de variantes del logo que se realizaron para la campaña, la mayor parte de las cuales eran sutiles pero muy reconocibles adaptaciones del logo original. Se han variado algunas con respecto a lo que aparece en el artículo y han hecho algunas nuevas (y quizás no tan bien acabadas como la de las pequeñas empresas).
De la entrevista de Newsweek os dejo un análisis curioso sobre el origen del tono de la campaña:

"...the challenge for someone named Barack Hussein Obama is that he's such an unprecedented figure in American politics--so much so that everything he's trying to do is, in a way, trying to make him look smoother and more normal. Someone said, "Well, why shouldn't he have revolutionary looking graphics--graphics that make him look like grassroots, like an outsider? Things drawn by hand, things that look forceful and avant-garde." But I think he's using design in a way to make him look as normal, as comfortable, as inevitable as a brand can look in American life. Those are really deliberate, interesting choices."

Campaña de The Economist

Mis campañas preferidas suelen tener todas un buen concepto ejecutado de una forma sencilla pero llamativa que lo transmite a la perfección. Esta campaña de The Economist en Nueva York juega con la idea que a todos se nos ha pasado por la cabeza estos días de que es casi mejor no enterarse de lo que pasa y le da una vuelta divertida [vía adgoodness].

Rubitone

Algunos le encontramos gracia a cosas como estas. Lo mismo tendríamos que plantearnos un cambio de trabajo...

History Shots: la muerte y los impuestos

"En este mundo nada se puede dar por seguro, salvo la muerte y los impuestos." Muchos lo han dicho aunque esta versión del dicho es de Benjamin Franklin. Seguro que son muchos los días en que, estudiando vuestras nóminas (los que sigáis teniendo una que mirar a estas alturas) os preguntáis, ¿a dónde va todo ese dinero que pago entre IRPF, SS, tasas, IBI, IVA, impuesto de circulación, etc, etc, etc...?
Es una pregunta bastante compleja de contestar y no, no voy a daros una respuesta. Pero precisamente por la dimensión casi inabarcable de la cuestión, hubo quien pensó que era una buena idea tratar de representar el destino del dinero que se nos va en impuestos en una infografía colosal. Lógicamente no fue aquí, ¿a quién le iba a preocupar este tema en el país en el que el dinero público no es de nadie? Fue en History Shots, empresa dedicada a crear gráficos informativos que ayuden a poner en contextos asuntos, hechos y periodos históricos diversos, donde vio la luz esta idea, y los impuestos son los de los norteamericanos (con permiso de los canadienses). Tienen otras muchas infografías tan buena como esta que os traigo así que una vueltecita por su web merece mucho la pena [vía Creattica Daily].

El plano del Metro de Londres

Prácticamente todas las ciudades que tienen red de Metro hacen de esta uno de sus iconos. En unos casos, como el de la red bilbaína, por el diseño de sus accesos; en otros, como el de Lisboa, por el individualizado diseño interior de sus estaciones. En el caso del Metro londinense, uno de sus señas de identidad más destacadas es su plano, que se ha convertido en un símbolo del diseño de principios del siglo XX.
Fue un diseño muy novedoso en su época y su influencia se puede ver en casi todos los diagramas de sistemas de transporte del mundo. Entre sus hallazgos, el saltarse las convenciones geográficas y de escala para representar las estaciones en forma de diagrama, con líneas verticales, horizontales y en ángulos de 45º. Su autor, Henry C. Beck, decidió ampliar la almendra central, en la que la cantidad de estaciones y sus interconexiones convertían la zona en una maraña de líneas indescifrables, y obvió las distancias reales entre las estaciones para obtener proporciones más claras visualmente. El resultado final fue un plano de legibilidad casi inmejorable y que no sólo ha sobrevivido al tiempo, las ampliaciones de la red y los intentos de cambiarlo, sino que se ha convertido en uno más de los símbolos más conocidos de la ciudad.
A través de creattica daily he llegado hasta este documental de la BBC sobre el diseño y la historia de este histórico plano (sin subtítulos pero en inglés "made in BBC", el que esté interesado, merece la pena el esfuerzo de seguirlo).
Para los que vivimos en Madrid es interesante comprobar como el pasar de una representación casi geográfica (aunque falseada en las escalas) a otra más del estilo del "Tube" londinense, no siempre da buenos resultados. Será por la familiaridad de los madrileños con su viejo plano de metro (que aún está presente en las estaciones, los trenes e incluso la web de Metro) o porque renunciar a cualquier tipo de línea que no sea horizontal o vertical, especialmente en un plano tan complejo (línea circular incluida), es llevar las cosas un poco demasiado lejos y obliga a demasiados compromisos y deformaciones, pero el nuevo plano del Metro de Madrid no acaba de cuajar entre los usuarios. El tiempo dirá.