domingo, 30 de mayo de 2010

Cómo hacer un Morphing de dos imágenes [ con Squirlz Morph ]

Después de ver qué es un morphing, vamos a realizar un ejemplo completo, desde la descarga del software hasta la producción del fichero de imágenes con la secuencia calculada. En este ejemplo veremos la secuencia básica para la creación de un "morphing" entre dos imágenes.

Existen muchas aplicaciones que facilitan la tarea de creación de estos efectos visuales, muchos de ellos de carácter gratuito. Una interesante selección se puede obtener aquí. En particular para el ejemplo que vamos a realizar me he descargado Squirlz Morph 2.1, ocupa poco (1,4 Mb) y dispone de opciones para generar ademas de ficheros de vídeo, animaciones en flash y formato GIF.

En general la filosofía de trabajo es similar en todos los programas;

  • Incorporar las imágenes
  • Definir puntos de control
  • Definir velocidad y duración de la transformación
  • Generar la animación


Primero abriremos dos imágenes de igual tamaño. 

Los formatos admitidos en este caso son jpg y bmp. Si las imágenes no son del mismo tamaño se pueden convertir desde el propio programa, aunque es recomendable realizar esta conversión desde un software de retoque fotográfico más completo. 

Para abrir los ficheros de imágenes seleccionaremos el icono correspondiente, o accederemos mediante el menú File a esta utilidad. También es posible arrastrar la imagen desde la carpeta en que se encuentre hasta el área de trabajo de la aplicación.




El siguiente paso consiste en indicar el número de imágenes que van a constituir la animación. Por ejemplo si queremos que dure cuatro segundos y tenemos 25 imágenes por segundo (framerate) necesitaremos 100 fotogramas para la animación.



El paso previo para generar el morphing, es indicar los puntos de control que van a guiar la transformación.

Elegir adecuadamente los puntos más adecuado exige un entrenamiento y una experiencia que debemos adquirir mediante ensayo y error; los resultados dependen fundamentalmente del número y disposición de los puntos de control que incluyamos.

En nuestro ejemplo se han seleccionado un reducido número de ellos que se esquematizan en las imágenes siguientes:


Los colores utilizados sirven para identificar fácilmente la correspondencia entre los puntos de control de ambas imágenes. En realidad en el programa comentado no se utilizan, simplemente se dibujan unos pequeños círculos de color blanco.



Podemos imaginar nuestra transformación más claramente si dibujamos una líneas que unan los puntos de control y nos imaginamos que dichos puntos se mueven arrastrando las líneas. Nuestra animación reflejará este movimiento.




Para añadir o quitar los puntos de control utilizaremos los iconos con los símbolos "+" y "-",  seleccionando con el ratón la posición en que se quiera añadir, o en la que se encuentre el punto a eliminar.

Los puntos de control que se introduzcan en una de las imágenes se generan automáticamente en la otra, y ambos se pueden mover arrastrándolos con el ratón, y seleccionando la nueva posición.

Una vez completada la incorporación de puntos de control, y ajustadas sus posiciones, se puede ver una vista aproximada del resultado que obtendremos en una ventana de "previsualización".

Si el resultado es aceptado, pasaremos a guardar el trabajo en uno de los formatos disponibles:

El formato de víseo es muy útil si el morphing se usa en una producción de vídeo, siendo editado con otras herramientas posteriores.

Otro formato interesante es el "gif animado", que puede integrarse fácilmente en un blog o página web.

Para optimizar espacio existen otros modelos comprimidos; se incorpora el formato "flash" con el que pueden reducirse hasta en un 90% el tamaño de los ficheros.

A la hora de guardar el fichero deberemos definir el número de imágenes por segundo que queremos tener en la animación:


Aunque el proceso es sencillo, existen diferentes parámetros de control de la aplicación que pueden ampliar sustancialmente  las posibilidades de alterar los resultados del proceso de morphing.


Estos parámetros permiten controlar con más detalle la transformación aunque complican el uso del programa y por ello no deben despistarnos en el aprendizaje inicial;  lo más importante es diseñar estrategias de transformación de las imágenes, determinando que zonas de una imagen mejor se corresponden con las de la otra.
Debemos adquirir experiencia en la forma de gobernar la transformación mediante los puntos de control.
¿Te animas a intentar un "morphing"?
Avatares obtenidos en Twitter de las cuentas de:
Orejilla de @piziadas
Ojo de @nkkita

sábado, 29 de mayo de 2010

¿ Qué es Morphing ?

