En busca de una vida programable
Todas las actividades que hacemos se pueden descomponer en una serie de pasos. Si repetimos dichos pasos, bajo condiciones similares a las originales, los resultados tenderán a ser los mismos de la original. Frecuentemente nos enfrentamos a listados de pasos para lograr objetivos (recetas, manuales, direcciones) que luego memorizamos y modificamos según nos convenga. Los lingüistas llaman a estas recetas algoritmos: una lista finita de instrucciones para lograr una tarea que, dado un estado inicial, terminará en una estado final determinado.
Los algoritmos fueron inicialmente definidos y utilizados por los matemáticos para lograr cálculos complejos (como encontrar aproximaciones a Pi, encontrar el máximo común denominador y encontrar raíces de números). Los algoritmos también son usados por programadores para desarrollar software como el que ahora les permite leer este artículo. Inspirados por esto y por As We May Think, un legendario artículo publicado en 1945 por Vannevar Bush (y el cual vale la pena leer), la gente de Squid-Labs creó Instructables:
We like to think about the physical world as something that is programmable. We like to think of objects or stuff you make as ‘code’. In other words, we are approaching the physical world as something that is describable and replicable. CAD files are obviously part of this. The CAD file I use to design and cut out my bicycle parts is the same file that you can use to cut similar bicycle parts. However this is not everything, CAD descriptions alone don’t fully describe heating schedules, or filing methods… the art involved in certain processes of making things. [...] We are trying to think about the ‘art’ or ’skills’ required to actually build things as defineable, sequential sub-routines that can be well illustrated with words and pictures. Cooking is an excellent example, processes like sauteeing, frying, filleting, and mashing are generic subroutines that have specific instances which require other detail for different meats. If you are writing a recipe, why not call upon the generic sauteeing subroutine and just add the unique details specific to your recipe. [texto completo]
En Instructables se pueden encontrar instrucciones para hacer cualquier cosa en diferentes categorías como arte, tecnología y comida. Si no encuentra lo que quiere construir puede contribuir sus propias instrucciones. Contribuciones notables incluyen instrucciones para hacer cerveza, para hacer un bananófono? y para crear graffitis electrónicos, o Electro-Grafs (las imágenes de este artículo son de este último). Los Electro-Grafs son una idea original de Evan Roth y Joshua Kinberg desarrollada durante sus estudios en el Parsons School of Design. El Graffiti Research Lab, un grupo de diseñadores/artistas/geeks que forma parte del Eyebeam OpenLab y que experimentan e investigan con diversas tecnologías, adoptó los Electro-Grafs:
The Graffiti Research Lab is dedicated to outfitting graffiti writers, artists and protesters with open source tools for urban communication. The goal of the G.R.L. is to technologically empower individuals to creatively alter and reclaim their surroundings from commercial and corporate culture.
Hay un video del proceso (algoritmo :) ) de elaboración de un Electro-Graf:
Gracias a Leonardo Parra por sus aclaraciones sobre los Electro-Grafs.
Complejidad y visualización
El clima, el tráfico terrestre y aéreo, las interacciones sociales, son todos ejemplos de sistemas complejos. La complejidad hace parte de nuestra cotidianidad y la mayoría de la veces no somos conscientes de ello. Un ejemplo reciente de visualización de información compleja (y el debate asociado que puede llegar a generarse por discrepancia de opiniones) es el documental ganador del Oscar An Inconvenient Truth. El documental busca encender una alarma a nivel mundial respecto al problema del calentamiento global. Al margen de la controversia como tal está la eficacia del uso de gráficos e imágenes al comunicar un mensaje. Sobre este tema hay un interesante artículo en Adobe.com:
Information visualization is able to communicate the intricacies of global warming in a way no other discipline can. Its messages can be immediate and powerful, without sacrificing the level of detail necessary to represent the complex subject accurately.
VisualComplexity.com es un sitio web que recopila y clasifica numerosos ejemplos de visualización de información compleja. Arte, biología, redes sociales y música son algunas de sus categorías:
VisualComplexity.com intends to be a unified resource space for anyone interested in the visualization of complex networks. The project’s main goal is to leverage a critical understanding of different visualization methods, across a series of disciplines, as diverse as Biology, Social Networks or the World Wide Web. [texto completo]
La retícula es tu amiga
La retícula tipográfica (bien) aplicada a la creación web permite ampliar las posibilidades de diseño a la vez que mantiene la estructura y jerarquía visuales de los elementos. Los primeros navegadores fueron desarrollados con un mínimo de funcionalidades tipográficas. En 1996 se introducen las hojas de estilo (CSS) que permiten un mayor control en términos de diseño aunque no fueron adoptadas por sitios web importantes sino hasta 2002. En vista que hoy día la gran mayoría de usuarios web tiene un navegador decente (entiéndase esto como Firefox, mi preferido, Opera, Safari o en su defecto Internet Explorer 6 o superior) que puede mostrar las hojas de estilo con cierta precisión, se ha dado un resurgimiento de los conceptos tipográficos elementales, esta vez aplicados al diseño web. Algunos ejemplos:
Mark Boulton tiene una guía para la generación de retículas que empieza explicando las retículas impresas y termina con estos conceptos aplicados a la web.
Khoi Vinh, director de diseño del New York Times Online, dió recientemente una charla en SXSW junto con Boulton donde detallan el proceso de diseño de un sitio web imaginario tomando como base el contenido de Yahoo!. Tiene un excelente post en su blog explicando el rediseño que incluye la presentación en PDF (vale la pena bajarla). Vinh también tiene otro post donde explica el diseño de su blog e incluye un tip para asegurarse que los elementos están quedando alineados mientras se diseña.
Richard Rutter tiene una guía principios de tipografía básicos aplicados a la web que vale la pena leer. Se recomienda también la bibliografía.
Finalmente, en A List Apart hay un artículo que explica una forma de usar una retícula vertical basada en el interlineado.
Actualización: Andrew Ingram ha creado un plug-in para Adobe Fireworks y Adobe Photoshop que permite crear retículas. GridMaker para Adobe Fireworks, GridMaker para Adobe Photoshop. Hay una versión 2, por ahora solo para Photoshop.
clic acá
El mouse es el dispositivo de interacción principal en los computadores actuales; el clic controla prácticamente todo: borrar, crear, copiar, pegar, ir a, abrir, cerrar, detener, empezar, en fin, saben a lo que me refiero. No obstante, el clic está dominado por el ojo (personas con limitaciones visuales agudas usan otros dispositivos de interacción con el computador): hacemos clic en lo que vemos. Diferentes formas nos motivan o previenen de hacer clic. John Battelle, uno de los fundadores de la revista Wired y de Federated Media (grupo dueño del reconocido blog BoingBoing) creó un sitio web para capturar los clics de visitantes, enfrentándolos con diferentes imágenes. La idea es sencilla: solamente haga clic donde quiera en el rectángulo. Son ocho rectángulos, algunos con textos o figuras. Hagan la prueba. Al final se encontrarán con los resultados de los clics de más de cuarenta mil personas. Patrones empiezan a emerger a pesar de ser totalmente libre el lugar donde podemos hacer clic.
La imagen arriba muestra el patrón de clics de este blog y otro sitio web. Estos patrones son una forma de visualización de clics que se conoce como heatmap (”mapa de calor” donde las zonas más “calientes” son aquellas que tienen muchos clics). Mirando las imágenes en grande pueden encontrar patrones de clic. Aunque la imagen de la izquierda presenta solamente 65 clics y la de la derecha muestra unos 480 clics se pueden observar claros patrones. Estas imágenes fueron capturadas de CrazyEgg, un servicio que permite a dueños de sitios web grabar los clics de sus visitantes por un tiempo determinado y visualizarlos. Con esta información se pueden tomar diferentes decisiones de diseño: dónde poner la publicidad, qué tipo de fotografías son más populares, cuales links son más llamativos, qué tan visible es la navegación del sitio, y realizar los cambios pertinentes para mejorar sus resultados. CrazyEgg está basado en un software libre de rastreo de clics.
Sus clics son valiosos: Google anunció hoy la compra de DoubleClick, una empresa que maneja publicidad web y las estadísticas asociadas (en términos muy básicos: poner un banner en un sitio web y determinar cuantas personas hicieron clic). Para Google, eso vale US$3.100 millones.
En la Universidad de Essen-Duisburg en Alemania está Alex Frank, cuyos estudios en Communication Design lo llevaron a crear el Institute for Interactive Research (no se preocupen por investigarlo, es imaginario) y un proyecto llamado Don’t Click It; en resumen: no haga click : ). El proyecto busca estudiar que sucede si eliminamos por completo el clic del proceso de interacción. Tiene unos ejercicios interesantes. Visítenlo.
Ze Frank, carátulas, juegos de video
Hosea Jan Frank, mejor conocido como Ze Frank, es un diseñador/humorista que se dio a conocer a nivel mundial en 2001 con una curiosa postal de cumpleaños que hizo en su tiempo libre. How to dance properly sería reenviada hasta la saciedad por quienes la vieron convirtiendo a Ze Frank en una celebridad de la noche a la mañana. Otros proyectos seguirían al inicial. El 17 de abril de 2006 Ze Frank da inicio a The Show, su video blog (vlog), un proyecto que actualizará durante los días hábiles y que culminó exactamente un año después. Ze Frank usó su vlog para expresar sus ideas socio-políticas, contar chistes y hasta para organizar el concurso a la página más fea de MySpace (vale la pena ver ese episodio). Los seguidores del show se tomaron el trabajo de crear un sitio web paralelo que contiene transcripciones de los programas, listado de los programas más populares, trivia y no sé cuantas cosas más (vaya grupo de fans).
Terminado The Show, Ze Frank da inicio a The ORG un sitio web que busca agrupar a las personas que han simpatizado con sus proyectos y que tiene herramientas de colaboración interesantes, como un visualizador geográfico de los registrados (al momento hay tres personas de Colombia en tres ciudades diferentes). The ORG hace uso de interfaces de programación disponibles en sitios como Flickr para integrar contenidos externos. Para ver el sitio web es necesario registrarse.
Esta es la carátula de Unknown Pleasures, álbum debut de Joy Division, banda originaria de Manchester, Reino Unido (una de mis favoritas… carátulas y bandas). Joy Division es considerada por muchos como una de las bandas más influyentes del rock y la carátula de Unkown Pleasures uno de los clásicos en el diseño (que de hecho se ha convertido en una camiseta muy vendida). Diseñada por Peter Saville (desconozco si está recibiendo regalías por la camiseta), está basada en la gráfica de cien pulsos consecutivos del pulsar CP 1919. No obstante, con el surgimiento de las descargas digitales, algunos se preocupan por la extinción de un arte que se considera parte integral de la imagen de una banda. Eliot Van Buskirk, de la revista Wired, escribe un artículo interesante sobre el futuro (si es que lo hay) de esta área del diseño que a muchos todavía nos genera nostalgia:
Because of all the players involved, the future of album art depends on which digital packaging formats emerge as standards for computers, portable devices and televisions. White thinks that when it comes to deploying new digital album packages, there’s no time like the present, and that an open standard will emerge on its own.
Leer artículo completo. Hablando de descargas digitales, Apple acaba de anunciar un acuerdo con EMI en el cual venderán música de mayor calidad (256 kbps) y sin protección anti-copia (la música que uno compra por iTunes no se puede copiar de un iPod/computador a otro, esto se conoce mejor como DRM). Esperemos esto sea el inicio del fin del absurdo control que las disqueras quieren tener sobre la música que uno compra. Todo esto está relacionado con una carta que recientemente publicó Steve Jobs (presidente de Apple) haciendo un llamado personal a las disqueras a poner fin a los DRM. Hay un artículo relacionado en Wired y al parecer este acuerdo todavía no implica el fin de las mismas restricciones en descargas de video.
Para los que hemos crecido con los juegos de video (desde el “telebolito” hasta el Nintendo Wii) no es de sorprenderse cuando vemos que hay personas que se toman el trabajo de personificar dichos juegos. El video anterior muestra los primeros minutos y combates de Mike Tyson’s Punch-Out!!, un juego de Nintendo de 1984. A continuación una obra que montaron unos japoneses (tenían que ser japoneses, ¿no?) en honor al juego:
Al parecer los suizos también tienen tiempo de sobra; este es un montaje dirigido por un suizo inspirado en el “telebolito”:
Del mismo grupo ahora un video basado en Space Invaders:
¡Hay más! Uno de Pole Position:
Los juegos de video han permeado la cultura. Hay un documental, del cual ya se había hecho mención antes acá, que explora la influencia de los juegos de video en la cultura contemporánea. Para terminar, el trailer:
Actualización: encontré otro artículo relacionado con el diseño de carátulas en Design Observer.
Visualización de información, diseño de interfaces, naturaleza y código
Visualizar información de manera clara y acertada es una tarea delicada: datos mal representados pueden costar vidas (como en el caso del transbordador espacial Challenger). Edward Tufte, profesor de estadística, diseño gráfico y economía en la universidad de Yale, es reconocido por su habilidad para crear gráficos informativos (infographics o infografía) y por sus constantes críticas al mal uso de herramientas de presentación (como Microsoft PowerPoint) por parte de presentadores y diseñadores. The Visual Display of Quantitative Information es uno de sus libros, el cual tuvo que publicar personalmente ya que no consiguió editorial que se ajustara a sus exigencias:
No publisher would print it to his exacting standards. Tufte wanted the book to exemplify the design principles he articulated. It had to have lavish, abundant, high-resolution images and footnotes alongside the text so a reader wouldn’t have to flip pages to find a reference. The book had to be printed on thick, creamy paper and sell for a reasonable price, about $30. “Publishers seemed appalled at the prospect that an author might govern design,” he later wrote. So he took out a second mortgage at nearly 18 percent interest and produced the book himself.
The Visual Display of Quantitative Information was instantly hailed as a classic.
La cita forma parte de un artículo de la Universidad de Stanford dedicado a Tufte.
Visual Explanations: Images and Quantities, Evidence and Narrative, Envisioning Information y The Cognitive Style of PowerPoint: Pitching Out Corrupts Within (su crítica personal a PowerPoint) son otros tres libros dedicados al mismo tema con aproximaciones y ejemplos diferentes. Uno de los ejemplos más interesantes que utiliza Tufte es el diagrama de la incursión y posterior retirada de Napoleón a Rusia elaborado por Charles Joseph Minard en 1869… se recomienda ver el diagrama.
El diseño de interfaces humano-computador es otro tema relevante: por medio del software, los usuarios (diseñadores, escritores, economistas) quieren hacer algo (dibujar un boceto, escribir un guión, realizar cálculos). Depende de la interfaz que se diseña el facilitar esa tarea. Joel Spolsky, quien formó parte del primer grupo de desarrolladores de Microsoft Excel® antes de trabajar por su cuenta, dice al respecto:
It has been said that design is the art of making choices. When you design a trash can for the corner, you have to make choices between conflicting requirements. It needs to be heavy so it won’t blow away. It needs to be light so the trash collector can dump it out. It needs to be large so it can hold a lot of trash. It needs to be small so it doesn’t get in peoples’ way on the sidewalk. When you are designing, and you try to abdicate your responsibility by forcing the user to decide something, you’re probably not doing your job.
Lo anterior forma parte de una serie de artículos que escribió y que vale la pena leer.
WIRED NextFest es una feria anual promovida por la revista WIRED que busca hacer reminiscencia de las grandes ferias mundiales de los siglos 19 y 20. Grass es una instalación interactiva desarrollada por The Barbarian Group que fue presentada en el NextFest 2006. En ella había una pantalla gigante generada por cuatro proyectores. La imagen proyectada se ve afectada por el movimiento de las personas cerca a la pantalla. Se recomienda ver el video. El movimiento del pasto se modela a partir de un proceso matemático llamado Ruido Perlin que también se utiliza en software 3D para generar texturas, humo y otros efectos que necesiten de una apariencia natural. Daniel Shiffman, profesor en el Interactive Telecommunications Program del Tisch School of the Arts de NYU, tiene una serie de cursos que abordan esa temática del modelado de la naturaleza a partir de la programación. Shiffman tiene unos ejemplos y explicaciones de Ruido Perlin desarrollados usando Processing.
A continuación un discurso de Steve Jobs (con subtítulos) en una ceremonia de grado de la Universidad de Stanford: