Hola a todos, ¡Hoy iremos a una clase de magia con el mágico software 'CLIP STUDIO!' Este tutorial del taller les mostrará cómo crear un efecto mágico para la escena de invocación. Podrán aplicarlo para encantar sus ilustraciones

 

O añadirlo a su escena de animación con alguna transformación.

Este tutorial contiene 3 partes principales: cómo crear el círculo de invocación simétrico con la herramienta de regla simétrica, cómo hacer un bucle de rotación simple con la herramienta Objeto y cómo aplicarlo a su escena de animación. Mi tutorial se centra principalmente en cómo crear cosas con las herramientas de Clip Studio. Podrán seguirlo fácilmente paso a paso si son nuevos en el software, u obtener ideas para mejorar su método de trabajo si ya son expertos en la herramienta.

¡¡Empecemos!!

Tutorial en vídeo

Parte 1: Dibujar el círculo de invocación

Crear el círculo de invocación es fácil con una regla simétrica

Pueden dibujar la forma simétrica que puede girar en un punto perfectamente

Sin embargo, la regla simétrica funciona mejor con un círculo de invocación dibujado a mano. A veces, al añadir una forma después, el centro de rotación del objeto no coincidirá con el centro de la regla simétrica.

Se supone que esta imagen puede girar 90 grados, pero al crearla en un bucle, se puede ver que sin la regla simétrica centrada en el centro de rotación, no puede tener una rotación perfecta de 90 grados.

(tiene un pequeño salto en el bucle. Sin embargo, este problema también se puede solucionar con una rotación de 360 grados, pero necesitarán una línea de tiempo más larga para mantenerla suavemente lenta)

Si lo dibujan con la cuadrícula, puede girar perfectamente. También pueden colocar la regla simétrica dibujada dentro de la cuadrícula más tarde con el método de transformación de material.

Consejos: El ángulo de rotación que menciono aquí les ayudará a optimizar su archivo; cuanto más estrecho, menos fotogramas necesitarán para que gire lentamente. Según estos ejemplos: para la misma velocidad, Si un simétrico de 90 grados usa 16 fotogramas para girar en un bucle perfecto, El simétrico de 60 grados solo necesitará 12 fotogramas, Y el simétrico de 180 grados necesitará 32 fotogramas. (no se preocupen, no es necesario, solo en caso de que necesiten que el archivo sea un poco más pequeño)

Hagan un diseño simple para el círculo, yo uso la regla simétrica para ayudar con el diseño. Pueden encontrarla en la subherramienta [Regla]; aquí uso una simetría de 8 líneas con la simetría de línea marcada.

Mantengan pulsado [Shift] y arrastren la línea en el centro del lienzo; se ajustará a la alineación vertical, horizontal y de 45 grados del lienzo.

Aquí crearé 2 niveles del círculo de invocación, para que se vea detallado y con más detalles al moverse.

Simplemente dibújenlo en 2 capas separadas.

Para dibujar la runa que quizás no necesite una regla simétrica, pueden ocultar la regla simétrica o deshabilitar la opción "Ajustar a regla especial" en la barra de comandos.

Consejos: intenten mantener su diseño con una forma limpia para que sea fácil crear la tinta vectorial en la cuadrícula. Usar la forma geométrica le dará un aspecto más pulcro. Siguiente paso: dibujaremos la línea vectorial para el diseño. Habiliten la cuadrícula, vayan a [Ver > Cuadrícula].

Luego configuren la cuadrícula con [Ajustes de cuadrícula/regla].

Ajusten la cuadrícula para que coincida con el detalle de su trabajo, dejen un poco de espacio entre las líneas para arrastrar la forma fácilmente.

Reduzcan la opacidad de la capa de tinta y creen una nueva capa vectorial.

Asegúrense de que la opción "Ajustar a cuadrícula" esté activada.

Empiecen con la parte circular; yo uso la herramienta Elipse en la subherramienta [Figura].

Arrastren desde la intersección de la línea de la cuadrícula que toca la parte superior e izquierda del borde del círculo.

El círculo se ajustará a la cuadrícula; arrastren hacia abajo hasta que encaje con la línea del boceto.

Pueden ajustar la cuadrícula más tarde cuando trabajen en detalles más pequeños.

Aquí ajusto la cuadrícula a la forma cuadrada dentro del círculo; pueden ver que la cuadrícula antes del ajuste no se superpone a la línea, por lo que no se podrá dibujar sobre el boceto real.

Usen la herramienta rectángulo o polígono [con la figura de rectángulo] para dibujar la forma cuadrada.

