mga/blog

ISSN 2011-0146

The Thought Factory

publicado en arte,diseño,interacción,programación,video,visualización,web por mga en March 28, 2010

I was invited by my colleagues Hernando Barragán and Annelie Franke to collaborate with the Thought Factory, a project that started in their Design Studio 6 course for the second semester 2009. The project was commisioned by the XII Iberoamerican Theatre Festival in Bogotá, one of the most important festivals of its type in the world. The idea was to create a collaborative work that would allow people to interact with the festival.

With this in mind, the Thought Factory was created and its main purpose was to save and classify the thoughts of festival visitors. Thoughts are abstract and intangible notions (we can’t read minds… yet). The Factory was made to make those thoughts somewhat tangible, “saving” them in bottles that can later be opened and their contents made visible as the genius in the lamp.

Each bottle represents an inquiry made by festival organizers. Every hour and a half a new bottle is placed in the filling station:

A bottle being filled

From that moment, and during the next ninety minutes, that bottle will be filled with thoughts from people who type them in the input stations:

Thought input machine

Thoughts can also be sent as an SMS message via mobile phone.

Since the Festival as for all ages it was necessary to curate these thoughts (basically removing obscene ones… let’s be honest, there’s plenty of obscenities in our thoughts :P).

Curating machine

Once approved, the message enters the bottle in the filling station:

When removed from the filling station, the bottle is labelled and placed with the rest of the full bottles so its thoughts can be read in the viewing station.

At the end of the Festival (in april 4, 2010) there will be sixty bottles full of thoughts that can be read in the project website.

My main tasks were developing the visual interfaces (thought input, thought curating, filling station, bottle visualization), the database that manages thoughts and inquiries and all communication happening between these and the bottles. SMS message service was kindly provided by Contacto SMS.

If you are curious about the tech side of the project: interfaces are made with Adobe Flash which communicate with a MySQL database via PHP and AMFPHP. Filling and viewing stations communicate with the bottles via Wiring using sockets and an RFID tag. ActionScript programming was made in FDT.

La Fábrica de Pensamientos

publicado en arte,diseño,interacción,programación,video,visualización,web por mga en March 28, 2010

Fui invitado por mis colegas Hernando Barragán y Annelie Franke a participar en la Fábrica de Pensamientos, un proyecto que se deprendió de su curso Estudio 6 del segundo semestre de 2009. El proyecto fue comisionado por el XII Festival Iberoamericano de Teatro de Bogotá, uno de los festivales de este tipo más importantes del mundo. La idea era hacer una obra colaborativa que permitiera a la gente interactuar con el festival.

A partir de esa premisa, se realizó la Fábrica de Pensamientos cuya idea principal es guardar y clasificar los pensamientos de los visitantes al festival. Los pensamientos son nociones abstractas e intangibles (aún no podemos leer la mente). Con la Fábrica se busca hacer esos pensamientos tangibles de alguna forma, “guardándolos” en botellas que luego pueden ser abiertas y su contenido se hace visible como el genio de la lámpara.

Cada botella representa una inquietud planteada por el festival. Cada hora y media se pone una nueva botella en la base de llenado:

Una botella en proceso de ser llenada

A partir de ese momento, y durante los siguientes noventa minutos, se llenará esa botella con los pensamientos que la gente escribe en las máquinas de entrada:

Máquina de entrada de pensamiento

Pensamientos también pueden entrar en la botella vía mensaje de texto de teléfono celular.

Dado que el Festival es un evento para toda la familia es necesario hacer una curaduría de los pensamientos (básicamente prevenir el ingreso de obscenidades… seamos honestos, hay mucho pensamiento obsceno sucediendo en nuestras cabezas :P ).

Máquina de curaduría

Una vez aprobado, el mensaje entra a la botella que se encuentra en la base de llenado:

Cuando se retira la botella de la base, se etiqueta y se guarda para luego ser consultada por los visitantes en cualquier momento en la estación de visualización.

Al finalizar el Festival en abril 4 de 2010 habrá sesenta botellas llenas de pensamientos que podrán ser visualizadas en el sitio web del proyecto.

Mi labor principal fue desarrollar la parte visual (interfaz de entrada de pensamientos, interfaz de moderación, interfaz de llenado, interfaz de visualización, sitio web), la base de datos que soporta el sistema de pensamientos e inquietudes y toda la comunicación que sucede entre estas y las botellas. El sistema de mensajes de texto fue amablemente provisto por Contacto SMS.

