semana 13

En esta sesión, nos dedicamos a transformar una pintura estática en una animación interactiva. Seleccionamos una obra de arte apropiada, asegurándonos de que el sujeto principal esté solo y que el fondo sea simple para facilitar la edición. Si había otros personajes, debían estar lo suficientemente apartados para no interferir con el sujeto principal, y las extremidades del personaje principal debían estar bien definidas para permitir una animación fluida.

Comenzamos abriendo la pintura en Photoshop, duplicando la imagen para trabajar en capas independientes. Utilizamos la herramienta de selección rápida para delinear el personaje principal, ajustando la selección con las teclas Shift y Alt para incluir o excluir áreas según fuera necesario. Con la selección finalizada, copiamos al sujeto en una nueva capa (Ctrl + J).

Con el personaje separado, seleccionamos la capa original y aplicamos "Relleno según el contenido" (desde el menú Edición) para eliminar al sujeto y rellenar el espacio con el fondo. Refinamos los bordes usando la herramienta de pincel puntual para eliminar cualquier imperfección. Guardamos las dos capas resultantes como archivos PSD individuales.

En After Effects, creamos una nueva composición en formato HD 1280 x 720 con una duración de 10 segundos. Importamos el archivo PSD seleccionando la opción "Composición - Conservar tamaños de capa". Colocamos las capas de fondo y del personaje en la línea de tiempo, y convertimos ambas capas a 3D. Creamos una cámara a través del menú Capa > Nuevo > Cámara, y la vinculamos a un objeto nulo para facilitar el control de los movimientos de la cámara. Establecimos el recorrido de la cámara en los primeros 6 segundos de la animación, dejando los últimos 4 segundos para el movimiento del personaje.

Dividimos la pantalla en dos vistas: una con la vista frontal y otra con la vista de cámara activa. Ocultamos las capas de la cámara y el objeto nulo para enfocarnos en animar el personaje.

Seleccionamos la capa del personaje y aplicamos la herramienta Pin de marioneta, colocando puntos de control en las articulaciones clave (cabeza, cuello, torso, rodillas y pies). Estos puntos permitieron ajustar el movimiento del personaje de manera natural. Desplegamos la malla de marioneta en la capa del sujeto y ajustamos los movimientos de las extremidades con keyframes, sincronizándolos con el movimiento de la cámara.

Para añadir efectos visuales, creamos una capa de sólido y aplicamos "CC Particle System II" desde la ventana de Efectos y ajustes preestablecidos. Configuramos las partículas según el efecto deseado, eligiendo entre diversas opciones como explosiones, vórtices, fuego o burbujas.

Este proceso culminó en una animación interactiva que convierte una pintura estática en una obra dinámica y atractiva, utilizando técnicas avanzadas de edición y animación para lograr un resultado profesional y visualmente impresionante.

Video Final LipSync

 

Semana 11?

En esta sesión, completamos la tarea de animar personajes en una conversación. Comencé abriendo un nuevo proyecto con las dimensiones estándar de 1280 x 720 píxeles en alta definición. También ajusté la configuración a ActionScript 3.0 si era necesario antes de iniciar el trabajo.

Inicialmente, dibujé los personajes y los convertí en símbolos gráficos separados. Después, asigné cada personaje a fotogramas individuales, siguiendo el método previamente establecido. Para animar las bocas, seleccioné todas las bocas menos la primera, las copié, las eliminé y creé un nuevo fotograma clave en blanco después del fotograma actual, pegando las bocas en su lugar. Repetí este procedimiento hasta que todas las bocas estuvieron correctamente posicionadas.

Propuesta:

Añadí una capa nueva sobre las capas de los personajes, nombrándola Etiquetas para etiquetar cada pronunciación. Inserté fotogramas clave donde era necesario y etiqueté cada uno con la letra correspondiente en la pestaña de propiedades.

A continuación, salí del símbolo y añadí una nueva capa denominada "audio". Importé el archivo de audio desde Archivo > Importar > Importar a biblioteca. El audio se añadió a la biblioteca del proyecto y extendí las capas para que coincidieran con la duración completa del audio.

