(versión en castellano abajo)

This is a visual experiment showing some common statistics formulae (mean, median and absolute deviation) applied to some classic movies (2001: A Space Odyssey, Apocalypse Now, Breakfast at Tiffany’s and The Godfather). The formulae were applied separatedly for every pixel over time, using color data as values.

*Images intensity have been normalized for a better visualization.

Castellano

En este experimento visual muestra varias fórmulas estadísticas (media, mediana y desviación absoluta) en películas clásicas (2001: Una Odisea en el Espacio, Apocalypse Now, Desayuno con Diamantes y El Padrino). La aplicación de las fórmulas se realizó para cada pixel por separado, a través del tiempo, usando como datos los valores de color.

*La intensidad de las imágenes ha sido ajustada para una mejor visualización.

Today I’m getting this rendering bug on Google on IE 8 beta. What is this!?

Hoy se me muestra Google con este extraño error de visualización desde IE 8 beta… ¿qué es esto?

(versión en castellano abajo)

Have you ever wonder how a Van Gogh’s paint would look animated? To ask the question, I’ve developed a new 2d effect I call liquid paint and you can try it here.

The usage is simple: draw lines with your mouse over the image following the paths created by the paint’s strokes.

This is the ActionScript 3 port of the liquid paint effect. Due the heavy speed optimizations done to make the effect work smooth enough, the source code is a mess, but if you want to take a look here it is. I have to thank again Mr. Doob for his support and for teaching me the basis of AS3 coding.

Castellano

¿Has pensado alguna vez cómo sería un cuadro de Van Gogh en movimiento? Para responder a la pregunta, he desarrollado un nuevo efecto 2d al que llamo pintura líquida y puedes probarlo aquí.

Su funcionamiento es simple: dibuja líneas con el ratón sobre la imagen, siguiendo los trazos creados por las pinceladas del cuadro.

Esta es la versión en ActionScript 3 del efecto. Debido a la optimización en velocidad requerida para que funcione a una velocidad razonable, el código es desordenado y confuso, pero si te interesa puedes echarle un vistazo aquí. Agradezco de nuevo a Mr. Doob su apoyo y el enseñarme la base de AS3 para poder realizar este tipo de efectos.

(versión en castellano abajo)

Mr. Doob, a Flash expert and a great graphic designer shown me some days ago some voxel experiments he was doing with Actionscript 3. I have very few idea (nothing at all) of Flash, but I remembered some voxel head renderer I did years ago as a Windows executable and thought it could be done with a reasonable speed in Flash too. So, I asked Mr. Doob if he wanted to help me with the port, and here it is.

It is medical data, a CT scan I got here. It was resampled to 512×512x512 and then coloured with radiosity. It looks a bit creepy in the mouth; these spikes are interferences caused by the tooth.

You can see the source code here.
Read the article Mr. Doob wrote about our creation.

Español

Mr. Doob, experto en Flash y genial diseñador gráfico, me mostró hace unos días unos experimentos de voxels con Actionscript 3 en los que estaba trabajando. Yo apenas se nada de Flash, pero recordé un renderizador de voxels que hice como ejecutable Windows hace años, y pensé que se podría portar y conseguir una velocidad razonable. Se lo comenté a Mr. Doob, y aquí lo tenéis.

Los datos son médicos, un tac que encontré aquí. Lo redimensioné a 512×512x512 y lo coloreé con un algoritmo de radiosity para voxels. Se que da un poco de miedo, pero los agujeros y salientes cercanos a la boca son sólo distorsiones producidas por los dientes en el tac.

El código fuente está disponible aquí.

I am still designing free logos for interesting projects (see other free logo designs -only in Spanish). This time I will show you the logo I’ve created for the open source project DotNetOpenId.

The idea of the logo was to give the openid logo a touch of .net, to make it clear at a glance what the project is about: OpenID on the .NET platform.

About OpenID

OpenID is an open authentication mechanism designed to free users of having to memorize unique usernames and passwords for every web site they want to sign into.  A single web site (the OpenID Provider) hosts a user’s ‘identity’, and that web site authenticates the user whenever the user wants to log into an OpenID-supporting web site (an OpenID Relying Party).  The protocol is designed so that anyone can be a Provider or a Relying Party without having to pay royalties or fees.  There is no central identity hub that anyone must register with.

DotNetOpenId makes adding OpenID support to an existing ASP.NET web site as easy as dropping a control onto the designer.  An API also exists for those who want more control, flexibility or who are using ASP.NET MVC.

Free logos

I’m interested in collaboration with open source projects, creating logos for free. If you have a nice open source project I can collaborate with, please write to my contact form. Unfortunately I have limited free time, but I try to maintain 2-3 free logos done per week.

Debido a nuevos proyectos en los que estoy trabajando, hace ya varias semanas que no he podido publicar en el blog. Tengo un importante mensaje que daros, y dado que dos de mis aficiones son la criptografía y los juegos de lógica, aquí os lo dejo cifrado:

1111100100111110000011111101011
0001000000000001111100000111100
0001111110000111110000011111101
0110001000001111110000100000000
1111110000100000111111000111111

¿Quién se atreve a descifrarlo? ;)

Webcam input to mosaic of favicons software for Windows. Download it here.

Programa para ver las imágenes de tu webcam como un mosaico de faviconos. Puedes descargarlo aquí.

(versión en castellano abajo)

I found an interesting article by Ask the CSS Guy about one pixel notched corners CSS trick used by Google. In this article, the CSS Guy show us how Google did it, using <li><a><b><b><b>Option</b></b></b></a></li>. The CSS guy was able to do it with only 2 nested <b>. I just thought that even if it was a better way than Google did, two <b>s doesn’t look good enough… so I had to try to do it better.

I’ve done it with just one <b>:  <li><a><b>Option</b></a></li>, so the semantic meaning remains intact. It is crossbrowser (tested and pixel perfect in 12 browsers, IE 5.5, 6, 7, 8, Opera 9, Firefox 2, 3, Maxthon 1.6, 2, Konqueror 3.9.2, Safari 3, Flock), and also the same code could be used as quirks or strict mode without changes. Of course, the xhtml strict version pass the W3C validation.

Quirks mode version
Xhtml stric mode version

Castellano

En un interesante artículo de Ask the CSS Guy se explicaba cómo Google Analytics crea bordes redondeados de un pixel sin imágenes y sólo CSS. Para ello Google usa una estructura <li><a><b><b><b>Option</b></b></b></a></li>. El Chico CSS fue capaz de mejorar dicha estructura reduciendo el número de <b>s a sólo 2. Pensé que se podía hacer aún mejor, y me puse a intentarlo.

Finalmente he conseguido que sólo tenga una <b>; <li><a><b>Option</b></a></li>, de esta forma se mantiene la semántica. Es crossbrowser (probado y renderizando con resultados totalmente idénticos en 12 navegadores: IE 5.5, 6, 7, 8, Opera 9, Firefox 2, 3, Maxthon 1.6, 2, Konqueror 3.9.2, Safari 3, Flock), y el mismo código se puede usar tanto en modo quirks como strict sin cambios. Por supuesto, la versión xhtml estricta valida según la W3C.

Ie7+ FF2+ Opera9 Safari3 …

Realmente no se qué decir sobre esto… pero… ¿a que es bonito? :)
I don’t have an idea to write about this but… it is beatiful, isn’t it? :)