1
00:00:04,330 --> 00:00:05,290
‫Hola y bienvenido.

2
00:00:05,290 --> 00:00:10,750
‫En esta lección, vamos a ver cómo podemos usar el gráfico anim de un plano de animación.

3
00:00:10,750 --> 00:00:17,800
‫Este concepto completamente nuevo, un concepto completamente nuevo, para combinar animaciones usando una serie de variables.

4
00:00:17,800 --> 00:00:19,240
‫Como puedes ver, estoy cambiando las variables.

5
00:00:19,240 --> 00:00:21,520
‫Está cambiando la mezcla de animación.

6
00:00:21,730 --> 00:00:23,950
‫Vamos a sumergirnos y ver cómo funciona esto.

7
00:00:25,470 --> 00:00:27,660
‫Así que tenemos algo parecido a la animación aquí.

8
00:00:27,660 --> 00:00:29,930
‫Pero obviamente no es dinámico.

9
00:00:29,940 --> 00:00:31,920
‫No es particularmente interesante.

10
00:00:32,220 --> 00:00:38,610
‫Necesitamos poder hacer animaciones que sean mucho más complicadas que esto, y Unreal tiene muchos sistemas integrados geniales

11
00:00:38,610 --> 00:00:39,900
‫para hacer esto.

12
00:00:40,290 --> 00:00:45,720
‫El principal son los planos de animación, que es un plano, obviamente.

13
00:00:45,720 --> 00:00:51,210
‫Así que no vamos a hacer esto en C++ porque las animaciones simplemente tienen sentido si se hacen en planos.

14
00:00:51,750 --> 00:01:00,420
‫Y el punto principal de los planos de animación es reunir toda la lógica de animación y permitirnos

15
00:01:00,420 --> 00:01:09,090
‫mezclar, fusionar y cambiar entre animaciones de modo que la lógica del juego pueda impulsar ese plano

16
00:01:09,090 --> 00:01:10,230
‫de animación.

17
00:01:10,770 --> 00:01:15,090
‫Entonces, sin más preámbulos, intentemos crear un modelo de animación.

18
00:01:15,100 --> 00:01:17,880
‫Entonces, en el navegador de contenido, puede agregar su clic derecho.

19
00:01:17,880 --> 00:01:23,700
‫Y vamos a ir a animación y seleccionar planos de animación aquí y verán de inmediato que

20
00:01:23,700 --> 00:01:27,750
‫nos está pidiendo que tal vez tengamos una clase para padres.

21
00:01:27,750 --> 00:01:28,800
‫No necesitamos una clase de padres.

22
00:01:28,800 --> 00:01:35,430
‫Podemos usar el valor predeterminado, pero no necesita un esqueleto porque, al igual que las animaciones, como

23
00:01:35,440 --> 00:01:39,540
‫las mallas de andamios, ambas se basan en el esqueleto.

24
00:01:39,540 --> 00:01:44,820
‫También lo hace el modelo de animación, lo que significa que luego puede usar todas las animaciones de ese esqueleto, luego

25
00:01:44,820 --> 00:01:48,180
‫puede usarse en cualquiera de las mallas que se relacionan con ese esqueleto.

26
00:01:49,020 --> 00:01:55,710
‫Ahora, obviamente, queremos el esqueleto de Wraith aquí, así que sigamos y seleccionemos eso y hagamos clic, ¿de acuerdo?

27
00:01:55,710 --> 00:02:00,840
‫Y eso seguirá adelante y creará un modelo de animación basado en el esqueleto de Wraith y luego en

28
00:02:00,840 --> 00:02:02,160
‫la convención de nomenclatura.

29
00:02:02,160 --> 00:02:10,590
‫Comenzamos con un guión bajo BP y voy a llamar a esto simplemente dispara a su personaje básicamente porque tenemos

30
00:02:10,590 --> 00:02:12,030
‫ese prefijo diferente.

31
00:02:12,030 --> 00:02:16,110
‫Creo que está bastante claro que es el modelo de animación para el personaje de la serie.

32
00:02:16,230 --> 00:02:23,730
‫Entonces, si seguimos adelante y abrimos ese plano de animación y lo acoplamos a nuestra ventana principal, entonces veremos un editor

