Muy recomendado. Si usted tiene un blog de WordPress lo puede instalar desde la interfaz de administración con un solo clic. El sitio sigue viéndose igual para navegadores que llegan desde un computador cualquiera. Espero luego poder personalizar un poco el diseño. Por ahora lo que se ve es lo que viene apenas uno da clic en “instalar”.

Más información acá.

ahora en su iPhone/Android/Palm : ) originalmente escrito en mga/blog en May 5, 2010.

Desde que vió la luz pública (hace tres días), la línea de tiempo de videojuegos ha tenido buena recepción. Definitivamente los videojuegos nos tocan de forma especial. Varias personas y sitios web han linkeado al proyecto, lo cual me halaga. Bienvenidos los links. Espero el servidor aguante, perdonará si el sitio está un poco lento (por cierto, no es culpa de Flash ya que el SWF completo pesa 70KB solamente). Seguiré trabajando en el proyecto, incluyéndole nuevas cosas.

Since it became available to the public (three days ago), the videogame history timeline has had good reception. Videogames definitely affect us. Several people and websites have linked to the project, for which I am flattered. Links are welcome. I hope the server can handle the load, please excuse if it is a little slow (not Flash’s fault btw… the whole SWF is just 70KB). I will continue working on the project, adding new functionality and content.

• CreativeApplications.net (inglés)
• Blog de Nick Montfort (inglés) y quien está en la línea de tiempo
• The Daily What (inglés)
• Spreeblick (alemán)
• Diskursdisko (alemán)
• The L Magazine (inglés)
• Creative Tools (sueco)
• Yay! Everyday (inglés)
• Rubbishcorp (inglés)
• Misterhonk.de (alemán)
• Un mundo libre (español)
• The Museum of Modern Betas (inglés)
• Grand Text Auto (agregador/inglés)
• Cologne Gamelab (alemán)
• Toronto Thumbs (inglés)
• Cleverpeeps.com (inglés)
• Upcoming Current (agregador/inglés)
• Tweetmeme (agregador/inglés)
• Virtual Illusion (portugués)
• Yorokobu (español)
• The Rant (inglés)
• RGB Filter (inglés)
• WebMania (portugués)
• Invaders.com (inglés)
• Winkler.fm (alemán)
• MTV GameOne (alemán)
• Finefin (alemán)
• Gründerszene (alemán)

línea de tiempo en la blogosfera :) originalmente escrito en mga/blog en February 3, 2010.

Tiempo no desperdiciado originalmente escrito en mga/blog en January 31, 2010.

For a long time I have wanted to do a videogame history timeline. It would combine several of my interests: information visualization, history, time and, of course, videogames. Currently I have a class on videogame history (class blog in spanish) as a lecturer in the Design Department at the Universidad de los Andes and such a timeline would be useful (and neat).

I had the opportunity of creating a history timeline for a client and decided to use that code as the starting point for my timeline. This is why I can now present (drumroll):

The videogame history timeline

The URL is: http://www.mauriciogiraldo.com/vgline/beta/

clic para ver imagen completa

The timeline showcases eight types of events:

1. people (birthdates) of relevance: game designers and developers, scientists, artists, entrepreneurs.
2. business: companies or important business events.
3. consoles (or hardware such as PCs) where videogames are executed.
4. games
5. accessories and controls: peripherals that are connected to consoles.
6. technologies of importance.
7. cultural: events that have somehow influenced the world of videogames (books, movies, ideas or theories, etc.).
8. other events that contextualize what was happening worldwide when the other types of events happened.

Every event can be related to other events in three ways:

• creation (event A created event B): mostly used to relate a person with the games he/she created
• inspiration (event A was inspired or is “plainly” related to event B)
• series (event A precedes event B): for “sequences” of events (eg.: the “Mario” series by Nintendo are assumed to be sequential editions even though they were developed for different consoles)

Presenting this information clearly to the user is rather complicated. Not to say that I am finished with the interface. It still needs work and I want to explore more possibilities.

You need to press SPACEBAR in order to see the relationships between events:

relations between events

Given that you see a lot of relations between events in the default display mode (and even more events are missing from the timeline) I decided to allow the user to turn on/off event types and relation types. This way, if I turn off all events except people and games, I can see the screen with less “noise”:

people and games

It’s difficult (maybe even impossible) to plot all events and relations while completely avoiding superposed lines (or maybe I need to investigate a little more). However, I believe that the current solution is easy to understand once you have played with it for a few minutes (I didn’t set out to create a conventional interface; I wanted to experiment a little).

This is what I see if I turn on series and games:

game series

