Transcripciones
1. Lección 1: Un mapa animado no solo
muestra dónde está algo. Muestra por qué importa. animación dinámica de mapas
ayuda a tu audiencia comprender
instantáneamente la
ubicación, la escala, el movimiento y la historia, ya sea que estés
dividiendo una ciudad, resaltando una región o haciendo
zoom en un solo punto de referencia Una
animación de mapa bien diseñada agrega claridad, profundidad y mucha
credibilidad visual a tu video. Mi nombre es Niel Wag.
Soy editor de video y diseñador de motion graphics. A lo largo de los años, he utilizado animaciones de
mapas en
películas de clientes, explicadores de ciudades y blogs de viajes
para dar al público una comprensión más amplia
del mundo en la pantalla En esta clase, estamos llevando animación de
mapas un paso más allá. Aprenderás a crear una secuencia
geográfica
completa de estilo documental, del tipo que ves en explicadores
premium y videos de YouTube bien
producidos Comenzaremos con
Google Studio para construir un movimiento de
cámara cinematográfico limpio, luego pasaremos
a los efectos
Adobe After para agregar
resaltados de región, mapas vectoriales, elementos de
texto, modos de fusión y detalles pulidos que hacen que la animación sea verdaderamente
profesional Este flujo de trabajo
elevará instantáneamente tu narración. Al final de esta clase,
podrás crear animaciones de mapas cinematográficos
pulidos que dan vida a
tus historias y ayudan a tu audiencia a ver el
mundo de la manera que tú
2. Lección 2 : Estoy muy feliz de darle la
bienvenida en esta clase. Hay tantas herramientas de
animación de mapas por ahí, pero la mayoría de ellas son muy difíciles de aprender o muy caras. Entonces en esta clase, vamos
a utilizar Google Art Studio, una herramienta de
animación gratuita basada en navegador. No tiene que instalar
nada, solo solicita acceso y generalmente obtiene su
aprobación dentro de las 24 horas. Odd Studio nos da
muchas formas de crear, personalizar y exportar
hermosas animaciones de mapas. En esta clase,
vamos a construir juntos la animación completa
del
mapa de la Región de Tokio. Este es el mismo estilo visual que estoy usando para mi video
reciente de YouTube, y obtendrás el diseño
exacto del mapa como un archivo editable de Illustrator Esta clase se inclina más hacia la animación de mapas intermedia a
avanzada. Si quieres un
paseo completo por Google
Out Studio Basics, definitivamente echa un vistazo a mi
primera clase donde
desglose los fundamentos de la
animación de mapas paso a paso. Así que prepara tus herramientas y comencemos a crear tu animación de mapa de
estilo documental.
3. Lección 3: En esta lección, configuraremos nuestro proyecto en el estudio
Google Earth y construiremos la ruta de la cámara principal para nuestra animación de
mapas de la región de Tokio. Esta será la columna vertebral de todo lo que hagamos más adelante
en After Effects. Abramos Earthstudio
yendo a earthggle.com SlashTdu Verás algunas opciones. Puedes crear un nuevo proyecto, abrir uno antiguo o navegar por
las plantillas de QuickStart Para esta clase, no
tocaremos los arranques rápidos. Por ahora, simplemente
haz clic en Proyecto en blanco. Aparecerá un conjunto de
ventanas del proyecto. Dale un nombre a tu proyecto. La mía es la región de Tokio
para esta demostración, pero siéntete libre de nombrarla después la ciudad o país
que estarás animando Te darás cuenta aquí, Earth Studio también te permite elegir
luna y Marte, lo cual es adorable,
pero como aún no tenemos mapas
regionales de Marte,
sigámonos a la Tierra. A continuación, establezca sus dimensiones de
composición. Si tu relación
de aspecto está bloqueada con respecto al proyecto anterior, desbloquéala y cambia
a 1920 por 1080, lo que es ideal para la animación documental al
estilo YouTube. Bajo duración,
elegiré código de tiempo en lugar de fotogramas y lo configuraré
alrededor de 30 segundos. Siempre puedes recortar más tarde, pero darte espacio ayuda a
evitar dolores de cabeza de edición. Mantengamos la
velocidad de fotogramas en 30 fotogramas por segundo y luego hagamos clic en Inicio. Ahora aquí, verás dos
pantallas de previsualización diferentes en la parte superior. Estas se llaman ventanas gráficas
en Google Earth Studio. La ventana gráfica izquierda
muestra el punto de seguimiento, el punto de interés de
tu cámara Piense en ello como el ancla, la cámara siempre
girará alrededor La ventana gráfica derecha muestra
la vista final de la cámara. Esto es exactamente lo
que verás en tu render. Esta configuración dual es extremadamente útil para controlar el
movimiento de la cámara con precisión, especialmente cuando estás creando transiciones de mapa
suaves. Debajo de eso está su
línea de tiempo donde vivirán
todos sus atributos y
fotogramas clave Cada movimiento de la cámara,
incluyendo ubicación, altitud, rotación se
puede animar aquí. También notarás que existe este botón llamado
Agregar atributos en el que puedes
encontrar más atributos que puedes animar dentro de
Google Earth Studio Mantendremos las cosas simples
en esta clase ya que la mayor parte de nuestro trabajo de diseño sucederá más adelante en Arabia Afterefacts Busquemos nuestra ubicación en la barra de búsqueda
en el tipo superior Tokyo y Earth Studio
saltará directamente a la ciudad. Ajustaré mi vista hasta que
la región que quiero
resaltar esté centrada. Puedes hacer zoom, inclinar o ajustar la altitud
hasta que se sienta bien. Ahora elige dónde
quieres que se siente este momento en tu línea de tiempo. Estoy colocando mi cabeza lectora
alrededor de 12 segundos, que actúa como el
ancla central de mi animación Una vez que la
vista de la cámara sea exactamente como desea, haga clic en Agregar fotograma clave Esto se bloquea en la posición
actual de la cámara. Lo que voy a hacer ahora es mover mi cabeza lectora hacia adelante
a alrededor de 8 segundos. Entonces elevaré un poco la
altitud. Cuando retoquemos esto,
verás un zoom lento y limpio hacia Tokio. Estos fotogramas clave
se convertirán en la base de la animación de mapa que refinamos
dentro de los efectos posteriores Pasemos a construir
el resto de la moción. Ahora que nuestros dos primeros
fotogramas clave están establecidos, sigamos dando forma
al movimiento completo de la cámara Voy a mover mi cabeza lectora
a alrededor de 16 segundos. Y en una barra de búsqueda
tipo Palacio Imperial. Esta ubicación es importante para nuestro
trabajo después de los efectos posteriores porque el Palacio Imperial se convierte en el punto héroe de nuestra secuencia. Así que piensa en esto como
el momento en
el que la cámara finalmente se acerca
al corazón de Tokio Esta vista es un poco
demasiado Zoom dens, así que voy a ajustar
la altitud hasta que pueda ver toda la zona del Palacio
Imperial. Er Studio ya nos ha creado
el fotograma clave así que
no necesitamos seguir haciendo clic en fotograma clave una y otra vez
cuando hagamos el movimiento Voy a crear
el mismo Zoom suave aquí que usamos
para la ciudad de Tokio. Esto le dará a nuestra
audiencia un poco de tiempo para entender lo que está sucediendo
en la animación del mapa, y tampoco se
verá demasiado estática. Ahora, veamos la
animación hasta el momento. Nos acercamos a la región
más amplia de Tokio, directamente al Palacio
Imperial. Esto se siente genial, pero
los espectadores aún no saben dónde estamos a menos que les
enseñemos el panorama más amplio. Entonces, retrocedamos y
establezcamos el país. Retrocede unos segundos
en tu línea de tiempo con el cabezal de reproducción y
busquemos Japón Odd Studio se alejará
para mostrar todo el país. Voy a replantear Japón, así que se sienta muy bien en el
centro de mi ventana gráfica Observe cómo solo está posicionando la cámara con
fotogramas clave, no paneo o inclinación Es porque no estamos
rotando la cámara, solo moviéndonos suavemente
por el camino. Ahora muévete un poco antes
en la línea de tiempo con el cabezal de reproducción y
aléjate aún más Lo suficientemente lejos como para que la cámara
revele el contexto global. Siempre es agradable dar a los espectadores una idea de dónde comienza
el viaje. Estoy retrocediendo lo suficiente para mostrar una porción de Asia y Europa antes de que la cámara comience
su viaje hacia Japón. Creo que voy a
hacer los
fotogramas clave de Tokio y Palacio
Imperial un poco más cortos. Ya que hemos hecho mucho
trabajo en nuestro proyecto, vamos a guardarlo para que no
tengamos que preocuparnos por perder
nada hasta ahora. Puede presionar Controles o
ir al archivo y luego guardar. Aparecerá un pop up
pidiéndote que
pongas nombre a tu proyecto y
elijas dónde guardarlo. Puedes cambiar la ubicación o incluso crear una nueva
carpeta si quieres. Pero aquí dentro,
sólo voy a guardar el mío dentro de mi carpeta principal de
proyectos. Tu proyecto se
guardará en la Nube, para que puedas
volver a él en cualquier momento. Vamos a reproducir
el camino completo ahora. Revelamos Japón,
acercamos a Tokio, sostenemos brevemente para resaltar
todas las regiones, y luego empujamos
al Palacio Imperial para el primer plano final. Ahora tienes el movimiento de
cámara completo desde la visión global hasta el Tokio
y el Palacio Imperial, listo para usar en tu animación. En la siguiente lección,
agregaremos puntos de seguimiento para que podamos adjuntar etiquetas y gráficos perfectamente en los artefactos de
Adobe
4. Lección 4: Ahora hagamos que esta animación utilizable en Adobe After Effects. Necesitamos crear puntos de
seguimiento en Google Studio para que
podamos adjuntar gráficos, textos y pines a la ubicación
exacta más adelante. Piense en los puntos de seguimiento como los anclajes que mantienen sus
gráficos pegados al mapa, incluso cuando la cámara está en movimiento Como esta no es una animación de
tres D, sólo
voy a
crear un Trackpoint Vayamos al punto
en nuestra línea de tiempo con nuestro cabezal de reproducción que está haciendo zoom
en el Palacio Imperial Una vez que estés justo encima
del Palacio Imperial, haz clic
derecho en el palacio
y elige establecer Track Point. O Studio creará instantáneamente un punto de pista para
esa ubicación exacta. Voy a renombrar esto y eliminar esa que está delante
del Track Point. Esto actuará como
ancla para cualquier etiqueta,
resaltado o gráfico que agreguemos
más adelante en los efectos posteriores. Ahora estamos listos para renderizar. Haga clic en el
botón de renderizado grande en la parte superior. Verá aparecer el panel de
configuración de renderizado, junto con una vista previa
de su animación. Elige tu carpeta de salida, mantén el nombre tal cual o
modifícalo si lo prefieres y haz clic en Permitir cuando tu navegador te pida
permiso para guardar archivos. Un estudio te da dos
formas principales de exportar tu trabajo. La opción uno es renderizar como video. Usa esto solo si quieres la
animación exactamente como está. Sin efectos posteriores, sin gráficos
adicionales, solo algo rápido para mostrar a
alguien o subir directamente. La opción dos es renderizar
como secuencia de imágenes. Esta es la opción que necesitamos. Las secuencias de imágenes le darán la más alta calidad,
el mayor control
y, lo más importante,
la capacidad de llevar
la animación a los efectos posteriores
con datos de seguimiento completos. Así que adelante y cambia tu tipo de render
a secuencia de imágenes. La dimensión ya debería
coincidir con la configuración de tu proyecto. Para el rango de fotogramas,
estoy seleccionando de cero a 600 fotogramas porque mi secuencia
tiene alrededor de 20 segundos de duración. Puedes ajustar esto
en función de tu propia línea de tiempo. A continuación, verá la configuración de
atribución. Google Art Studio requiere que incluyas
su atribución, pero puedes posicionarla para que no interfiera
con tu animación Estoy colocando el mío en la esquina
inferior izquierda. También puedes simplemente arrastrar el logotipo de Google Earth
si eso es más fácil, y el texto se colocará ordenadamente
a lo largo del borde inferior. Además, asegúrate de que tu alineación de texto
coincida con tu ubicación. Si tu atribución se encuentra a la izquierda, elige la alineación izquierda Si lo mueve hacia la
derecha, cámbielo a la derecha. Debajo de eso, verá la
opción 43d datos de seguimiento. Seleccione después de los efectos
porque
estaremos importando todo esto
a los efectos posteriores a continuación. Para el espacio de coordenadas,
manténgalo en global. Esto mantiene los
datos de seguimiento estables y predecibles una vez que comenzamos a
construir los gráficos en la parte superior. También puedes elegir el estilo de mapa. La exploración agrega importantes
caminos y puntos de interés. Y cuando eliges todo, también
puedes ver
negocios locales. Clean te brinda una capa base simple y
sin obstrucciones, perfecta para
imágenes documentales porque luego
agregaremos nuestras propias etiquetas
y Como no necesitamos ningún desorden, mantén el estilo del mapa establecido para limpiar. Por último, la calidad de la textura.
Puedes usar normal, pero te recomiendo encarecidamente alto, sobre todo si la
animación va a entrar en un documental o un video
pulido de YouTube. Hace una
diferencia notable. Una vez que todo esté
configurado, haga clic en Inicio. O Studio podría
preguntarte si quieres guardar los cambios, presionar guardar y comenzará el
renderizado. Una cosa importante
a recordar es no cambiar las pestañas ni cerrar el navegador
mientras se está renderizando. O Studio hace una pausa en
el renderizado en el momento en que haces clic, así que mantén la pestaña activa hasta que la secuencia
termine de exportar Genial. Ahora, su ubicación principal tiene un punto de pista adjunto, lo que significa que después de
efectos
sabe exactamente dónde está el punto
en el espacio tres D. En la siguiente lección,
importaremos toda
esta configuración
a los
efectos Adobe After y comenzaremos a
convertirla en una animación de mapa hermosa y
pulida.
5. Lección 5: Es hora de llevar todo
a los efectos posteriores. Aquí es donde pasamos del movimiento de la cámara de
rock a un verdadero entorno de diseño donde controlamos
todos los aspectos visuales. Lo que voy a hacer es ir
a File Run script file. Voy a buscar mi carpeta
Región de Tokio y seleccionar el archivo punto GSX que
Earth Studio ha exportado Da clic en Abrir y
tan pronto como lo abras, after effects creará
automáticamente una nueva composición con tu
movimiento completo de cámara, cámara tres D, y los objetos nulos vinculados
al punto de pista que creamos anteriormente y
la capa de texto para Tokio. Ahora que el mapa principal se
importa a mi proyecto, también
necesito traer el mapa vectorial de
Illustrator que estaremos animando Puedes descargarla desde la sección de recursos
del proyecto. Vamos al panel Proyecto, haga clic
derecho y elija
Importar, luego archivo. Seleccione el
archivo de Illustrator que descargó de los recursos de su
clase. Haz clic en Importar y
serás recibido con este pop up. Esta ventana nos pregunta qué
tipo de importación queremos. Metraje o composición. No queremos
metraje porque eso fusionaría todo
en una capa, y necesitamos cada capa separada para que
podamos animarla Selecciona la composición
y haz clic en Bien. Abramos esta nueva composición
vectorial. Podemos ver todas las capas de la
región aquí. Estas capas son rasterizadas sólo a su resolución
actual, lo que significa que si cambiamos las dimensiones, se
pixelarán Queremos capas vectoriales que se mantengan nítidas sin importar lo
cerca que se acerque la cámara. Para solucionarlo, selecciona todas las
capas manteniendo pulsada la tecla Mayús, haz clic
derecho sobre ellas
y elige Crear. Verás algunas opciones aquí. Seleccione crear formas
a partir de la capa vectorial. Voy a mantener
todas estas capas seleccionadas y luego moverlas arriba en mi línea de tiempo para que
permanezcan agrupadas. Notarás que todas
nuestras viejas capas de ilustrador ahora
están ocultas debajo. Como ya no necesitamos esas capas
originales, seleccionaré todas manteniendo
presionada la tecla Mayús y luego presionaré Eliminar. Ahora, como puedes ver,
después de que los efectos generaran capas de forma infinitamente
escalables
limpias Volvamos a nuestra composición principal
o de estudio. Voy a colocar mi
cabeza de reproducción donde la ciudad de Tokio sea claramente visible en
mi comp de mapa principal Quiero ocultar la
capa de texto por un momento. Haga clic en el pequeño icono del
globo ocular en el lado izquierdo de la
capa en la línea de tiempo Esto desactiva su
visibilidad por ahora, pero puedes
volver a hacer clic en el globo ocular en cualquier momento para
recuperar el texto Ahora, arrastre su composición de capa de
forma vectorial sobre el texto de Tokio en
la línea de tiempo y coloque esta capa donde está
nuestro cabezal de reproducción También necesitamos convertir esta capa vectorial
en tres capas D. Para ello, da clic en el icono del pequeño cubo
junto a la capa. Necesita existir en el
mismo espacio tres D que la cámara Earth Studio para
que el rastreo funcione correctamente. Ahora necesitaremos padre esta columna al objeto nulo Track
point. Dado que este nulo fue creado
por Google Earth Studio y mantiene la posición exacta de
tres D de Tokio, una vez que vinculemos nuestro mapa
vectorial a él, el mapa se moverá
perfectamente con la cámara. Para ello, busque la
columna padre y enlace en la línea de tiempo. Si no lo ves, solo tienes que alternar los interruptores en la
parte inferior hasta que aparezca. En la capa vectorial, toma este pequeño ícono de látigo de pico y arrástralo directamente a la capa
Tokyo Null Object También puedes usar el
menú desplegable para esto. El comp ahora está parentado, pero parece que ha
desaparecido. Eso es normal. En realidad, es
extremadamente pequeña relación con la escala del entorno de estudio de
la Tierra. Para arreglar esto, voy a abrir mi
configuración de comp vectorial. En el lado izquierdo de la capa, verás una pequeña flecha que expande todos los atributos
que podemos cambiar. Voy a hacer clic en eso para
alternarlo hacia abajo. Luego abre también la
sección de transformación. Aquí ya puedes
ver el problema. Los valores de posición y
orientación del punto de anclaje valores de posición y
orientación del punto de coinciden y nada
se establece en cero Entonces lo primero que voy a hacer es poner la posición a todos los ceros Y luego establecer todos los valores de
orientación en 02. Ahora la comp sigue siendo pequeña, pero al menos está centrada, que es exactamente lo que queremos. A partir de aquí,
simplemente puedo escalarlo
hasta que se haga
visible y luego usar los controles de posición
para alinearlo hasta que se asiente cómodamente sobre
el centro de Tokio. La belleza de
convertirlo en
capas de forma es que puedes
escalarlo tanto como quieras, y se mantendrá
perfectamente nítido. Volvamos a jugar esta parte. Voy a adelantar
esto un poco, así que será fácil de
animar más tarde Ahora nuestro mapa está colocado, rastreado y listo para la animación
dentro de la región de Tokio.
6. Lección 6: En esta lección,
animaremos nuestro mapa vectorial para que cada distrito encaje
dentro y fuera en una secuencia limpia Esto le da a su audiencia
una comprensión clara de cómo se
divide la ciudad y hace que toda
la región se sienta viva en lugar de estática. Vamos a abrir la composición del
vector. Esto contiene todas las capas de distrito de tu
mapa. Antes de animar
nada, me gusta
organizar las capas del mapa
en una secuencia lógica Quiero comenzar la animación desde la parte inferior del mapa. Primero viene OTA. Después Setageya Sugiaminakano, y el norte de Tokio. Entonces traeré esta sección el
costado, el Tokio Oriental, seguido por la parte más antigua de
la ciudad, y luego finalmente, revelaré el Tokio central
como el punto culminante final. Una vez que las capas estén ordenadas, selecciónelas todas manteniendo
presionada la tecla Mayús y presione T para abrir Opacidad Voy a mover
el cabezal de reproducción a alrededor de la marca de 20 fotogramas y luego crear un fotograma clave aquí alternando
esta parada Dado que todas nuestras
capas están seleccionadas, esto ha creado
fotogramas clave en cada capa Luego retrocede el cabezal de reproducción a aproximadamente diez fotogramas y luego
establece la opacidad Esto creará
un desvanecimiento suave en la animación para cada capa de
distrito. Ahora, volvamos a
la composición principal, coloca tu cabeza de reproducción exactamente donde quieres que empiece
a aparecer el mapa Después haz doble clic
en el mapa vectorial porque el cabezal de reproducción en
ambas composiciones se sincroniza, puedes ver fácilmente dónde aterrizarán
los fade ins
dentro de la animación más grande Así que vamos a secuenciar estas
revelaciones manualmente. A mí me gusta hacer esto a
mano porque da un tiempo
intencional mucho más limpio. El último distrito en aparecer
será el Centro de Tokio. Así que voy a seleccionar ambos fotogramas clave y luego
tirar del segundo hacia adelante, para que se alinee exactamente
con mi cabeza de reproducción Entonces repetiré
el mismo proceso para la vieja capa de Tokio, pero detendré algunos fotogramas antes para crear una
bonita revelación escalonada Voy a seguir haciendo esto
con las siguientes capas, moviendo
ligeramente cada conjunto de fotogramas clave para que aparezcan
uno tras otro A pesar de que OTA es el último
distrito en la pila de Mayer, realidad será el
primero en aparecer en la animación, lo que nos da un flujo limpio de abajo
a arriba a través del mapa Volver a la composición principal, y vamos a previsualizarla. Verás que los distritos de
Tokio
aparecen uno por uno,
limpios y elegantes. Ahora, hagamos que
desaparezcan con el mismo estilo. Ir a composición vectorial. Selecciona todos tus fotogramas clave de
opacidad, cópialos manteniendo presionada
Control y C. Mueve el cabezal de reproducción a donde
quieras que el distrito
comience a desvanecerse Ahora para revertir la secuencia de
salida, el primero en aparecer se convierte en
el primero en desaparecer. Haga clic derecho en Elegir asistente de
fotogramas clave y haga clic en Fotogramas clave
inversos de tiempo Ahora, vamos a previsualizarlo de nuevo. Estos desvanecimientos son un poco
demasiado lentos para lo que quiero. Cuando los distritos se desvanecen, quiero que el movimiento se sienta
más rápido y enérgico. Así que arreglemos eso.
Voy a seleccionar todos estos fotogramas clave y acortar
este espaciado entre Esto mantiene el efecto
de desvanecimiento pero acelera el tiempo general. Revisemos eso en
la composición del mapa. Me encanta la animación, pero ahora mismo todavía se ve un poco plana y un
poco aficionada. Entonces para que se sienta
más pulida, voy a agregar
un modo de fusión. Para ello, iré a la
columna de Mode en la línea de tiempo. Verás que
el modo de fusión está configurado actualmente en normal. Si no ve el panel de
modo en absoluto, simplemente haga clic en los pequeños botones de
alternar en la parte inferior de
la línea de tiempo hasta que aparezcan
las opciones
del modo de fusión. Una vez que el panel de modos esté visible, abriré el
menú desplegable junto a mi capa. Hay muchos
modos de fusión para elegir. Entonces voy a
desplazarme y ver cuál funciona
mejor con el mapa. Algunos de ellos apenas
hacen diferencia y multiplicar hace que todo parezca
demasiado oscuro para mi gusto. Entonces seguiré probando unos cuantos más. superposición ya se ve
bonita porque combina
muy bien el color y agrega profundidad. Pero también voy
a revisar la luz dura. Y en realidad, la luz dura
se ve aún mejor. Ilumina el mapa,
mantiene clara la forma de nuestras
capas vectoriales y ayuda a toda
la animación se sienta
más fuerte y profesional Esto completa nuestra animación
del Distrito de Tokio. En la siguiente lección, vamos a
crear un contorno alrededor del Palacio Imperial
usando los caminos de recorte.
7. Lección 7 : En esta lección, agregaremos un pequeño detalle avanzado que realmente une
la escena. Voy a delinear la
región del Palacio Imperial usando caminos de recorte. Antes de seguir adelante y
hacer cualquier otra animación, quiero guardar este proyecto. Entonces voy a presionar
Control S para guardar o simplemente puedes ir
a Archivo y Guardar. Ahora bien, todo lo que hayamos hecho por mucho se guarda en nuestro ordenador. Ahora vamos a la parte del Palacio
Imperial y creamos una nueva capa de Forma. Haga clic derecho en la
línea de tiempo y vaya a Nuevo y elija Capa de forma. Una vez hecho esto, me aseguro de que
la capa Shape esté realmente seleccionada y luego hago clic en el Pentool desde
la barra de herramientas superior También puedes simplemente presionar
G en tu teclado. En el lado derecho,
verá las propiedades de Pentool, y notará dos
cosas llenar y Para este esquema, no necesito
ningún relleno en absoluto porque
ya usamos la capa sólida antes en el contorno de Tokio, y rellenar esta forma
solo cubriría el mapa. Entonces voy a dar click en
llenar aparece un pequeño menú. Después seleccionaré ninguno. También verás otras
opciones incluyendo el color sólido, pero no necesitamos
nada de eso para este paso. Yo sólo voy a golpear Bien. Entonces haré lo mismo
con los ajustes de trazo. Si su trazo
no está configurado en nada, haga clic en trazo, elija color
sólido y confirme. Esto es lo que crea el contorno visible
en nuestra animación. Después de eso, puedo cambiar el color del trazo a
algo brillante. Escojamos el amarillo
porque quiero que el límite del palacio brille
un poco y realmente se destaque. Haz clic en Bien, y luego voy a ajustar el trazo con un poco. Voy a dibujar cuidadosamente el límite exterior de los terrenos del Palacio
Imperial. No necesito ser perfecto, pero trato de rastrear
la vegetación y
el contorno general para que se
sienta limpio y deliberado Una vez que termine, cierra el camino
para formar un bucle completo. Ahora, vamos a convertir esta capa de
forma en una capa de tres D
golpeando este icono de cubo, luego lo apadreemos al objeto nulo de punto de
pista, tal como hicimos
para el mapa vectorial. Ahora, de repente
vuela fuera de la pantalla. Eso solo significa que las
propiedades de transformación han cambiado. Vamos a ajustarlo para que el camino se asiente
correctamente en el mapa. Voy a abrir las propiedades
de
transformación de la capa de forma haciendo
clic en la pequeña flecha. Y de inmediato,
notará que los valores de
deposición están un
poco por todas partes. Entonces, restablecémoslos
escribiendo cero para todos
los ejes de posición. La orientación
tampoco es correcta, así que voy a golpear cero
en la orientación también. Ahora bien, esto volvió a visibilizar la
forma, pero sigue siendo pequeña y no alineada con la zona del palacio
imperial. Entonces, el siguiente paso es
ajustar el
punto de anclaje y la escala. Pasemos primero a la escala y comencemos a aumentarla lentamente hasta que el contorno sea lo suficientemente
grande como para que coincida con
la región palaciega. No te preocupes por
conseguir que sea perfecto todavía. Siempre podemos
reajustarlo más tarde. Iré al punto de
anclaje y
lo moveré para que el contorno se
desplace hacia su lugar. Esto ayuda a
alinear el camino trazado con el
palacio real en el mapa. Voy a afinar
cada uno de los puntos del camino para que el contorno abrace los terrenos
del palacio mayor precisión
posible Ahora estamos listos para animarlo. Vamos a la
sección de contenido de la capa shape. Aquí, verás un pequeño icono que parece un botón de reproducción. Vamos a hacer clic en eso,
y ahí está. Necesitamos agregar partes de recorte a esta capa de forma para que
podamos animar el contorno Entonces voy a seleccionarlo. Una vez que se hayan
agregado las partes del recorte, giraré hacia abajo por la flecha
para ajustar su configuración Voy a mover mi cabeza de reproducción
al momento en que la cámara haya llegado por completo
al Palacio Imperial Aquí es donde debería comenzar la
animación de contorno. En ese marco, haga clic en
el cronómetro. Puedo escribir junto al
valor inicial para hacer un fotograma clave, luego establecer el valor en 100 Voy a
avanzar unos segundos y cambiar el valor a cero. Al previsualizar esto, el contorno
se dibuja lentamente alrededor del Palacio Imperial casi como si alguien
lo estuviera rastreando para el público. Se siente muy de
estilo documental y agrega un
momento guía un poco agradable para el público. Quiero que el trazo se
vea visualmente suave, así que vamos a refinarlo un poco. Iré a la capa de forma y debajo del contenido,
seleccionaré la forma uno. Aquí podrás ver las propiedades de la
forma, incluyendo el
color del trazo y el ancho del trazo. También notarás
dos
configuraciones muy importantes de límite de línea y unión de línea. Estos controlan cómo se ven los extremos
y esquinas de una línea. Pueden ser afilados, planos
o bien redondeados. Para esta animación, quiero que todo se sienta
suave y terso. Entonces voy a establecer tanto el límite de línea como
la unión de
línea para redondear. Para que este esquema
se vea aún mejor, voy a agregar un efecto de brillo
suave, lo
suficiente para que el palacio
imperial destaque sutilmente sin sobrecargar
el resto del mapa Comenzaré seleccionando
la capa de forma, luego yendo al panel de efectos y
presets a la derecha En la barra de búsqueda,
escribiré glow. Y cuando aparezca, simplemente
arrastraré el efecto de resplandor a
la capa de forma. Ahora se ve bastante duro por
defecto, así que vamos a ablandarlo. Voy a
bajar
la intensidad del resplandor y aumentar suavemente
el radio de resplandor. Esto extiende el resplandor hacia fuera, haciéndolo más de un punto culminante
suave en
lugar del brillante contorno de neón.
Vamos a jugar esto de nuevo. Este esquema simple le dará a su audiencia un marco
claro alrededor del hito y hará que el
zoom final se sienta intencional.
8. Lección 8: Ahora que ya está hecha nuestra animación Outline para Palacio Imperial, quiero agregar un título que diga
claramente a los espectadores
cuál es esta ubicación. Ya tenemos una capa de texto
que fue
creada automáticamente por Google Earth
Studio para el Track Point. Sólo vamos a usar esto. Voy a mover
esta capa de texto un poco más arriba en la línea de tiempo para que
sea más fácil trabajar con ella. Ya está en
el espacio tres D y ya se aparentó
al punto de pista Así que no tenemos que
preocuparnos por vincular nada de nuevo. Ahora mismo, el texto está oculto, así que lo voy a mostrar haciendo clic en el pequeño icono del globo ocular
junto a la capa Tan pronto como aparezca, notarás que es demasiado grande para el área del
Palacio Imperial. Para solucionarlo, seleccionaré
la capa de texto Track point y abriré sus propiedades
de texto desde el panel de la derecha. El tamaño está establecido en
muy alto por defecto, así que voy a reducirlo
a algo mucho más pequeño. Voy a reposicionar
el texto ligeramente por encima los contornos para que
no se superponga con
la animación de forma Ahora voy a cambiar el texto
mismo para decir Palacio Imperial. Usemos los controles de escala
y posición para colocarlo exactamente
donde yo lo quiero. Ya que está adherida
al punto de la pista, permanecerá perfectamente encerrada al palacio a medida que la cámara se mueva. A continuación, cambiemos
el color de relleno
del texto para que coincida con el
color de nuestro contorno. Haga clic en llenar y luego seleccione esta herramienta cuentagotas y
escogerá exactamente el color correcto Antes de animar el texto, quiero que
sienta que se
levanta detrás del contorno del Palacio
Imperial Para hacer eso, voy a crear una máscara. Con la capa de texto seleccionada, agarraré la herramienta pluma
y dibujaré un límite alrededor del texto y luego seguiré la forma
del contorno del palacio. Esto no tiene que ser perfecto. Solo necesita cubrir
el área de texto para que la animación parezca que está emergiendo de detrás
del límite del palacio. Nos vendría bien un preset aquí, pero quiero que esto
se sienta más manos a la obra. Quiero que entiendas los conceptos básicos de
la animación de texto y no
solo los efectos de gota de dragón. Entonces construyamos esto
paso a paso. Primero, voy a girar hacia abajo esta pequeña flecha
en la capa de texto para abrir sus propiedades Después abriré texto
y verás este pequeño icono que
parece botón de reproducción. Ese es el botón de animar. Aquí es donde todas
las animaciones de texto
comienzan en after effects. Voy a hacer clic en Animate, y de la lista de opciones, voy a elegir posición En cuanto lo hago, After effects crea un
selector de rango para el texto. Esto significa que ahora podemos animar cómo y cuándo se mueve el texto Antes de animar, quiero
alinear esto con
nuestros contornos de palacio Seleccionaré la capa de forma, presionaré para revelar los
fotogramas clave y encontraré el último fotograma clave donde termine de dibujar el
contorno Aquí es exactamente donde quiero que empiece a aparecer
el texto. En este fotograma, volveré a la capa de texto y crearé
un fotograma clave de posición Después moveré el fotograma clave un poco hacia adelante
en la línea de tiempo, solo unos segundos y ajustaré la posición
del texto hacia abajo, modo que se anima
hacia arriba en el lugar Ahora mismo nuestra animación se siente muy lenta,
lo cual no quiero. Así que agarraré este fotograma clave final y lo moveré un poco
antes en la línea de tiempo Eso inmediatamente
acelera las cosas. También voy a ajustar un poco el valor de la
posición para que el texto se asiente
muy bien alrededor del centro Esto se siente mucho más natural. Para suavizar todo, voy hacer clic
derecho en el
último fotograma clave,
ir a Keyframe Assistant
y elegir Ess Ahora voy a abrir el editor de grafos. Esto se llama gráfico de velocidad, y te ayuda a controlar qué tan rápido o qué tan lento se reproduce tu
animación. Quiero que mi texto aparezca
rápidamente al principio
y luego disminuya la velocidad a medida
que se instala en su lugar Déjame mostrarte
cómo configurarlo. Dentro del gráfico de velocidad, verá un pequeño asa
en el último fotograma clave Todo lo que necesito hacer es
agarrar ese asa y arrastrarla suavemente hacia adelante
el primer fotograma clave Al hacer eso,
notarás que la curva empieza a formar una
pequeña forma de montaña. Esta forma le dice a
los efectos posteriores que comiencen la animación rápidamente y luego
faciliten el acabado más lento. Ahora cuando lo presento, el movimiento se siente mucho
más natural y pulido. Para terminar, quiero una sutil sombra de caída solo para separar el texto del contorno
del palacio. Iré a efectos y presets, buscaré sombra, y luego la arrastraré al texto Voy a aumentar la
opacidad y suavidad, para que se vea limpio y cinematográfico Eso es. Nuestra etiqueta Palacio
Imperial ahora se siente bellamente
integrada en el mapa. Estoy muy contenta como ha resultado
esto.
9. Lección 9: sonido es la capa final que da vida a la
animación de mapas. Añadiremos ohs sutiles,
reveladores y ambiente suave que hace que toda la
secuencia se sienta Ahora mismo, voy a
sacar nuestra línea de tiempo para que podamos ver este espacio
debajo de nuestra animación. Aquí es donde
agregaremos los efectos de sonido
porque por el momento, nuestra secuencia de mapas es
completamente silenciosa, y el sonido puede marcar
una gran diferencia en lo inmersiva que se siente tu
animación Entonces esto es lo que voy a hacer. Iré al panel Proyecto, clic
derecho, elija Importar. Archiva y luego abre la carpeta de efectos de sonido incluida en los recursos de tu
clase. Dentro de esa carpeta,
encontrarás algunos clips de audio, cosas como
sonidos de marcador y Hochs Voy a seleccionarlos
todos y dar clic en Importar para que
aparezcan en mi proyecto. Ahora que están aquí,
comencemos con un sonido que agregue un poco de
retroalimentación táctil, el marcador Agarraré uno de los clips
marcadores y lo
arrastraré
directamente a la línea de tiempo, colocándolo en un espacio vacío debajo de todas las capas visuales. En cualquier capa de audio,
notarás un pequeño icono de altavoz. Al hacer clic que silencia el audio, hacer clic de nuevo en él, lo desmuta Esto es genial cuando
quieres revisar tus visuales sin que ningún
sonido te distraiga Si giro hacia abajo por la capa de audio, verás una sección de audio Dentro de eso se encuentran los niveles de audio. Aquí es donde
controlas el volumen. Incluso puedes
fotografiarlo con clave si quieres que los sonidos se desvanezcan o
se desvanezcan con el tiempo Debajo de eso, hay forma de onda. Cuando lo abro, after effects muestra
la onda de audio real. Yo uso esto todo el tiempo
porque la forma de onda es mucho más precisa de lo que
escuchas durante la vista previa. Si algo necesita
golpear exactamente en la animación del contorno
o el movimiento de la cámara, confío en la forma de onda visualmente lugar de confiar
en la reproducción de audio. Aquí hay un atajo realmente útil si selecciono una capa de audio y presiono L, es decir dos veces. After Effects
revela instantáneamente la forma de onda. Al presionar de nuevo LL, lo oculta. Esto me ahorra abrir y cerrar menús por
cada pocos segundos. Ahora notarás que hay cuatro versiones de
este sonido marcador. Pero basado en mi tiempo, el tercero se siente
como el mejor partido para nuestra animación de
esquema del Palacio Imperial. Para eliminar los
tres audios restantes, necesitamos recortarlo. Para ello, pongo
el cursor sobre el inicio de
la capa de audio hasta que veo esas pequeñas flechas
apuntando hacia afuera Eso es después del arreglo
diciéndome ahora que puedo recortar. Arrastraré el borde
hacia adentro para acortar el clip exactamente a la
porción que quiero Yo haré lo mismo
en el otro extremo, así el sonido termina limpiamente. Una vez hecho eso,
voy a arrastrar el clip de audio hacia adelante en
la línea de tiempo para que se
alinee perfectamente con el momento el contorno del París Imperial va a empezar a dibujarse. Vamos a jugar esto de nuevo. Y
sí, esto suena perfecto. Agrega una señal
táctil satisfactoria que
hace que la animación de contorno se sienta intencional y conectada a tierra El sonido del marcador es un
poco fuerte por defecto, así que vamos a suavizarlo. Desactivo las
propiedades de audio de la capa y baje los niveles de audio hasta que se mezcla naturalmente
con la animación. Ese es realmente el flujo de trabajo. Encuentra el momento en el que
algo se mueve, aterriza o revela y empareja con un pequeño efecto de sonido
para darle vida. Voy a repetir
el mismo proceso a toda la línea de tiempo, agregando sutiles clics, Huses o sonidos de
textura donde sea que la
animación lo requiera No es necesario exagerar, espolvorear el sonido donde
sea que mejore el movimiento Con solo unos pocos toques de audio, animación de
tu mapa ahora
se siente diez veces más viva.
10. Lección 10: Ahora que todos los elementos de
nuestra animación están en su lugar, agreguemos un
toque final antes de exportarla. Lo primero que reviso
es el desenfoque de movimiento. Las animaciones de mapas pueden sentirse un poco rígidas si todo está
perfectamente nítido todo el tiempo, especialmente durante los
primeros movimientos o Zooms Para activar el desenfoque de movimiento, voy al
icono de desenfoque de movimiento en la línea de tiempo. Parece que estos tres
pequeños círculos superpuestos. Una vez que haga clic en
eso, activará el desenfoque de movimiento
para todas las capas que lo necesiten haciendo clic el mismo icono en la fila de
cada capa. Ahora, cada vez que algo
se mueve rápidamente en la pantalla, los efectos
posteriores agregarán
automáticamente un sutil desenfoque al movimiento. Esto hace que las animaciones se sientan mucho más
suaves y naturales y
elimina ese aspecto de
recorte rígido que ocurre cuando los objetos se
mueven sin ningún desenfoque El desenfoque de movimiento es un pequeño interruptor, pero agrega una gran cantidad de pulido a la animación
final. Después del desenfoque de movimiento, trabajemos en algunos ajustes de color y
contraste, especialmente sobre el mapa de Tokio. A veces, las imágenes de mapas de estudio
pueden verse un poco planas en comparación con las formas vectoriales
nítidas que hemos agregado en la parte superior Para solucionar esto, selecciona
tu capa de renderizado principal, ve al efecto y luego a la corrección
de color. Selecciona el color lumitar,
y ahora verás su conjunto completo de controles
aparecer en la ventana Controles de efectos Quiero que vayas a la
parte de la línea de tiempo donde ninguna capa vectorial
está bloqueando la vista. Esto hará que sea más fácil
juzgar los cambios de color, luego alternar hacia abajo la corrección
básica. Ahora voy a
ajustar poco a poco algunas cosas. Primero, voy a incrementar
el contraste solo un poco para sacar
más profundidad en el mapa. Entonces voy a agregar un
poquito de saturación, no lo suficiente para que
se vea caricaturesco, sino lo suficiente para que los
colores se sientan más A continuación, volveré a fregar
en la línea de tiempo hasta el momento en
que Japón sea claramente visible. Aquí voy a elevar ligeramente la
exposición. Al instante, el mapa deja de
verse plano y lavado. Se vuelve más brillante, más claro
y mucho más cinematográfico. Realmente se puede ver que
las sombras y reflejos se están
separando muy bien ahora. El mapa se ve un poco
demasiado azul para mi gusto. Voy a
calentarlo moviendo el deslizador de temperatura hacia
un tono ligeramente más cálido. Y así, toda
la escena se siente más equilibrada y natural. Vamos a repasarlo. Y sí,
esto se ve hermoso. Ahora reproduce toda la
secuencia de principio a fin. Este es tu pase final. Busque pequeños temas como texto que aparezca
un marco demasiado pronto, alfileres que se sientan fuera de la esquina o la opacidad se desvanece que
se siente demasiado Ajusta cualquier cosa que
se sienta incluso ligeramente apagada. El objetivo es hacer que toda la
animación se sienta sin esfuerzo, pesar de que pones mucho trabajo detrás
de escena Ahora que nuestra animación
está completa, necesitamos exportarla para que puedas agregarla a
tu documental, publicarla en redes sociales o simplemente compartirla con amigos. Para ello, usaremos
Adobe Media Encoder, lo que nos da mejores presets
y una compresión más limpia Primero, iré al menú de composición
en
la parte superior izquierda
de After effects. Cuando haga clic en él,
veré dos opciones de exportación. Agregar a medios codificar una
Q o agregar a renderizar Q. El método RenderQ es un poco más técnico y
no
tan flexible, así que voy a elegir
Agregar al codificador de medios Q. Una vez que se abra Media Encoder, verá su composición listada con varios
ajustes al lado El formato, el ajuste preestablecido y la ubicación del archivo de salida. Haré clic en el
texto azul debajo del archivo de salida para elegir dónde quiero que se guarde mi video
final. Siguiente bajo formato,
voy a seleccionar h.264, que es perfecto para el tipo de animación de mapa que creamos Ligero, de alta calidad y listo para YouTube o plataformas
sociales. Entonces para el preset, voy a chooe coincidir con la
fuente de alta tasa de bits Esto asegura que exportamos en las mismas dimensiones que
diseñamos y mantiene
la animación nítida. Como nuestro proyecto no
incluye leyendas, voy a anular la selección de las leyendas de
exportación para que Media Encoder no pierda su tiempo de procesamiento en
las cosas que no necesitamos Antes de comenzar la exportación, tomaré la máxima calidad de
render de Estados Unidos para obtener el mejor aspecto final. También me gusta verificar la velocidad de bits bajo la configuración
de video. Por lo general, valora alrededor de
diez a 12 MBPS, perfecto para este
estilo de animación. Luego haz clic en Bien. Después de eso, voy a hacer clic en el
pequeño botón verde Reproducir en la parte superior derecha
del codificador de medios. Cuando esté hecho, tendrás animación cinematográfica
pulida del Mapa de
Tokio completa con revelaciones regionales, movimientos
suaves, un Palacio Imperial
destacado y todos los elementos visuales de
narración
que hacen que las secuencias de mapas documentales se sientan vivas La animación de tu mapa ya está
completa y exportada. Listo para caer en tu
video documental de YouTube o publicación social.
11. Conclusión: Has llegado al
final de esta clase. Si has estado
siguiendo y construyendo tu animación
paso a paso, ahora
deberías tener tu propia animación de mapa de estilo
documental. Estoy muy emocionada por ti. Espero que hayas disfrutado
creándolo
tanto como yo disfruté enseñándolo. Estaré haciendo más
clases así,
así que echa un vistazo a mi perfil de
Skillshare Y si quieres detrás
de escena, consejos, más tutoriales, sígueme
en YouTube e Instagram. Por favor, no olvides compartir tu proyecto final en
la galería de proyectos. Me encantaría ver
lo que has hecho. Tu proyecto también puede inspirar a los
nuevos estudiantes que se unan a
esta clase más tarde. Hemos cubierto
mucho en esta clase. Comenzamos con
Google Earth Studio, aprendiendo a
configurar un proyecto, hacer movimientos de cámara en
puntos de seguimiento y exportar nuestro mapa. Luego nos mudamos a Adobe After Effects
donde agregamos formas, pines, textos, resaltados de
distrito, contornos
avanzados
y pulido de color. Al final, creamos una animación de mapa
cinematográfica limpia que se ve muy bien en documentales, videos de
viajes e incluso contenido de formato
corto He agregado un PDF en la sección de recursos
con atajos útiles, trucos de
after effects para el diseño de
mapas y notas
para el estudio Earth. Siéntete libre de
descargarla y
guardarla contigo a medida que
haces más proyectos. Muchas gracias por
aprender conmigo. Estoy muy orgulloso de
lo lejos que has llegado, y no puedo esperar a ver las animaciones del mapa que creas a continuación. Todo lo mejor, y
te veré en otra clase muy pronto.