33
00:02:23,730 --> 00:02:29,820
‫de plano de animación, que en muchos aspectos se parece a su editor de plano habitual.

34
00:02:29,820 --> 00:02:35,250
‫Tiene esta área gráfica principal en el medio, pero en cierto modo es diferente.

35
00:02:35,250 --> 00:02:37,560
‫Así que tenemos el área del gráfico que es similar.

36
00:02:37,650 --> 00:02:39,840
‫Este es un gráfico ligeramente diferente a lo que estamos acostumbrados.

37
00:02:39,840 --> 00:02:40,980
‫Se llama gráfico animado.

38
00:02:40,980 --> 00:02:44,550
‫Puede ver que también hay un gráfico de eventos, al igual que su plan normal.

39
00:02:44,550 --> 00:02:47,400
‫Tienen un gráfico de eventos, pero también hay algo llamado gráfico animado.

40
00:02:47,400 --> 00:02:48,480
‫Llegaremos a eso en un segundo.

41
00:02:49,020 --> 00:02:53,640
‫Hay un panel de detalles que le brinda detalles sobre el proyecto de animación.

42
00:02:53,640 --> 00:02:55,440
‫Así que la clase en sí, tienes los detalles.

43
00:02:55,440 --> 00:02:59,430
‫En ese sentido, no tenemos ningún componente contra un modelo de animación.

44
00:02:59,430 --> 00:03:01,050
‫Esa es una diferencia a tener en cuenta.

45
00:03:01,050 --> 00:03:08,200
‫Ya tenemos este editor de vista previa animado, que nos permite hacer algunas cosas con esta ventana de vista previa

46
00:03:08,200 --> 00:03:08,610
‫aquí.

47
00:03:08,610 --> 00:03:10,500
‫Por qué no están más cerca el uno del otro por defecto.

48
00:03:10,500 --> 00:03:11,070
‫No sé.

49
00:03:11,970 --> 00:03:17,760
‫El navegador de activos, al igual que en las animaciones, nos permite mirar a través

50
00:03:18,030 --> 00:03:26,130
‫de las animaciones, traerlas fácilmente a nuestro editor y aquí en la parte superior derecha nuevamente, al igual que las animaciones y las

51
00:03:26,130 --> 00:03:33,660
‫mallas, tenemos esta vista que nos permite cambiar rápidamente entre el esqueleto, el mesh y las animaciones y los planos se

52
00:03:33,660 --> 00:03:35,610
‫basan en el mismo esqueleto.

53
00:03:36,460 --> 00:03:42,520
‫Luego, en la parte inferior izquierda, tenemos mi panel de planos, que es muy parecido a mis planos.

54
00:03:42,520 --> 00:03:47,500
‫En su modelo estándar, tiene sus funciones, sus variables, macros, ese tipo de cosas son las

55
00:03:47,500 --> 00:03:48,040
‫mismas.

56
00:03:48,370 --> 00:03:49,170
‫¿Qué es diferente?

57
00:03:49,180 --> 00:03:50,410
‫Ah, sí, también tenemos los gráficos.

58
00:03:50,410 --> 00:03:51,220
‫Eso también es lo mismo.

59
00:03:51,220 --> 00:03:54,760
‫Pero lo que es diferente son los gráficos de animación y las capas de animación.

60
00:03:55,060 --> 00:03:57,130
‫Ahora realmente no vamos a tocar las capas de animación.

61
00:03:57,130 --> 00:03:59,170
‫Esa es una característica un poco más avanzada que no necesitamos.

62
00:03:59,170 --> 00:04:05,830
‫Pero el gráfico, eso es lo que es muy importante, porque el gráfico es como un plano, excepto que no

63
00:04:06,160 --> 00:04:12,610
‫tenemos una nota de ejecución o tenemos los datos que fluyen a través del gráfico y ¿qué fluye a través

64
00:04:12,610 --> 00:04:13,510
‫del gráfico?

65
00:04:13,510 --> 00:04:19,120
‫Bueno, básicamente, estamos tratando de llegar a esta pose de salida, esta pose de animación de salida en la

66
00:04:19,120 --> 00:04:20,830
‫que debemos modelar nuestro personaje.

