Para encontrar algo que me guste, hay que rebuscar mucho

User login

Efecto mosaico para posters de juegos antiguos

Durante mi visita a RetroMadrid 2013 tuve el placer de estar charlando un rato con ChispaMaster sobre una serie de posters que está realizando con pantallazos de juegos clásicos. Para conseguir darle un poco de textura e interés a los pocos pixeles que mostraban en pantalla, les añade un efecto biselado a los pixels de manera que recuerdan un poco a las fichas de Tetris en su versión arcade o al suelo de juegos como Xenon.

alternate
alternate

Él realiza el trabajo utilizando photoshop de forma "manual", pixel a pixel, de modo que tiene control total sobre lo que hace. Yo, que tengo una especie de obsesión por automatizarlo todo, le comenté que por qué no lo hacía a través de mosaicos y efectos de capa de photoshop, podría ahorrarse bastante trabajo a costa de perder un poco de control sobre el proceso. Quedé en mandarle un correo con el proceso en detalle. Como es algo que tal vez pueda interesarle a alguien más, publico aquí el proceso.

Paso 1: Ampliación de la imagen

El primer paso es ampliar la imagen original sin emplear ningún tipo de suavizado. En Photoshop, esta opción está en el menú Imagen>Tamaño de imagen, usando el método de escalado "Por aproximación (conserva los bordes definidos)". Redimensiono de manera que cada pixel original pase a ocupar un cuadrado de 20x20 pixels (un 2000% de escala).

alternate

Paso 2: Creación del bisel de cada mosaico

El segundo paso es crear una pieza del mosaico del mismo tamaño que tengan nuestros mega-pixeles. En mi caso, 20x20 y en ella dibujar los biseles. Dependiendo del lugar desde el que provenga la iluminación, deberemos colocar las luces y las sombras. Yo la pongo arriba y un poco a la izquierda. En consecuencia, la parte más iluminada será la superior y luego el lateral izquierdo aunque no con tanto brillo. Un detalle muy importante a tener en cuenta es que las iluminaciones las dibujaremos con blanco puro, para regular la cantidad de iluminación deseada jugaremos con la transparencia del color. En este ejemplo a la parte superior le doy una opacidad del 60% mientras que al lado izquierdo un 30%.

Del mismo modo trabajamos las sombras pero utilizando color negro. Las transparencias son las mismas que en las iluminaciones, un 60% para la parte inferior y un 30% para el lado derecho. Para terminar de rematar los mega-pixels y darles un poco más de definición, en el lado derecho y la parte inferior añado una línea de color negro totalmente opaco.

Para trabajar con comodidad con los colores transparentes es conveniente poner de fondo una capa de algún color vivo. Me gusta usar azul puro pero rojo también va bien. Sólo queda crear un motivo de relleno con el mosaico creado pero sin el fondo. En Photoshop debemos seleccionar todo el mosaico e ir a la opción del menú superior Edición>Definir motivo….

alternate

Paso 3: Superposición del bisel sobre toda la imagen

Sobre la imagen original creamos una nueva capa, menú superior Capa>Nueva>Capa…, y la rellenamos con el motivo que hemos definido en el paso anterior. En el menú superior elegimos la opción Edición>Rellenar… Para que todo quede a nuestro gusto, podemos jugar con la transparencia de la capa de mosaico y con el tipo de fusión que queramos.

alternate

Paso 4: Detalles extra

Con algunos detalles extra la imagen ganará un poco de vistosidad. En primer lugar se puede borrar el efecto mosaico en las zonas negras de la imagen. Basta con seleccionar el color negro en la imagen original, activar entonces la capa del mosaico y borrar en ella todo el área seleccionada.

ChispaMaster tambien añade una especie de efecto scanline que también es fácil de imitar con otra superposición de motivo. Las posibilidades son infinitas: simulación de la rejilla RGB, ligera variación de los colores de los mega-pixels, brillos, reflejos… el límite lo pone la imaginación de cada uno.

alternate

Podéis desargar la pantalla de presentación de Rick Dangerous II a su tamaño original y listo para imprimir hasta un temaño de 45x35 cm a 300 dpi desde aquí (2,09 MB). Si alguien se anima, que mande una foto.

alternate