Si tiene curiosidad de saber qué tecnologías están involucradas: las interfases están hechas en Adobe Flash y se comunican con la base de datos MySQL usando PHP y AMFPHP. Las interfases de llenado y visualización de botellas se comunican vía sockets con Wiring usando un tag RFID.

pop goes the weasel

publicado en ciencia,general,programación,visualización por mga en October 20, 2009

Inventando el agua que moja

Para hacer funcionar el código, cree un nuevo documento de Flash ActionScript 3 y meta tres textfields con nombre de instancia status_txt, link_txt, y weasel_txt. Puede cambiar el texto objetivo (variable target) por cualquier otro que tenga letras de la A a la Z (mayúsculas), espacio, punto y signo de exclamación. Si quiere más letras tiene que modificar la funcion randomLetter().

El máximo número de generaciones que me ha generado para este texto es de 1452.

El código (AS3):

var target:String = "O TRUE APOTHECARY! THY DRUGS ARE QUICK. THUS WITH A KISS I DIE.";
var current:String = "";
var numSiblings:Number = 100;
var variation:Number = 5;
var stepsNeeded:Number = 0;
var generation:Array = [];
var timer:Timer = new Timer(10);
 
function newGeneration():Array {
	var i:Number;
	var thisGeneration:Array = [];
	for (i=0;i < numSiblings;++i) {
		thisGeneration.push(createSibling(current));
	}
	return thisGeneration;
}
 
function newParent():String {
	var i:Number, r:String = "";
	for (i=0;i < target.length;++i) {
		r += randomLetter();
	}
	return r;
}
 
function createSibling(dad:String):String {
	var i:Number;
	var sibling:String = "";
	for (i=0;i < dad.length;++i) {
		if (Math.random()*100<variation) {
			sibling += randomLetter();
		} else {
			sibling += dad.charAt(i);
		}
	}
	return sibling;
}
 
function randomLetter():String {
	var r:String;
	var n:Number = Math.floor(Math.random()*28)+62;
	if (n==62) {
		r = " ";
	} else if (n==63) {
		r = ".";
	} else if (n==64) {
		r = "!";
	} else {
		r = String.fromCharCode(n);
	}
	return r;
}
 
function qualifyGeneration():Number {
	var i:Number, j:Number;
	var qualification:Array = [];
	var tempQ:Number = 0;
	for (i=0;i < generation.length;++i) {
		tempQ = 0;
		for (j=0;j<generation[i].length;++j) {
			if (generation[i].charAt(j)==target.charAt(j)) {
				tempQ += 1;
			}
		}
		qualification.push(tempQ);
	}
	var maxQIndex = 0;
	var maxQ = 0;
	for (i=0;i < qualification.length;++i) {
		if (qualification[i]>maxQ) {
			maxQ = qualification[i];
			maxQIndex = i;
		}
	}
	return maxQIndex;
}
 
function parseGeneration(event:TimerEvent) {
	status_txt.htmlText = "GENERACIONES: " + stepsNeeded;
	generation = newGeneration();
	current = generation[qualifyGeneration()];
	weasel_txt.text = current;
	if (current == target) {
		timer.stop();
		status_txt.htmlText = "COMPLETADO LUEGO DE " + stepsNeeded + " GENERACIONES";
		link_txt.htmlText = "<a href=\"event:restart\">OTRA VEZ</a>";
	} else {
		stepsNeeded++;
	}
}
 
function doClick (e:TextEvent) {
	if (e.text=="stop") {
		link_txt.htmlText = "<a href=\"event:continue\">CONTINUAR</a>";
		timer.stop();
	} else if (e.text=="continue") {
		link_txt.htmlText = "<a href=\"event:stop\">DETENER</a>";
		timer.start();
	} else if (e.text=="restart") {
		init();
	}
}
 
function init () {
	stepsNeeded = 0;
	current = newParent();
	timer.start();
 
	var style:StyleSheet = new StyleSheet();
	var link:Object = new Object();
	link.textDecoration = "underline";
	style.setStyle("a:hover", link);
	link_txt.styleSheet = style;
	link_txt.htmlText = "<a href=\"event:stop\">DETENER</a>";
}
 
link_txt.addEventListener(TextEvent.LINK, doClick);
timer.addEventListener("timer",parseGeneration);
 