You can see that Doom II goes after Doom and that there is another later game in the series. Riven goes after Myst, etc.

Search

Users are lazy (okay, all but you) and if they don’t find what they are looking for in a few seconds they will go somewhere else. Also, in large sets of information (even though the timeline currently has only a few hundred events) it is difficult to predict how a user expects to find some particular data point. This is why the timeline has a search box:

search results for "nintendo"

Viva la open source!

In my web developing years I have benefitted from a large amount of open source libraries/programs/content and, every time I can, I try to give something back. In this case I have created a Google Code project so, whoever knows ActionScript 3 and Flash, can take a look and see what benefits he/she can find there (I don’t plan on supporting this code, use under your own risk).

Things to do

The timeline is far from finished. Among the things I want to do:

• content in spanish: I am using this timeline in my Videogame history class and I want the content to be fully translated
• complete content: a lot of information is missing or incomplete
• experiment: this basic information setup can be explored in many different ways
• share: there is an RSS feed with the whole content so anyone can use it to visualize it (an API would be more elegant) although my current server is a little unsteady at the moment

Technical stuff (and other)

Several people have collaborated, inputting data or with their opinion. Among them: Nicolás Arteaga, Vanessa Gómez, Andrea D’Macedo, Manuel Piñeros, Sebastián Ramírez, Rafael Tudela y Cárlos López. If you want to collaborate or if you find any innaccuracies, please contact me.

If you want to know what powers the timeline: content is fed via Drupal (which works on top of PHP, MySQL and Apache) to which I connect from Flash using AMFPHP (Drupal has a module for AMFPHP which I had to modify a bit). This has the benefit of automagically generating a plain text version of the content. The server is a little bit slow (the whole database is loaded in the first request… that’s why you see the quiz). Any performance ideas are welcome. Keep in mind it is a shared hosting environment.

This project has been supported by Powerflasher, the people behind FDT (the cool software I use to write all the ActionScript you see in Google Code).

The videogame history timeline originalmente escrito en mga/blog en January 30, 2010.

Por cosas de la vida un cliente me comisionó un trabajo de una línea de tiempo (que luego linkearé una vez esté terminado) y decidí usar ese proyecto como punto de partida para mi línea de tiempo. Es por esto que puedo ahora presentar (drumroll):

La línea de tiempo de la historia de los videojuegos

El link es: http://www.mauriciogiraldo.com/vgline/beta/

clic para ver imagen completa

Decidí destacar ocho tipos de eventos en la historia de los videojuegos:

1. personas (a partir de su nacimiento) de importancia: creadores de juegos, científicos, artistas, empresarios.
2. negocios: empresas o eventos corporativos relevantes.
3. consolas o soportes (hardware) sobre el cual se ejecutan los videojuegos.
4. juegos
5. accesorios y controles que funcionan o se conectan a las consolas.
6. tecnologías relevantes.
7. culturales: eventos que han influenciado de diferentes formas el mundo de los videojuegos (libros, películas, ideas o teorías científicas, etc.).
8. otros eventos que sirven para contextualizar los anteriores con respecto al mundo en su momento.

Cada tipo de evento puede estar relacionado a otros de tres formas:

• creación (evento A creó evento B): por lo general usado para relacionar una persona con los juegos que ha realizado
• inspiración/relación (evento A está relacionado o fue inspirado por evento B)
• series (evento A precede a evento B): para “secuencias” de eventos (ej.: los diferentes “Marios” de Nintendo se asumen como sucesiones secuenciales)

Toda esa información presenta el problema de cómo visualizarla de la forma más clara para el usuario. Para hacer visibles las relaciones se oprime la tecla SPACEBAR:

relaciones entre eventos

En el estado inicial aparecen muchas relaciones y aún falta poner muchísimos eventos. Es por esto que decidí permitir al usuario encender/apagar eventos y líneas de relación (puede usar el teclado). De esta forma, si apago todos los eventos menos personas y juegos puedo ver la misma pantalla con menos “ruido”:

relaciones juegos - personas

Es difícil (hasta diría que imposible) hacer que la interfaz grafique automáticamente todos los eventos y relaciones evitando que líneas se superpongan. Sin embargo creo que la actual solución es agradable y fácil de entender una vez uno le ha metido un par de minutos a jugar (no era la idea hacer una interfaz convencional, quería experimentar un poco con eso).

Esto es lo que se ve si prendo solamente las relaciones tipo serie junto con los juegos:

series de juegos

Se puede apreciar que Doom II va después de Doom y que hay otro juego posterior en la serie. Riven es posterior a Myst, etc.

Buscador

