Dave Ruiz blog

Mientras llega o no la revisión de CSS Level3 ¿Como quedarán mis páginas favoritas con bordes redondeados?

javascript:function a(c) { j=document.getElementsByTagName("*"); for (i in j) { if(j[i].style) j[i].style.WebkitBorderRadius=j[i].style.MozBorderRadius=c+"px"; } };a(15)

Y un ejemplo de cómo queda:

Qué cuco queda youtube

La técnica es relativamente sencilla: Con la foto de fondo, se construye una estructura muy simple de polígonos, simulando los objetos de la foto más relevantes. Posteriormente, se proyecta la textura de la foto sobre los poligonos, pero desde la posición de una cámara fija (más o menos lo que hace un proyector).

El efecto conseguido, junto con ligeros desplazamientos de la cámara, es una sensación de estar moviéndote por la escena en 3 dimensiones.

Aquí tenéis una prueba rápida del resultado final. La escena se ha montado en Cinema4D en apenas 10 minutos. Posteriormente he programado un pequeño Flash en AS3 usando las librerías Papervision3D v2, aprovechando su capacidad para cargar archivos COLLADA.

Nota: Pincha en la imagen y espera a que cargue. Mueve el ratón para desplazar la cámara.