init();

Múltiples views no-jerárquicas en iPhone

publicado en iphone,programación,tips por mga en October 9, 2009

(English version at the bottom of this post)

Recientemente he estado trabajando en XCode y Cocoa Touch para un proyecto que estoy haciendo para el iPhone. Objective-C (el lenguaje de programación usado) tiene sus mañas (como todo lenguaje), pero he encontrado bastante ayuda en la web, gracias especialmente a Stanford, Google y a Stackoverflow.

Creo que es pertinente devolver algo a la comunidad, en particular a los hispanoparlantes, en este caso en forma de un mini framework para desarrollo de aplicaciones con múltiples pantallas no-jerárquicas ni lineales (simplemente que uno pueda saltar de una pantalla a otra sin ningún orden en particular, cuando el UITabBarController no es una opción). En realidad es basado en este otro de Jeffrey Berthiaume, pero con la adición de NIBs (Berthiaume hace las pantallas a punta de código).

Algo importante a tener en cuenta al usar NIBs es que para que el iPhone efectivamente libere la memoria usada por NIBs con imágenes, lo mejor es cargarlas con código (pero ese es otro post). De pronto luego pongo un tip acá pero por ahora mejor visite mi pregunta al respecto de esto en Stackoverflow.

Si lo que acabo de escribir suena un poco a chino avanzado (para aquellos no familiarizados con Obj-C), en parte es porque lo es (para mi Obj-C ha sido como un camino zen… el camino del ninja o algo así). Inauguro, entonces, el tag “iphone” en mi blog con este ZIP que pueden bajar y usar libremente (y si se le tira el proyecto que está haciendo no me eche la culpa):

Descargar InfiniteViews

Para que los angloparlantes puedan llegar a este post, a continuación la versión en inglés:

English version

This is a a framework based on the work of Jeffrey Berthiaume for developing NIB-based iPhone applications with non-linear, non-hierarchichal UIViewControllers, when the UITabBarController is not an option (games with multiple NIBs come to mind). Keep in mind that, in order for Obj-C to free NIBs with UIImageViews from memory, you need to load the images via code without using imageNamed. More info regarding this can be seen in this question in Stackoverflow:

Download InfiniteViews

El chef recomienda: Johnny Lee y el Wii

Varios meses sin publicar acá (un poco distraído en general) pero regreso con unos buenos links. Sin más rodeos:

Johnny Wii

Johnny Lee es un estudiante de doctorado del Human-Computer Interaction Institute de la Carnegie Mellon University. Lee posee varias patentes y trabaja desarrollando versiones simples y económicas de tecnologías usualmente costosas. Como él mismo menciona en su enunciado de investigación:

My work solves real world problems of applying research concepts by simplifying implementation and reducing system cost. This does two things: first, it enables more researchers to explore the domain advancing the state of research; second, it results in a more practical commercialization increasing distribution, adoption, and overall impact.

Entre los proyectos de Lee se destaca el trabajo que hace con el Nintendo Wii. Usando la tecnología presente en el control del Wii, Lee ha creado desde interfases similares a las que se vieron en la película Minority Report, hasta ambientes inmersivos tridimensionales. Lee documenta sus proyectos Wii en su sitio web. El software requerido para uno implementar esas interfases, si es que tiene un Wii, yo tengo el mío :), está disponible para descarga. Sin embargo lo que más descresta es la simplicidad como explica y presenta los proyectos, como se puede ver en el siguiente video:


vía Gizmodo

Hay otro video de la interfaz tipo Minority Report, un video de un pizarrón electrónico y un impresionante video de pantallas plegables, todos muy recomendados.

Recomendaciones del chef

Nos gustan las recomendaciones. A pesar de tener una amplia selección en un menú, algunos restaurantes tienen “menú del día” o “el chef recomienda”. ¿Por qué destacan un producto sobre otro? ¿Acaso no todos los platos son igual de buenos? Barry Schwartz, psicólogo y profesor en Swarthmore College plantea en su libro The Paradox of Choice: Why More Is Less que la multiplicidad de opciones no necesariamente nos beneficia:

Infinite choice is paralyzing, Schwartz argues, and exhausting to the human psyche. It leads us to set unreasonably high expectations, question our choices before we even make them and blame our failures entirely on ourselves.