Para otras formas poligonales, pueden seleccionar polígono en la opción de figura y establecer el número de esquinas.

Creen una nueva capa vectorial y dibujen un triángulo de la misma forma en que aparece en el boceto.

Si simplemente dibujamos la forma superpuesta a otra, habrá algún lado de la forma que se superpondrá; aquí la base del triángulo se superpondrá a un lado del cuadrado.

Para evitar las líneas superpuestas, usen la herramienta [Punto de control] en la subherramienta [Corregir línea] con el modo de división para dividir el lado del triángulo.

Luego pueden simplemente eliminar la línea con el modo borrador vectorial en la herramienta borrador.

Aquí está la técnica que uso para la rotación de partes, ya que Clip Studio aún no proporciona la función para mover y ajustar objetos a la cuadrícula (y quiero hacerlo como tinta de capa vectorial, así que les enseñaré cómo hacerlo perfectamente en Clip Studio). Dibujen un círculo en una nueva capa vectorial, cubriendo toda la forma.

Mantengan pulsado [Shift] para seleccionar la capa del triángulo y la capa del círculo azul.

Creen el borde de transformación libre, [Editar > Transformar > Transformación libre] O [Ctrl + T].

Ahora pueden mantener pulsada la tecla [Shift] y girar la forma en la dirección que deseen (en pasos de 45 grados).

Hagan clic en [Aceptar] o presionen [Enter] para confirmar la transformación. Con este método, pueden girar fácilmente todo alrededor del centro de rotación. Copien la capa y repitan los pasos; pueden usar el mismo círculo azul para todas las partes.

Cuando terminen, fusionen las capas, pero no fusionen el círculo azul con la forma finalizada, para que podamos usarlo para la rotación de otras partes.

Para la forma de luna, dibujo 2 círculos superpuestos y borro la parte no deseada. [¡Importante!] ¡La simetría de la forma debe estar alineada solo con una línea de cuadrícula que se proyecte desde el centro de rotación!

Puede que vean que su tamaño es demasiado grande para el boceto que hicimos. Creen una transformación libre para escalarlo.

[¡Importante!] NO escalen la imagen haciendo clic y arrastrando (porque no se ajustará a la cuadrícula); deben establecer la relación de escala solo en el panel de propiedades de la herramienta (asegúrense de tener marcada la opción [mantener relación de aspecto]).

Mantengan pulsado [Ctrl] y usen la tecla [↓] (tecla de flecha hacia abajo en el teclado) para mover la forma a su posición (también pueden moverla con la herramienta [mover] y manteniendo pulsado Shift para mantenerla alineada).

Asegúrense de que su dibujo siga dentro del círculo azul.

Repitan los mismos pasos que hicimos con las partes del triángulo.

Para alguna parte que no pueda girar con pasos de 45 grados, establezcan el ángulo de rotación en las propiedades de la herramienta (aquí estoy moviendo el +).

Uso 25 grados para un lado y -25 grados para el otro.

Luego fusiono las capas y las muevo como otras partes; con este método, no necesitan calcular todos los ángulos de rotación para cada objeto. También pueden voltearlo para colocarlo en el otro lado.

La estrella se hace así.

Cuando terminen, fusionen todo en una capa y borren la parte no deseada.

El círculo de invocación interior está terminado.

Dibujen el círculo exterior con el mismo método (para la runa, deshabiliten el ajuste a la cuadrícula y simplemente escríbanla dentro).

Si quieren cambiar el grosor de la tinta, pueden usar la herramienta objeto.

Mantengan pulsada la tecla [shift] para seleccionar varias partes vectoriales.

Y en las propiedades de la herramienta, pueden ajustar el tamaño del pincel.

El círculo de invocación está listo.

Parte 2: Aplicar el círculo de invocación a la ilustración

En esta parte, añadiré el círculo de invocación en movimiento a la ilustración que hice.

Preparen el archivo para importar. [Clic derecho en la capa > Objeto de archivo > Convertir capa a objeto de archivo].

Convertir con área de dibujo.

Con este método, guardarán fácilmente el archivo con fondo transparente y bien recortado sin cambios en el centro de rotación.

Ahora es el momento de animarlo. Abran el archivo y añadan más desplazamiento a la imagen yendo a [editar > cambiar tamaño del lienzo].

Añadan algunos píxeles a ambas dimensiones del lienzo.

Necesitamos crear un desplazamiento para hacer una versión borrosa del círculo y usarla como efecto de luz para el círculo de invocación. Copien la capa y rasterícenla.

Luego usen el filtro [Desenfoque gaussiano].