Clásicamente se conoce con el nombre "Morphing" a una técnica de manipulación de imágenes digitales que permite obtener una animación -transición controlada- entre dos imágenes diferentes.  La transformación necesaria para su cálculo se realiza en el denominado "espacio de imagen".

Una generalización del concepto de morphing en el "espacio de objetos" es la transformación de un objeto tridimensional en otro. A nivel de objetos se suele denominar "deformación", pero no deja de ser un mismo concepto de "cambio a un nuevo estado de forma".

Generalizamos en un plano más abstracto sin identificar el elemento o propiedad que cambia; evitaremos por tanto identificar si es el color del pixel o la posición de un vértice lo que debe pasar de un color a otro, de una posición a otra, en definitiva de un estado a otro.

"Morphing" es la técnica  que permite obtener una serie determinada de estados intermedios entre dos estados diferentes.

Como ejemplo veamos un morphing en el plano de imagen. Pensemos en la transición necesaria para pasar de un avatar a otro.


A partir de dos imágenes sustancialmente diferentes el efecto es más interesante, ya que se produce un movimiento de las imágenes que es lo que caracteriza a esta técnica. Resaltaremos las diferencias respecto de un fundido clásico. 

Primero vemos la transformación sin guiar las imágenes, y a continuación tenemos un ejemplo en el que se han definido "puntos de control" que favorecen una transformación mas orientada:


Si se superponen las imágenes, en cada pixel tendremos dos valores de referencia, el de la imagen inicial y el correspondiente al de la imagen final.

Mientras en la primera imagen cada pixel va cambiando su color en función del valor del pixel final exclusivamente, en la segunda se aprecia una direccionalidad o movimiento de la imagen, ya que ahora el valor depende ademas de un recorrido en las imágenes.

Para guiar la transformación debemos identificar mediante "puntos de control" diferentes posiciones en la imagen inicial que deben ser conducidas a la correspondientes marcas de la imagen final. La transformación utiliza estas referencias para calcular las trayectorias de cada punto y realizar el "morphing" de las imágenes. 


Orejilla de @piziadas
Ojo de @nkkita

miércoles, 26 de mayo de 2010

Animación 3D, Objetos: Añadir y editar mallas [Blogs experimentales] [ Blender ]

  Un programa de modelado y edición de imagen sintética parte de un conjunto de objetos elementales denominados "primitivas gráficas" que mediante la edición de sus vértices, aristas o caras, permite la creación de modelos con formas complejas.

Añadir Objetos

Para añadir un nuevo objeto nos situaremos sobre la ventana 3D y pulsaremos la "barra espaciadora". Un nuevo conjunto de menús en cascada nos permiten seleccionar la primitiva que queramos añadir, entre un reducido conjunto de formas básicas.


El objeto se situará en la posición donde se encuentre el denominado "cursor 3d", que se representa gráficamente mediante un círculo de líneas rojas y blancas, con cuatro marcas en su borde a modo de "punto de mira".


Para modificar la posición del cursor 3d simplemente deberemos seleccionar con el botón izquierdo en cualquiera de las vistas, en la nueva posición deseada.

Al ser las ventanas bidimensionales, no es posible definir directamente las tres coordenadas del espacio necesarias para el cursor; se utilizará en general una tercera coordenada de forma automática para completar la definición de su nueva posición, por lo que será necesario seleccionar otra vez sobre una nueva ventana si queremos modificarla, es decir, si la coordenada automáticamente generada no es la que queremos.

Es conveniente por tanto disponer al menos de dos ventanas con vistas diferentes, por ejemplo "Front" y "Top", o "Front" y "Side", con el fin de tener acceso a las tres direcciones del espacio, XYZ.


Como puede apreciarse en la imagen anterior, las superficies que se obtienen a partir del tipo "Mesh" estan formadas por caras planas poligonales (para ello pulsaremos la barra espaciadora para obtener el menú correspondiente y seleccionaremos "Add->Mesh" y el tipo de objeto deseado). Nos centraremos en éste tipo de objetos en primer lugar, con objeto de ir profundizando en el modelo de edición de primitivas básicas.

Los polígonos normalmente serán triángulos o cuadriláteros. El renderizado obtenido muestra estas caras planas, que puden servir de base para una representación "suavizada" o redondeada de los objetos:



Debemos diferenciar por tanto entre lo que es la definición del objeto y lo que es su representación; como veremos después en cualquier momento se puede tanto modificar la geometría como la forma de visualizarla.