67
00:04:21,430 --> 00:04:25,870
‫Y lo hacemos conectando muchos nodos diferentes a este nodo de resultados.

68
00:04:25,870 --> 00:04:31,060
‫Y fluyendo a través de eso, terminamos obteniendo los datos que se generan.

69
00:04:31,780 --> 00:04:38,090
‫Una salida simple con la que podemos ir es, por ejemplo, simplemente arrastrando una animación a este y al gráfico

70
00:04:38,090 --> 00:04:44,320
‫y puede ver que crea un nodo y tiene un pin de salida, que es una pose de animación.

71
00:04:44,320 --> 00:04:51,610
‫Y si arrastramos esa pose a la pose de salida y presionamos compilar, puede ver que solo mostrará en nuestra vista previa

72
00:04:51,610 --> 00:04:54,100
‫lo que hace este plano de animación.

73
00:04:54,370 --> 00:05:01,540
‫Básicamente, solo reproduce esta animación de habilidad, y eso es más o menos lo que estamos haciendo en este momento, excepto que ahora ponemos una capa

74
00:05:01,540 --> 00:05:05,500
‫adicional en el medio, ya sabes, estamos poniendo un plano en lugar de solo

75
00:05:05,500 --> 00:05:06,640
‫reproducir la animación directamente.

76
00:05:06,940 --> 00:05:13,750
‫Eso no es particularmente útil en sí mismo, pero los diferentes tipos de operaciones que podemos hacer en

77
00:05:13,750 --> 00:05:14,530
‫estas poses.

78
00:05:14,530 --> 00:05:15,910
‫Ahora que es útil.

79
00:05:15,940 --> 00:05:19,360
‫Si hacemos clic con el botón derecho en el gráfico de animación, puede ver que hay muchas cosas sucediendo aquí.

80
00:05:19,840 --> 00:05:26,410
‫Quiero buscar algo llamado mezcla y hay algunas cosas diferentes aquí.

81
00:05:26,410 --> 00:05:30,220
‫Veamos si puedo encontrar el más útil que queremos en la parte superior.

82
00:05:30,640 --> 00:05:32,650
‫Hay algunos aquí, creo.

83
00:05:32,650 --> 00:05:36,250
‫Mezcla, mezcla, hueso por canal, mezcla multi.

84
00:05:36,520 --> 00:05:38,440
‫Solo queremos la mezcla estándar.

85
00:05:38,750 --> 00:05:39,520
‫Traigamos eso.

86
00:05:40,180 --> 00:05:45,580
‫Y pueden ver aquí que tenemos un valor, tenemos dos poses de entrada y una pose de salida.

87
00:05:45,580 --> 00:05:49,150
‫Entonces, lo que podemos hacer es arrastrar dos animaciones diferentes.

88
00:05:50,580 --> 00:05:51,510
‫Podemos pegar.

89
00:05:51,990 --> 00:05:53,460
‫Esta es una animación aditiva.

90
00:05:53,460 --> 00:05:54,480
‫No quiero traer eso.

91
00:05:54,480 --> 00:05:55,710
‫Eso nos va a confundir.

92
00:05:55,950 --> 00:05:58,470
‫Usemos algunas animaciones que realmente podríamos usar.

93
00:05:58,530 --> 00:06:01,890
‫Así que estábamos mirando el movimiento hacia adelante.

94
00:06:01,890 --> 00:06:05,760
‫Tenemos jog y jog podría ser más lo que queremos en lugar de caminar.

95
00:06:06,180 --> 00:06:09,090
‫Así que echemos un vistazo a Jog Forward.

96
00:06:09,360 --> 00:06:11,100
‫Eso podría ser una cosa que podemos mezclar.

97
00:06:11,520 --> 00:06:15,630
‫Y luego, la otra cosa que podríamos mezclar es un trote de regreso.

98
00:06:15,900 --> 00:06:17,220
‫Así que busquemos jog.

99
00:06:18,000 --> 00:06:23,400
‫Y tenemos jog, jog, BWT, que creo que significa Backwards, Forward, Backwards.

100
00:06:23,940 --> 00:06:28,440
‫Vamos a traerlos a nuestro nodo de mezcla y luego enviarlos y ver cuáles serán los resultados.