En su charla en TED Talks Schwarz menciona ejemplos que aclaran su idea que muchas opciones en realidad perjudican nuestro bienestar generándonos un estrés innecesario. En un restaurante contamos con un mesero que, esperamos, nos va a dar una buena recomendación basada en la información que proveamos: “no puedo comer pescado y no me gustan los pepinillos”. En internet, sitios web como Amazon se basan en millones de clics que hacen los compradores para encontrar patrones que sivan como punto de partida para recomendaciones: de los que compraron la última película de Harry Potter una gran cantidad compró Piratas del Caribe. Entre más compras se hagan (y más compras haga usted) más precisa es la recomendación… o por lo menos eso creemos; si compra un regalo para alguien con gustos muy diferentes a usted estará “dañando” futuras recomendaciones.

Last.fm

¿Qué me recomienda?

¿Cómo generar un sistema de recomendación más preciso? Entre más acertada sea la recomendación, más valioso será el sistema. Precisamente fue esta la razón por la que Google prevaleció sobre Altavista, AskJeeves y otros buscadores que estuvieron primero: daba mejores resultados a las búsquedas (hoy día algunos pueden debatir eso pero ya Google está en una posición ultra dominante que ha sabido explotar). En el mundo musical la cosa es más complicada: ¿si me gusta “Let It Be” me van a gustar todas las canciones de los Beatles? ¿solamente las escritas por Paul McCartney? ¿sólo las baladas? ¿sólo las que son dedicadas a alguien cercano al autor? ¿las que tienen determinado patrón compositivo? Todos quisiéramos tener una emisora personalizada que pusiera los hits que más nos gustan pero que también nos sugiera nueva música: que no suene un reguetón después de “Hey” de Pixies… de hecho que no suene nunca un reguetón. Hasta el momento la mayoría de sistemas de recomendación, como los de Amazon y Google, se basan en modelos matemáticos. Este artículo cubre (superficialmente) tres aproximaciones a este problema que se reflejan en tres sitios web: MeeMix, Pandora y Last.fm. Para los últimos dos sitios hay mayor detalle en este otro artículo:

Algorithmically, Pandora versus Last.fm is something like the nature versus nurture debate. Taking the nature side, Pandora’s recommendations are based on the inherent qualities of the music. Give Pandora an artist or song, and it will find similar music in terms of melody, harmony, lyrics, orchestration, vocal character and so on. Pandora likes to call these musical attributes “genes” and its database of songs, classified against hundreds of such attributes, the “Music Genome Project.”

On the nurture side (as in, it’s all about the people around you), Last.fm is a social recommender. It knows little about songs’ inherent qualities. It just assumes that if you and a group of other people enjoy many of the same artists, you will probably enjoy other artists popular with that group.

Otros están experimentando con la aplicación de algoritmos matemáticos ya no a la recomendación sino a la creación. Dichos algoritmos se inspiran en la evolución biológica (reproducción, mutación, recombinación y selección):

EAs take two parent designs – for a boat hull, say – and blend components of each, perhaps taking the surface area of one and the curvature of another, to produce multiple hull offspring that combine the features of the parents in different ways. Then the algorithm selects those offspring it considers are worth re-breeding – in this case those with the right combination of parameters to make a better hull. The EA then repeats the process. Although many offspring will be discarded, after thousands of generations or more, useful features accumulate in the same design, and get combined in ways that likely would not have occurred to a human designer.

[...]

To encourage more of this kind of work, SIGEVO runs the annual Human Competitiveness Awards, dubbed the “Humies”. The idea is to reward designs produced by EAs that are “competitive with the work of creative and inventive humans”.

[...]

Celebrated UK innovator James Dyson, inventor of the bagless vacuum cleaner, has a more emotional objection. “Evolutionary algorithms will mean the end of those exciting stories about how people made great inventions by accident,” he says. “Human ingenuity and intuition should remain crucial in making a success of any product.”

El chef recomienda estos otros posts anteriores relacionados:

Actualización 2/6/2009:

Desde su salto a la fama, Johnny Lee ha hablado en las TED Talks y consiguió trabajo en Microsoft donde está trabajando en Natal, un proyecto que pueden ver mejor en su blog y en este video:

YouTube Preview Image

Pueden ver una demostración de las diferentes tecnologías disponibles en Natal en la rueda de prensa de Microsoft en E3 (fijarse en la parte final del video).

siguiente página »