En la pestaña de propiedades, ajusté la reproducción para que utilizara un solo fotograma, y luego utilicé la herramienta de sincronización de labios. En esta herramienta, se mostraron cuadros con el personaje y las letras correspondientes. Ajusté las bocas para que coincidieran con cada letra, seleccionando todas las bocas necesarias para asegurar una pronunciación precisa. Una vez completado, hice clic en ok.

La animación sincronizada se mostró en la línea de tiempo y al reproducirla, el audio coincidió perfectamente con los movimientos de la boca de los personajes.

Semana 11

Desarrollo del Proyecto de Lipsync en Animate

Durante la sesión, se abordó un tema que requería investigación y experimentación individual relacionada con los programas en uso. El profesor encomendó la tarea de ajustar el personaje en trabajo para que mirara directamente hacia adelante y la implementación de sincronización labial, conocida como lipsync.

En lo que respecta al lipsync, se estableció que, como mínimo, se requerían 9 imágenes para una representación aceptable, aunque 12 imágenes mejorarían la calidad del resultado. Se enfatizó la posibilidad de incluir todo el abecedario para optimizar el resultado final. Se asignó la tarea de crear 9 variantes de la boca utilizando vectores en Illustrator, con un tiempo designado para esta tarea.

El archivo de Illustrator debía organizarse con todas las bocas como subcapas dentro de una capa principal denominada "Bocas", siguiendo una estructura análoga a las composiciones en After Effects. Además, se solicitó etiquetar las letras correspondientes a cada boca para facilitar el proceso posterior.

Posteriormente, se instruyó a abrir un nuevo documento en Animate con dimensiones de 1280 x 720 píxeles, a 30 cuadros por segundo, y configurado con ActionScript 3.0, requisito fundamental para la realización del lipsync.

Se procedió a la importación del archivo de Illustrator a Animate, manteniendo la estructura de capas y su posición relativa en el espacio de trabajo. Una vez importado, se bloquearon todas las capas excepto la capa "Bocas" para focalizar el trabajo únicamente en este elemento. Se indicó la conversión de este conjunto en un símbolo gráfico y la separación de cada boca en un fotograma independiente.

En una capa adicional, se agregaron fotogramas clave y etiquetas correspondientes a las letras representadas por cada boca, todo ello dentro del símbolo. Seguidamente, se procedió a crear otra capa para el audio en la escena principal. A pesar de las instrucciones de utilizar archivos de audio en formato MP3, surgieron inconvenientes técnicos con dicho formato.

Semana 10

 

Creación del Espacio Tridimensional en After Effects

En el proceso inicial de nuestro proyecto en After Effects, nos abocamos a la generación de un espacio tridimensional a partir de recursos bidimensionales, un desafío inherente a la animación digital. La transición de la bidimensionalidad a la tridimensionalidad implica la adición de un eje adicional, el eje z, que confiere volumen y profundidad a la escena.

1. Selección y Preparación de Imágenes:

   • Seleccionamos cuidadosamente imágenes de alta calidad en línea, tales como elementos del entorno forestal y fondos paisajísticos, preferiblemente en formato PNG para facilitar la eliminación de fondos no deseados.
   • 
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
     
   • Utilizando herramientas como Adobe Photoshop, aplicamos técnicas de recorte y edición para eliminar cualquier elemento no deseado y asegurar la coherencia visual de las composiciones.

2. Creación de la Composición en After Effects:

   • En After Effects, iniciamos una nueva composición con dimensiones estándar de 1280x720 píxeles y una tasa de fotogramas de 30 por segundo.
   • Esta composición sirve como lienzo tridimensional, donde importamos las imágenes previamente seleccionadas y las configuramos como capas 3D, lo que sienta las bases para la profundización del espacio visual.

3. Ajuste de Profundidad y Escala:

   • Utilizando las herramientas de manipulación espacial de After Effects, ajustamos la posición de las capas a lo largo del eje z para crear una sensación de profundidad y distancia.
   • La escala de las capas se ajusta en función de su posición en el espacio tridimensional, permitiendo que objetos más distantes aparezcan más pequeños y viceversa, lo que añade credibilidad a la escena.