Ajusten la intensidad para crear el efecto de luz suave.

Luego apliquen el movimiento de rotación al círculo y a la capa de efectos; usaré la función de fotogramas clave de capa para ayudar con la transformación. Creen una nueva línea de tiempo con una velocidad de fotogramas de 8 fps (para ilustrador animado).

Seleccionen ambas capas y activen el fotograma clave de capa.

Seleccionen el primer fotograma y hagan clic en el icono de crear fotograma clave [Interpolación lineal] (aparecerá en verde).

También creen un fotograma clave al final de la línea de tiempo.

Seleccionen el dibujo con la herramienta [objeto] en el último fotograma, ajusten el ángulo de rotación en el panel de propiedades de la herramienta a 360.

Nota: deben seleccionar solo una capa para editar el valor. Arrastren el último fotograma clave al final de la línea de tiempo para eliminar el espacio de detención del bucle.

Obtendrán el círculo de rotación perfecto (el círculo de invocación girará 360 grados en 24 fotogramas).

Si el círculo se mueve demasiado rápido, pueden insertar más fotogramas para que se mueva más lento. Hagan clic derecho en la línea de tiempo e [insertar fotograma].

Establezcan la cantidad de fotogramas que desean añadir.

Ahora el círculo de invocación rotará 360 grados en 72 fotogramas.

Guarden el archivo en 2 archivos: la línea de tinta y la línea de efecto de desenfoque. Eliminen la capa de efecto y guarden el archivo.

Luego [Ctrl+Z] para deshacer, eliminen la capa de tinta y usen [Guardar como] para guardar en otro archivo.

Repitan el paso también con el círculo interior. Cambié el ángulo de rotación al círculo interior porque es simétrico de 90 grados. Así que, en lugar de empezar desde 0 y girar a 360 en 72 fotogramas como el círculo exterior, empecé desde 180 y giré a 0 en 72 fotogramas (solo gira media vuelta cuando el exterior gira una vuelta completa). Círculo exterior (gira una vuelta completa en sentido horario 0 >> 360 grados).

Círculo interior (gira media vuelta en sentido antihorario 180 >> 0 grados).

Rotará en un bucle perfecto como este.

Tendremos 4 archivos.

Aplíquenlo al ilustrador, creen la nueva línea de tiempo con la misma configuración de velocidad de fotogramas que el archivo del círculo.

Luego importen el círculo y el efecto al lienzo con [Archivo > Importar > Crear objeto de archivo].

Importen todo seleccionando varios archivos.

Seleccionen todas las capas del círculo y usen la [Herramienta Mover] para moverlas juntas.

Usen la transformación libre [Ctrl+T] para ajustar el tamaño.

Establezcan el modo de fusión del objeto de efecto en [Añadir (Brillo)] para crear el efecto de luz.

Para recolorear el círculo, usen el color de capa para el efecto; pueden hacer clic en este icono o en el panel de propiedades de la capa.

Seleccionen un color y hagan clic en el cubo para aplicarlo en la barra.

Añadan más luz creando una nueva capa en modo brillo por encima de todas las capas del círculo. Y pinten la luz extra con un aerógrafo suave.

Añadan también un efecto de luz sobre el personaje copiando el efecto del círculo exterior y moviéndolo sobre el personaje.

Recorten el efecto de luz al personaje para que no se filtre al fondo.

Para hacerlo más natural, creen una nueva capa y pinten el área de luz con un aerógrafo suave.

Creen una selección haciendo clic derecho > Selección desde capa > Crear selección (o mantengan pulsado [Ctrl] y hagan clic en la miniatura de la capa).

Luego hagan clic derecho en la capa de efecto y [Máscara de capa > Máscara fuera de selección].

Oculten (o eliminen) la capa del aerógrafo (ya no la necesitamos).

Resultado

Parte 3: Aplicar una transición al círculo de invocación

Lo haré flotar y girar en el aire para mi escena, así.

También desplacen un poco la posición para darle un aspecto más dimensional.

Para la escena de animación, también añadiré la transición para que aparezca en el momento adecuado de la línea de tiempo.

Empiecen creando la escena de animación.

Pueden estudiar cómo hacer animación fotograma a fotograma con capas vectoriales en el episodio anterior de mi tutorial.

Preparen los archivos (.clip) por separado; aquí usaré una velocidad de fotogramas de 24 fotogramas por segundo. Asegúrense de que todos los archivos tengan la misma velocidad de fotogramas.

Creen un nuevo archivo para la escena. Usaré el preajuste de película y estableceré la velocidad de fotogramas en 24 fotogramas por segundo.