Al añadir un objeto, se nos ofrece la posibilidad de indicar su resolución o lo que es lo mismo, el número de caras o facetas que lo componen. A mayor número de caras más suavizada nos parecerá la imagen resultante, si bien aumentaremos la complejidad de la escena al tener mayor número de polígonos a renderizar, por lo que el tiempo de cálculo aumentará en consecuencia, haciendo más lenta la obtención de las nuevas imágenes.
Básicamente los parámetros que se definen en cada nuevo objeto son su tamaño y su resolución (número de facetas que lo componen)
Por ejemplo, al añadir una esfera (UV Sphere) definida por meridianos y paralelos, tendremos un menú en el que se indican el número de secciones que la conforman, y el rádio de la misma.


Si aceptamos los valores que nos ofrecen "por defecto" tendremos un nuevo objeto como el representado:


Pero podemos modificar previamente el número de secciones en dicho menú, como se aprecia en la siguiente imagen:


Si modificamos el número de secciones a 8 en ambas direcciones el objeto generado se alejará más de la "esfera ideal"


Desde un punto de vista práctico es necesario un correcto equilibrio entre la "resolución" de los objetos y la calidad de su representación. La experiencia nos guiará en la toma de decisiones al respecto.

El modo de Edición de objetos

Para editar un objeto, modificando su geometría, deberemos entrar en el modo de edición.

Podemos pasar al modo de edición mediante menús gráficos, o simplemente pulsando la tecla "TAB" de tabulación. Esta tecla nos alterna entre los modos "Object" y "Editing" en la ventana 3d.

Al entrar en el modo de edición podremos optar por modificar la geometría existente o añadir nuevos elementos al objeto seleccionado que estemos editando.

El modo de "edición" puede activarse tanto en la ventana de controles

como en la ventana 3d

De forma análoga el modo de "objeto" puede seleccionarse en la ventana de controles

y en la ventana 3d


Además de la tecla de tabulación para pasar en la ventana 3d del modo de "edición" al de "objeto", se pueden utilizar las teclas F7 (object) y F9 (editing) para la ventana de controles.
Al seleccionar un objeto vemos que gráficamente se "silueta" con una línea que lo resalta del resto. En la figura, se ha seleccionado la esfera (con el botón derecho del ratón) y se observa una línea rosa que nos lo indica.


Al entrar en el modo de edición veremos los vértices de las superficies que lo constituyen. Estos vértices son seleccionables para su edición, pudiéndose transformar de forma individual o en grupos de elementos seleccionados.


Los vértices seleccionados serán resaltado con otro color (amarillo) y las operaciones que realicemos en el modo de edición serán sólo aplicables a este conjunto seleccionado


Para ver este efecto usemos un sencillo ejemplo. Definamos una esfera (UV Sphere) y seleccionemos un conjunto de puntos. Para ello, con la tecla "a" podemos seleccionar o deseleccionar todos, y con la "b" marcar un rectángulo de forma que se seleccionen todos los puntos que se encuentren en su interior.



El resultado de trasladar y escalar un conjunto de puntos activos se observa en la siguiente imagen


que podemos renderizar para observar en detalle.


Para seleccionar un punto pulsaremos con el botón derecho del ratón de forma similar a la selección de un objeto. Podemos añadir nuevos puntos con la ayuda de la tecla "shift" o bien indicar un área presionando previamente la tecla "b"

sábado, 22 de mayo de 2010

Animación 3D, Luces: Tipos [ Blogs experimentales ] [ Blender ]

Uno de los aspectos más importantes en la creación de una imagen de síntesis es la definición de los elementos que iluminan la escena.
Blender permite definir diferentes objetos que añaden la iluminación a los objetos que constituyen una escena. Vamos a introducir los distintos tipos de luces y sus características básicas, en una primera aproximación a la definición y manipulación de los elementos que se usan como luces.

Los puntos de iluminación añaden indudablemente una gran parte del realismo y lo que entendemos por atmósfera o ambiente, pero a su vez son los elementos más delicados de utilizar al influir enormemente en el tiempo necesario para renderizar una escena. Añadir muchos puntos de luz puede complicar o incluso hacer inviable la producción de las imágenes.

Cada clase de objeto que actua como fuente de luz dispone de un conjunto de parámetros que gobiernan sus propiedades; algunos parámetros son comunes a todos los tipos de iluminación, mientras otros son específicos; las ventanas que permiten asignar sus valores difieren sensiblemente unas de otras, manteniendo unos controles idénticos para la entrada de datos comunes a todos ellos .

Entre las variables de control común, destacaremos dos de ellas:

  • Energia o intensidad del punto de iluminación
  • Color de la luz 