101
00:06:28,440 --> 00:06:29,310
‫Cuando presiono Compile.

102
00:06:29,950 --> 00:06:35,640
‫Puedo ver que estoy avanzando si coloco mi alfa en uno y luego vuelvo a compilar.

103
00:06:35,940 --> 00:06:42,450
‫Puede ver que ahora estoy trotando hacia atrás y también puede ver cómo se ejecuta la vista previa, puede ver en qué

104
00:06:42,990 --> 00:06:48,420
‫nodos fluyen los datos básicamente desde el trote hacia atrás a través del nodo de mezcla y no

105
00:06:48,420 --> 00:06:53,190
‫pasa nada a través de ese pin a porque la alfalfa mezclas entre los dos.

106
00:06:54,120 --> 00:07:00,480
‫Ahora puedo hacer un punto cinco en el alfa o en cualquier punto intermedio, y eso intentará reproducir ambas animaciones y

107
00:07:00,480 --> 00:07:03,780
‫colocarlas una encima de la otra, la mitad de ambas.

108
00:07:03,780 --> 00:07:09,270
‫Y, obviamente, cuando se trata de trotar hacia adelante y hacia atrás al mismo tiempo, eso comienza a parecer un

109
00:07:09,270 --> 00:07:10,710
‫poco divertido, ¿no es así?

110
00:07:10,740 --> 00:07:16,920
‫Entonces, lo que voy a hacer aquí es eliminar el movimiento hacia atrás y poner una animación inactiva en su lugar.

111
00:07:17,580 --> 00:07:19,260
‫Entonces, ¿dónde tenemos inactivo?

112
00:07:21,590 --> 00:07:24,620
‫Voy a seleccionar este ídolo que no es de combate y traerlo aquí.

113
00:07:25,580 --> 00:07:31,130
‫Entonces, ahora lo que debería suceder es que si estamos al 50%, es como si estuviéramos inactivos sin combatir.

114
00:07:31,160 --> 00:07:34,810
‫La mitad de eso o la mitad y luego la mitad de la broma.

115
00:07:34,820 --> 00:07:38,540
‫Mientras que si lo pongo en uno, funcionará al 100%.

116
00:07:39,540 --> 00:07:39,960
‫Inactivo.

117
00:07:41,160 --> 00:07:41,670
‫Cero.

118
00:07:41,910 --> 00:07:43,770
‫Va a hacer 100% jog.

119
00:07:44,580 --> 00:07:47,220
‫Ahora bien, esto no es lo ideal.

120
00:07:47,250 --> 00:07:49,890
‫El hecho de que sigo cambiando este alfa, teniendo que presionar recompilar.

121
00:07:49,900 --> 00:07:56,970
‫Entonces, lo que podemos hacer es agregar una variable a nuestro plan que debe ser flotante para que podamos seguir adelante y cambiar

122
00:07:56,970 --> 00:07:59,790
‫el tipo de variable en el panel de detalles.

123
00:07:59,880 --> 00:08:05,430
‫Es un flotador y voy a cambiar esto para mezclar la cantidad.

124
00:08:06,810 --> 00:08:14,940
‫Entonces, podemos arrastrar eso para que podamos arrastrar cualquier variable de nuestro plano al gráfico animado y

125
00:08:14,940 --> 00:08:18,390
‫conectarlo a algunos de los pines compilados.

126
00:08:18,690 --> 00:08:23,010
‫Y ahora, si volvemos a nuestro editor de vista previa de anim, puedes ver que está apareciendo.

127
00:08:23,010 --> 00:08:26,100
‫Estas variables como las que hemos creado aquí son la cantidad de mezcla.

128
00:08:26,640 --> 00:08:34,920
‫Y eso significa que ahora, si puedo cambiar eso en tiempo de ejecución, puedo ver y obtener una vista previa de lo que sucedería.

129
00:08:35,310 --> 00:08:40,440
‫Y luego, básicamente, lo que sucederá es que nuestro juego controlará estas variables en

130
00:08:40,440 --> 00:08:46,740
‫el modelo de animación para obtener el tipo correcto de animación en cualquier punto particular durante el juego.