4. Dinamismo con Movimiento de Cámara:

   • Introducimos una cámara virtual en la escena, la cual servirá como punto de vista del espectador y proporcionará un sentido de movimiento y perspectiva.
   • Mediante la animación de la posición y orientación de la cámara a lo largo del tiempo, creamos efectos de movimiento fluidos que guían la atención del espectador a través del espacio tridimensional.

5. Realce con Iluminación:

• Para mejorar la percepción de profundidad y volumen, incorporamos fuentes de luz virtuales en la escena, permitiendo que la interacción luz-sombra genere una sensación de realismo.
• La posición y dirección de las luces se ajusta estratégicamente para resaltar los elementos clave de la composición y añadir un efecto dramático al entorno tridimensional.

Este proceso de creación de un espacio tridimensional en After Effects, aunque desafiante, proporciona una base sólida para la construcción de escenas visuales dinámicas y cautivadoras.

semana 9

Creación del Master de Propiedades de Capa

Para dar inicio al proceso, hemos creado una composición central denominada "Master". Esta composición engloba todos los videos previamente elaborados que abordan las propiedades de capa (rotación, opacidad, escala, posición), configurando así la animación final que abarcará un total de 50 segundos.

1. Comenzamos creando una nueva composición (Ctrl + N) con dimensiones estándar de 1280 x 720 y a 30 cuadros por segundo, dado que se trata de un video.
2. Establecimos la duración de 50 segundos escribiendo 0:00:50:00 en el tiempo de la composición.
3. Luego, arrastramos cada composición de las propiedades de capa a la línea de tiempo, organizándolas de manera que reflejen la secuencia deseada.
4. Posteriormente, procedimos a renderizar el Master. Esto se logró accediendo a Archivo, seleccionando Exportar y añadiendo el renderizado a la cola de procesamiento.
5. Finalmente, seleccionamos la ubicación para guardar el archivo y procedimos a clickear en "procesar".

Creación de un Loop de un Personaje

Continuamos el proceso abriendo el archivo de Photoshop que contiene los fotogramas dibujados del personaje en movimiento. Verificamos que los dibujos estuvieran organizados en capas normales y en el orden correcto para su reproducción, lo cual nos permitiría guardar el archivo en formato PSD.

1. Iniciamos After Effects y seleccionamos la opción de importación, ajustando las configuraciones para conservar el tamaño de las capas y mantener el estilo de capas editable.
2. Luego, arrastramos el archivo del personaje a la línea de tiempo en After Effects.
3. Al dar doble clic en el archivo, todas las capas se colocaron automáticamente en la línea de tiempo.
4. Redujimos todas las capas a 2f (frames) seleccionando todas con Shift y arrastrando.
5. Seguidamente, seleccionamos todas las capas, clic derecho, "Asistente de Fotogramas" y luego "Capas Secuencia", organizando las capas en una secuencia adecuada.
6. Ajustamos la cantidad de fotogramas en la composición según la línea de tiempo (16 fotogramas en este caso).
7. Creamos una nueva composición llamada "Master" (Ctrl + N) con las mismas propiedades, pero con una duración de 5 segundos.
8. Arrastramos la composición del personaje corriendo a la línea de tiempo de la nueva composición "Master".
9. En la composición, clic derecho, seleccionamos "Tiempo" y activamos "Remapeo de Tiempo", convirtiendo la composición en una animación para aplicar efectos y otras propiedades.
10. Utilizamos la tecla Alt y clic en el cronómetro para abrir una línea de código de programación y eliminamos la línea "Time Remap".
11. Escribimos "Loop" y seleccionamos "LoopOut" entre las opciones disponibles.
12. Finalmente, reprodujimos la línea de tiempo para verificar que el loop funcione correctamente. En caso de saltos o errores, duplicamos la primera y última capa y las ajustamos para cubrir cualquier espacio vacío antes o después de la secuencia, manteniendo la continuidad de la animación.

Semana 8

Adobe After Effects