Los usuarios son flojos (bueno, todos menos usted) y si no logran encontrar lo que están buscando en un par de segundos, desistirán e irán a otro sitio web. Adicionalmente, en grandes cantidades de información es difícil predecir por dónde van a llegar a un dato en particular. Es por esto que la línea de tiempo cuenta con un buscador:

resultado para "nintendo"

¡Viva el open source!

En mis años de trabajo web me he apoyado en gran cantidad de librerías/programas/contenidos web libres (conocidos en inglés como open source) y, cada vez que puedo, procuro colaborar de vuelta. En este caso he abierto un proyecto en Google Code para que, el que sepa de ActionScript 3 y Flash, mire a ver que puede sacar de ahí (no pienso dar soporte a ese código, úselo bajo su propio riesgo).

Cosas por hacer

La línea de tiempo está lejos de terminarse, pero es un comienzo. Entre las cosas que quiero hacer:

• contenido en español: desafortunadamente la gran mayoría del contenido sobre videojuegos disponible en la web se encuentra en inglés, y quisiera tener todo al menos en inglés y español
• contenido completo: falta una gran cantidad de información (¿quién dijo SEGA?) y quisiera que fuera una línea exhaustiva y precisa (fechas)
• experimentar: una vez haya muchos más eventos será interesante jugar visualmente con el contenido
• compartir: hay un RSS con todo el contenido de la línea y la idea es que quien quiera hacer su propia visualización pueda usar ese contenido (un API sería más elegante) aunque la verdad mi servidor es un poco precario para aguantar mucho tráfico

Detalles técnicos (y demás)

Varias personas han colaborado, ya sea ingresando eventos o dando su opinión. Entre ellos: Nicolás Arteaga, Vanessa Gómez, Andrea D’Macedo, Manuel Piñeros, Sebastián Ramírez, Rafael Tudela y Cárlos López. Si quiere colaborar o si encuentra alguna impresición en el contenido de la línea, no dude en contactarme.

Si quiere saber qué hay detrás de todo, la línea funciona sobre Drupal (que, a su vez funciona sobre PHP, MySQL y Apache) al que me conecto desde Flash usando AMFPHP (Drupal tiene un módulo para AMFPHP pero igual ha tocado meterle algo de mano para que funcione con las relaciones). Esto tiene la ventaja que se genera automáticamente una versión texto plano del contenido. El servidor está un poco lento (en la primera cargada ya que trae toda la base de datos) y tengo que ver como optimizar mejor todo para que ande mejor (se reciben ideas).

El proyecto ha sido apoyado por Powerflasher, la gente detrás de FDT (el programa que uso para escribir todo ese ActionScript que ve en Google Code).

Una línea de tiempo de videojuegos originalmente escrito en mga/blog en January 25, 2010.

clic para ver grande

¿Cuál es la propuesta?

• Información inmediata en la página principal de la sucursal
• Acceso directo a la información más importante
• Visualizar el comportamiento del saldo en los últimos meses en un mínimo de espacio
• Eliminar distractores que no ofrecen información
• Agrupar categorías redundantes de producto
• Jerarquizar información
• Aprovechar mejor el espacio disponible sin afectar usuarios (el diseño funciona en pantallas con resolución de 800×600)

Si a alguien le interesan estas ideas y trabaja en un banco, no dude en contactarme : )

Si no le gusta, puede dejar un comentario acá o escribir en su propio blog.

Una mejor sucursal virtual originalmente escrito en mga/blog en January 20, 2010.

web usability 101 originalmente escrito en mga/blog en January 17, 2010.

que no se diga que estoy parcializado al skate…

bicicletero suicida originalmente escrito en mga/blog en December 16, 2009.

Esto le da un significado completamente diferente a “lo vi con mis propios ojos”.

color originalmente escrito en mga/blog en December 3, 2009.

En 1997, Michael Dell, fundador y presidente de Dell Computer, respondiendo a una pregunta sobre cómo arreglaría Apple Computer decía:

“What would I do? I’d shut it down and give the money back to the shareholders,” Michael Dell said before a crowd of several thousand IT executives.

[cita sacada de esta noticia del mismo año]

Apple se encontraba en problemas, Steve Jobs llevaba menos de un año de regreso después de haber sido despedido en 1985.

Una búsqueda rápida en Wolfram|Alpha da esto como resultado financiero de los últimos diez años de ambas empresas:

No en vano la revista Fortune nombró a Jobs el presidente corporativo de la década. Jobs puede ser pedante y malgeniado pero se le reconoce que sabe cómo obtener lo que quiere.

en boca cerrada… originalmente escrito en mga/blog en November 16, 2009.