131
00:08:46,740 --> 00:08:50,370
‫Y eso es lo que vamos a tratar un poco más adelante en esta sección.

132
00:08:50,670 --> 00:08:55,980
‫Pero por ahora, vamos a intentar que esta animación se vea bien cuando tengamos el tipo correcto

133
00:08:55,980 --> 00:08:57,240
‫de variables aquí.

134
00:08:58,850 --> 00:09:00,550
‫Así que es hora de un pequeño desafío.

135
00:09:00,560 --> 00:09:06,500
‫Vea si puede configurar un plano de animación y jugar con el gráfico de animación.

136
00:09:06,890 --> 00:09:09,020
‫Así que me gustaría que agregaras otra mezcla.

137
00:09:09,020 --> 00:09:10,970
‫Los vamos a sumar en secuencia.

138
00:09:10,970 --> 00:09:12,740
‫Así que primero puedes hacer una mezcla.

139
00:09:12,740 --> 00:09:15,290
‫Sus salidas van a ir a las entradas de la próxima mezcla.

140
00:09:15,940 --> 00:09:22,580
‫Luego, seleccione una animación que tenga sentido, como moverse hacia la derecha o hacia la izquierda, y agregue algunas variables que también

141
00:09:22,580 --> 00:09:29,420
‫tengan sentido para que pueda modificarlas y ver la vista previa y pueda combinar todas las animaciones, el inactivo, el avance. y

142
00:09:29,420 --> 00:09:34,670
‫la animación de su elección, ya sea que se mueva hacia la izquierda o hacia la derecha

143
00:09:34,670 --> 00:09:35,840
‫o algo así.

144
00:09:36,290 --> 00:09:37,880
‫Pausa el video y pruébalo.

145
00:09:37,880 --> 00:09:41,510
‫Simplemente juegue con estas mezclas, vea si puede entender el gráfico animado.

146
00:09:43,110 --> 00:09:43,800
‫Oye, bienvenido de nuevo.

147
00:09:44,100 --> 00:09:46,100
‫Así que espero que hayas tenido una pequeña oportunidad.

148
00:09:46,110 --> 00:09:48,780
‫Vamos a ir y agregar otro modo de mezcla.

149
00:09:48,990 --> 00:09:54,210
‫Así que busque blend y luego voy a desplazarme hacia arriba por alguna razón ligeramente relacionada con mi escala de pantalla.

150
00:09:54,540 --> 00:09:58,190
‫Vayamos a la mezcla y traigamos eso a colación.

151
00:09:58,200 --> 00:10:00,230
‫¿Ves estas animaciones inactivas?

152
00:10:00,240 --> 00:10:00,900
‫¿Qué quiero hacer?

153
00:10:01,290 --> 00:10:05,160
‫Creo que quiero que se mueva a la izquierda.

154
00:10:05,520 --> 00:10:13,950
‫Así que voy a buscar en mi navegador de activos para trotar y vamos a buscar una animación de trote a la izquierda.

155
00:10:14,400 --> 00:10:18,150
‫Ahora, por cierto, sé que las mezclas no son la forma ideal de hacer esto.

156
00:10:18,150 --> 00:10:23,610
‫En la próxima lección, veremos una mejor manera de hacer esto, que será usar algo llamado

157
00:10:23,850 --> 00:10:28,920
‫espacio de mezcla, que automáticamente nos permite combinar animaciones de movimiento de una manera

158
00:10:28,920 --> 00:10:29,700
‫muy agradable.

159
00:10:29,700 --> 00:10:34,230
‫Pero estamos haciendo esto solo para tener una idea del gráfico animado antes de sumergirnos en cosas más complicadas.

160
00:10:34,860 --> 00:10:40,980
‫Así que vamos a mezclar entre, veamos, izquierda y adelante, creo.

161
00:10:42,230 --> 00:10:50,020
‫Así que a la izquierda aquí y vamos a copiar cortes o mover el avance para estar aquí.

162
00:10:50,960 --> 00:10:58,220
‫Y luego vamos a parchear eso en las salidas de la mezcla en la entrada de la próxima mezcla.

163
00:10:58,220 --> 00:11:01,250
‫El que está inactivo o no, ¿realmente tiene sentido?