Iniciamos en
Adobe After Effects, abordando su estructura y funcionalidades desde el punto de partida. Al acceder a la aplicación, el primer paso es la creación de un nuevo proyecto, donde los parámetros temporales se definen en horas, minutos, segundos y cuadros, con un límite máximo de 9 horas.

El siguiente paso implica la creación de una nueva composición, un entorno donde se configuran los elementos fundamentales:

• La velocidad de fotogramas se establece en 30 por segundo.
• El nombre del archivo se designa como "Posición".
• Las dimensiones de ancho y alto se ajustan al estándar HDTV.
• El código de tiempo inicial debe ser 0.
• La duración se define en 10 segundos.

Posteriormente, se examinan las características esenciales de la interfaz:

• La barra de herramientas proporciona acceso a las funciones clave.
• La caja de elementos importados, situada a la izquierda, almacena los recursos del proyecto.
• La línea de tiempo, en la parte inferior, muestra la extensión temporal.
• La visualización detallada de cuadros se encuentra en la barra inferior.
• En la barra derecha se presentan los efectos y propiedades visibles.

Para comenzar el proceso de composición, se genera una capa sólida, una superficie uniforme de color, mediante el comando Ctrl + Y. Luego, se duplica este procedimiento para agregar otra capa sólida, comprendiendo que estas capas se superponen, otorgando prioridad visual a la superior.

A través de este ejercicio, se adquiere dominio sobre las propiedades de las capas:

• Se renombran las capas para una mejor organización del proyecto.
• Se ajusta la posición de la capa sólida utilizando el atajo P, moviéndola en un plano bidimensional.
• Se marcan puntos clave en el tiempo para animar el movimiento de la capa.

Para explorar las transformaciones, se crea una nueva composición denominada "Escalar", donde se manipula el tamaño de las capas sólidas a lo largo de la línea temporal.

Se procede con una composición dedicada a la "Opacidad", donde se controla la transparencia de las capas sólidas, generando efectos de aparición y desvanecimiento.

Continuamos hacia una composición de "Rotación", donde se experimenta con el giro de los elementos sólidos, agregando dinamismo a las composiciones.

Finalmente, en la composición "Propiedades", se desbloquean las capacidades completas de las capas sólidas, permitiendo ajustes independientes de sus propiedades a lo largo del tiempo.

Para concluir este proceso creativo, se exporta cada composición en formato mp4, preparándolas para su distribución y reproducción.

6 semana

 En la clase de animación de la semana pasada, el profe nos explicó cómo iba a ser el proyecto. Nos tocó elegir los temas y objetos para nuestra animación, así que decidimos ir con "brujería" y "libro de hechizos". Después, nos dijo qué teníamos que hacer en la primera etapa y cuándo teníamos que entregarlo. En esta parte, tenemos que hacer la ficha del personaje principal y del malo, sacar sus colores, hacer las vueltas, las expresiones y las poses. Además, nos mostró algunos ejemplos y luego nos evaluó.

5ta semana

En esta sesión, el profesor revisó el progreso de nuestra animación. Todos debíamos entregar al menos 30 frames de avance. Aquellos que no pudimos completarlo, aprovechamos la clase para trabajar en ello y recibir retroalimentación y evaluación. La clase se dedicó completamente a nuestras animaciones y también se resolvieron dudas y se aclararon dinámicas futuras y pendientes.

Semana 4

En esta clase, aprendimos a utilizar Premiere Pro y Photoshop para crear una secuencia de imágenes a partir de un video corto. Comenzamos ajustando el tamaño del video y editándolo para reducir su duración. Luego, exportamos las imágenes y las organizamos en Photoshop para comenzar a agregar trazos. Finalmente, exportamos nuestra creación en formato mp4 para entregarla como evidencia.

Semana 3

Abrimos Animate y aprendíamos a realizar un Gif

En la semana 3 realizamos 3 animaciones que aportaron conocimiento para poder realizar la actividad de blackboard.

pelota

péndulo

Pelota que rebota

Animaciones bastante simples pero son las primeras que hago y me ayudaron como intro a la animación.