Otros aspectos también tienen su importancia, como la máxima distancia desde el punto de iluminación a la que llega la luz, y que serán tratados al profundizar en estos elementos.

La ventana "Lamp" contiene los controles básicos:

Parámetros comunes a las diferentes luces

En este artículo enumeraremos los diferentes tipos de "lámparas" que podemos incluir en una escena; mostraremos gráficamente, mediante ejemplos, el resultado de su inclusión en una imagen muy simple que nos permita valorar sus principales características.
Para añadir una luz a la escena se procede de forma similar a la inclusión de un objeto genérico. Situaremos el cursor (ratón) sobre una de las ventanas 3D y pulsaremos la tecla de "la barra espaciadora". En el menú que se despliega seleccionaremos Add -> Lamp  y a continuación el tipo deseado. La luz se situará en el punto donde se encuentre el cursor 3D, pudiendo ser reposicionada a continuación.

Añadir una luz es como añadir un objeto genérico


Se puede acceder al panel de control de las propiedades de las luces configurando en cualquier ventana un "Button Windows" 

Seleccionando "Button Window"

A continuación seleccionaremos el icono de "Shading" o presionaremos "F5" y por último "Lamp Buttons" como se aprecia en la imagen.

La bombilla permite acceder al "Lamp Buttons"


Tipos de Luces

Más adelante veremos cómo modificar los parámetros de iluminación; empezaremos por la descripción de los tipos de luces básicos. La ventana de previsualización "Preview" nos aproxima gráficamente el efecto de la luz que tengamos activa, siendo de gran utilidad para la modificación o edición de sus parámetros.

Hay que resaltar que la complejidad de la composición entre el color del objeto y la iluminación del mismo hace que esta información sea orientativa únicamente, debiendo realizar varios renderizados normales (tecla F12) para un ajuste fino de los parámetros.
  • Lamp
Este objeto de iluminación es el encargado de simular una bombilla normal y corriente.

La luz que aporta se propaga en todas direcciones desde la posición en que se encuentra dicha lámpara, lo que se conoce como "Luz omnidireccional".
Podemos pensar en una bombilla perfectamente esférica, como símil para su comprensión.

La iluminación decae con la distancia como veremos más adelante, y en este tipo de iluminación será un factor importante a considerar.

Se presentan dos imágenes para cada caso, como se ve a continuación. En la primera veremos la pantalla de edición en modo "sombreado", que nos da una idea rápida del grado de iluminación de la escena. En la siguiente imagen observaremos el resultado final en el ejemplo renderizado.



  • Area
Este objeto es una luz direccional, una iluminación que proviene según una dirección concreta:

Aunque se propaga desde una  región o área casi como en el caso anterior, pero ahora no es un punto el generador de la luz, sino un rectángulo que puede ser escalado para aumentar la superficie radiante y en consecuencia el área iluminada.

Podemos asimilarlo a una pantalla plana, como la de los tubos fluorescentes
Es importante considerar con este tipo de lámparas la distancia a los objetos así como el tamaño de la fuente de luz.



  • Spot
Simula un foco de luz direccional. La iluminación se produce desde un punto aumentando la zona iluminada según nos alejamos del punto de luz.

Un ejemplo que ilustre esta clase de objeto pueden ser los focos de un vehículo, o las luces que se utilizan en los conciertos.

Entre los parámetros que apareceran específicos para este tipo de luces, serán determinantes los que describan "el cono de luz", a los que se les puede añadir un "halo" o efecto de humo que permite ver la trayectoria de la luz, así como otros efectos atmosféricos.

Es una de las luces más interesantes y efectistas, por lo que su estudio detallado se presenta obligatorio para sacarle un rendimiento alto en las imágenes que lo incorporen.




  • Sun
Simula el efecto de la luz solar. Ilumina toda la escena por igual, independientemente de su posición.

La luz genera rayos paralelos según una dirección. Es por tanto una luz direccional pero que no decae en intensidad en función de la distancia al punto en que la situemos. Teóricamente los rayos de luz parten desde el infinito, o, al menos, desde una distancia suficientemente grande, como es la luz solar.

Podemos observar que la sombra que produce en los objetos no depende por tanto de la posición en que la situemos, sólo dependerá por tanto de la orientación del objeto.



  • Hemi
Esta luz es similar a la solar, pero no produce sombras.

Se puede considerar direccional en muchos sentidos, siendo independiente de forma similar a la solar, del punto en el que la situemos.

Permite simular una luz difuminada, similar a la que se produce en un día nublado en el que aunque predomina una dirección de iluminación principalmente, los rebotes de los rayos de luz mitigan las sombras que arrojan los cuerpos haciéndolas imperceptibles