164
00:11:01,250 --> 00:11:02,540
‫Pensemos en las variables.

165
00:11:02,540 --> 00:11:03,980
‫¿Cómo deben llamarse las variables?

166
00:11:04,310 --> 00:11:09,230
‫Voy a tener uno que se llama adelante.

167
00:11:10,780 --> 00:11:11,320
‫Solo adelante.

168
00:11:11,440 --> 00:11:12,240
‫Eso es bastante simple.

169
00:11:12,290 --> 00:11:18,640
‫Y uno que se llama derecha o izquierda, porque estamos eligiendo una animación izquierda.

170
00:11:18,970 --> 00:11:19,930
‫Así que va a ser un flotador.

171
00:11:20,470 --> 00:11:26,380
‫Entonces, una de las mezclas debe elegir entre avanzar y no moverse.

172
00:11:26,380 --> 00:11:31,810
‫Así que vamos a intentar hacer esa primera mezcla.

173
00:11:33,060 --> 00:11:41,910
‫Conectaremos el ídolo que no es de combate a a para que en cero alfa no se mueva en uno donde adelante es uno que

174
00:11:41,910 --> 00:11:46,950
‫conecta esa variable de avance al alfa en uno se moverá hacia adelante.

175
00:11:47,480 --> 00:11:49,790
‫Entonces vamos a incorporar eso.

176
00:11:49,830 --> 00:11:52,320
‫Cero de moverlo a la izquierda.

177
00:11:53,860 --> 00:12:01,660
‫Ponga esa variable izquierda arriba del cero de movimiento a la izquierda y en uno de movimiento a la izquierda, vamos a conectar una B, básicamente, vamos a

178
00:12:01,660 --> 00:12:03,490
‫conectarlo al movimiento hacia la izquierda.

179
00:12:04,180 --> 00:12:07,120
‫Así que si compilamos eso, es un poco descabellado.

180
00:12:07,120 --> 00:12:08,500
‫Pero espero que entiendas la idea.

181
00:12:08,500 --> 00:12:15,340
‫Si vamos al editor de vista previa de anim y avanzamos, puede ver que comenzamos a trotar, restablecer eso y si nos

182
00:12:15,340 --> 00:12:19,540
‫movemos hacia la izquierda, puede ver que comenzamos a movernos hacia la izquierda.

183
00:12:20,170 --> 00:12:24,910
‫Y lo más importante, si lo hacemos, ambos nos movemos hacia la izquierda y comenzamos a trotar.

184
00:12:26,210 --> 00:12:28,940
‫Deberíamos ver una mezcla, un poco de ambos aquí.

185
00:12:28,940 --> 00:12:30,740
‫Tenemos ese avance siendo combinado.

186
00:12:30,740 --> 00:12:36,260
‫Si necesito tener un poco menos de la izquierda, 50% a la izquierda, pueden ver cómo se mueve.

187
00:12:36,260 --> 00:12:37,460
‫Es una animación de aspecto extraño.

188
00:12:37,460 --> 00:12:44,180
‫No lo está mezclando particularmente bien, pero puede ver que está reproduciendo tanto el jog hacia la izquierda como el

189
00:12:44,210 --> 00:12:45,470
‫jog hacia adelante.

190
00:12:45,470 --> 00:12:50,570
‫Ahora, como dije, vamos a dejar estas variables más o menos intactas, pero vamos a cambiar

191
00:12:50,570 --> 00:12:56,540
‫el mecanismo por el cual realmente hacemos la combinación para que tenga más sentido y usemos más de esas

192
00:12:56,540 --> 00:13:01,550
‫animaciones que estamos viendo. en el navegador de recursos para avanzar, retroceder, izquierda, etc.

193
00:13:01,790 --> 00:13:03,620
‫Pero eso es todo el tema de la próxima conferencia.

194
00:13:03,620 --> 00:13:09,710
‫En este hemos cubierto más o menos los planos de animación y cómo funciona el gráfico animado y por qué lo

195
00:13:09,710 --> 00:13:11,180
‫tenemos allí en primer lugar.

196
00:13:11,570 --> 00:13:14,240
‫Así que los veré en la próxima lección para más animaciones.