Importen todos los archivos de objeto al lienzo [Archivo > Importar > Crear objeto de archivo].

Consejos: Seleccionen el fotograma donde se supone que debe aparecer el objeto (círculo de invocación); cuando importen el objeto, aparecerá en esa posición de la línea de tiempo.

Seleccionen todos los objetos, creen una transformación libre y colóquenlos en la posición donde deben aparecer en la línea de tiempo.

Establezcan el color del papel para ver el efecto más claramente mientras trabajan en él.

Apliquen el efecto de capa y el color a las capas de objeto (igual que hicimos en la parte anterior del tutorial).

Añadan el movimiento de transición al círculo para animarlo con la escena, activen el fotograma clave de capa para los objetos del círculo de invocación.

Hay un hueco donde el personaje lanza el efecto de invocación.

Creen un fotograma clave de interpolación suave en ese punto para cada círculo; será el punto final de la transición del efecto.

Muevan un poco el círculo interior con la herramienta [Objeto].

Pueden copiar el fotograma clave y pegarlo en otro objeto; copiará la propiedad de posición del fotograma clave. Así no necesitarán moverlo con cuidado.

El círculo interior aparecerá antes, así que creo otro fotograma clave antes del punto final.

En el fotograma donde el círculo comienza a aparecer, escálenlo a un tamaño pequeño.

También ajusten la opacidad en ese punto.

En la línea de tiempo, pueden mostrar la línea de tiempo para la opacidad haciendo clic en el icono [+].

También pueden copiar y pegar.

Repitan los pasos con el círculo exterior, desplacen el fotograma clave un poco hacia atrás para que aparezca después del primer círculo.

Para el efecto de luz, pinten en la capa con el modo añadir (brillo).

También ajusten la opacidad para que coincida con la transformación de los círculos.

Nota: Hago la superposición de luz por separado para el círculo exterior y el círculo interior. Aumenten la opacidad de la capa de luz en el punto final de la transformación como efecto de lanzamiento finalizado.

También apliquen la luz en el personaje creando una nueva capa con modo añadir (brillo) encima del objeto del personaje. Pinten la luz y recorten al objeto del personaje.

Varien el nivel de opacidad según el tiempo de la animación.

La magia sucedió.

Parte extra: Efecto adicional para la transformación

Aquí está el renderizado final de la escena, con el efecto de cámara y el efecto de transformación de luz.

Los efectos se crean con el método de animación fotograma a fotograma. Creen una nueva carpeta de animación y un mapeo de fotograma clave en blanco al fotograma clave del objeto (se puede mapear perfectamente porque la escena y el objeto tienen la misma velocidad de fotogramas).

Creen una selección del objeto del personaje.

Expandan el área de selección.

Y rellenen de color el primer fotograma clave en la carpeta de animación.

Desseleccionen el objeto [Ctrl+D] y apliquen el filtro de desenfoque.

Coloquen la capa en una carpeta arrastrándola al icono de carpeta.

Hagan la selección del personaje de nuevo y rellenen el color en una nueva capa.

Luego bloqueen la transparencia de la capa de desenfoque y rellenen con el color de luz.

Repitan los pasos con otros fotogramas clave.

También apliquen el fotograma de visualización relacionado con el objeto.

Y activen el fotograma clave de capa y ajusten la opacidad al objeto.

Configurar la carpeta en modo añadir (brillo) ¡hará que parezca más encantador!

Para el efecto de luz adicional: creen una nueva carpeta de animación y dibujen el efecto de luz con la herramienta pluma.

Consejos: Añado partículas con un aerógrafo de gotas.

Aplico el efecto también en la animación de transformación.

Pueden usar el método de acción automática para ahorrar tiempo en la tarea de los fotogramas clave, consulten el tutorial de Mattlamp:

Pueden usar la carpeta de animación para pintar también los detalles de resaltado adicionales en el objeto.

Añado el efecto de cámara para que se mueva con el efecto del círculo de invocación.

Coloquen todas las capas en la carpeta de cámara 2D.

Giren la cámara con la herramienta objeto en el punto de la línea de tiempo donde ocurre el efecto.

El fotograma clave aparecerá automáticamente en la línea de tiempo.

Giren la cámara aleatoriamente en la línea de tiempo para crear un temblor de cámara.

¡¡Y aquí está el resultado final!!

Espero que mi tutorial les dé algunas ideas sobre cómo trabajar con el efecto mágico para su proyecto. ¡Que tengan un buen día! ¡¡Feliz animación!! <3