Recent Posts

Salvo indicación expresa, todos los contenidos de esta página están sindicados bajo una licencia Creative Commons. Puedes usarlos y modificarlos, siempre que no se haga con fines comerciales y se cite al autor.

Los enlaces que completan las ilustraciones son informaciones y opiniones de sus autores, muchas veces diferentes e incluso manifiestamente opuestas, buscando un contraste de visiones.

Etiquetas

#manifiesto (2) 2010 (1) 3D (41) Actividad sísmica (3) Actualidad (22) Aeronáutica (1) Agua (3) Águila (1) Alan Wake (1) Aminatou Haidar (1) Amor (3) Animación (24) Animales (1) Antialiasing (1) Aplicaciones (1) Aprendizaje activo (1) Aprendizaje cooperativo (1) árbol (1) Arquitectura (1) Arte (4) AstroRobonaut (1) Australia (1) avatar (1) Bicicleta (2) Biología (2) Bitacoras.com (4) Blackout (1) Blender (42) Blog (71) Blogs (3) Blue Brain (1) Bump Mapping (2) Capas (1) Carrillo (1) Censura (2) Chile (2) Ciencia (34) Cine (2) Citas (2) Civismo (1) Color (3) Comentarios (1) Comic (1) Composición (1) Conferencia Montreal (1) Consolas (1) Creatividad (2) Crítica (2) Cultura (3) Curiosidades (1) D (1) Daniel Bensaïd (1) Desastres naturales (1) Dibujo (4) Diseño (9) Documental (2) Edición (9) Educación (23) Esfera (1) Esferas (1) España (1) Estadisticas (1) Estructura (1) Evolución (1) Exposición (1) Fallas (2) Festividad (2) Ficheros (1) Filosofía (1) Flores (1) Follow friday (2) Fondo Figura (1) fondos (1) Fotoblog (2) Fotos (4) Fractales (1) Frases (1) Fuego (1) fútbol (1) Galaxias (1) Gallo (1) Geometría (17) Gomarta (1) Google (1) Gráficos (13) Greenpeace (1) Guatemala (1) Haiti (10) Hipopótamo (1) Historia (1) homenaje (1) Huellas (1) Humano (1) Humor (36) Iluminación (5) Ilusiones ópticas (2) Imagen (7) Imagen sintética (76) in memoriam (1) Ingeniería (2) Innovación (5) Innovación educativa (16) inocente (1) Internet (6) Investigación (2) ISS (2) Jardín (1) Java (1) Juegos (1) Jugabilidad (1) Key Frame (1) Layers (1) Lectura (1) Letras (1) Leyes Gestalt (3) Libertad expresión (1) Libro (1) Madrid (6) Mapeado (1) Mar (1) Matemáticas (1) Material (6) Maya (2) Mesh (2) Metaballs (1) Microsoft (4) Morphing (35) mosaico (1) Movie Maker (2) Mujer (1) Mundial (1) Música (2) Nasa (1) Navidad (3) NEURONA (1) niño (2) Objetos (2) OCW (1) Óleo (9) Óleos (1) Olimpiadas (1) open source (3) Optimula (1) Organización (1) Pacman (1) palante (1) palillos (2) Paloma (1) Pelo (2) Pensamientos (2) Periodismo (9) Perlin Noise (1) Personajes (5) Personal (8) Pi (1) Pintores (1) Pintura (6) Pixel (1) PIZ (23) PIZiadas (48) Política (3) Post (1) premios (1) Primavera (1) programación (9) Proteina (2) Publicidad (3) puentes (2) Puntillismo (1) R2 (1) Raytracing (27) Real time (1) Realidad aumentada (1) Realidad virtual (1) Recursos educativos (2) Reflejos (5) reflexión especular (4) Refracción (4) Rendering (22) René Descartes (1) Representación (1) Retos (1) Salinger (1) Saludo Blog (3) San Valentin (1) Saramago (1) segregadores (3) Selección (1) SGAE (2) Shaders (1) Sillón (1) Simulación (1) Sismico (1) Software (14) Sombreado (1) Sonido (1) Sudáfrica (1) Tecnología (35) Televisión (2) Tendencias (2) Terremoto (15) Texto (1) Texturas (8) Tinta (1) Transparencia (5) Turquía (1) Tutorial (5) Tutoriales (2) Twitter (9) Universo (1) UPM (1) usuarios (2) Vetas (1) VGG (4) videojuegos (1) Vídeos (13) Wikipedia (1)