[Script Info]
Title: 
[Events]
Format: Layer, Start, End, Style, Name, MarginL, MarginR, MarginV, Effect, Text
Dialogue: 0,0:00:01.24,0:00:05.70,Default,,0000,0000,0000,,Hello and welcome to New Frame Plus, a series about video game animation.
Dialogue: 0,0:00:05.70,0:00:11.58,Default,,0000,0000,0000,,This is not news to you, but swinging around in\NSpider-Man looks and feels amazing.
Dialogue: 0,0:00:11.58,0:00:15.38,Default,,0000,0000,0000,,And of course it does. This is an Insomniac game.\NTheir animators are awesome.
Dialogue: 0,0:00:15.39,0:00:17.94,Default,,0000,0000,0000,,There is tons that I could dig into here,
Dialogue: 0,0:00:17.94,0:00:24.36,Default,,0000,0000,0000,,but today I want to focus on just one of his swing animations: the Zip-To-Point move.
Dialogue: 0,0:00:25.90,0:00:28.18,Default,,0000,0000,0000,,Let's just look at this whole move real quick.
Dialogue: 0,0:00:28.18,0:00:30.88,Default,,0000,0000,0000,,As soon as the player hits the commands\Nto initiate the move
Dialogue: 0,0:00:30.88,0:00:34.56,Default,,0000,0000,0000,,Spider-man extends his arms\Nin the direction of the targeted surface,
Dialogue: 0,0:00:34.56,0:00:38.20,Default,,0000,0000,0000,,shoots the webs, yanks himself\Ndirectly to that spot like a bullet,
Dialogue: 0,0:00:38.20,0:00:41.62,Default,,0000,0000,0000,,catches himself with his hands,\Nbrings his feet down just behind them
Dialogue: 0,0:00:41.62,0:00:44.50,Default,,0000,0000,0000,,and settles into that classic Spider-Man perch.
Dialogue: 0,0:00:44.50,0:00:45.86,Default,,0000,0000,0000,,Pretty simple right?
Dialogue: 0,0:00:45.86,0:00:49.36,Default,,0000,0000,0000,,Now, there are essentially three phases\Nto the animation of this move.
Dialogue: 0,0:00:49.50,0:00:54.38,Default,,0000,0000,0000,,Phase One: The Anticipation, where Spidey shoots the webs toward his destination.
Dialogue: 0,0:00:54.38,0:01:00.94,Default,,0000,0000,0000,,The first few frames of this are actually\Nan automated blend from whatever animation\NSpider-man was playing before.
Dialogue: 0,0:01:00.94,0:01:05.84,Default,,0000,0000,0000,,See, the animators need to transition Spidey\Ninto this anticipation pose quickly,
Dialogue: 0,0:01:05.84,0:01:07.96,Default,,0000,0000,0000,,but they've got no way of knowing exactly
Dialogue: 0,0:01:08.04,0:01:12.64,Default,,0000,0000,0000,,what pose Spider-man was in at the moment the player entered the Zip-To-Point command.
Dialogue: 0,0:01:12.64,0:01:17.70,Default,,0000,0000,0000,,They could theoretically just have him snap \Nto that new pose the instant the player hits the button
Dialogue: 0,0:01:17.70,0:01:20.70,Default,,0000,0000,0000,,But it would also look kind of unnatural physically
Dialogue: 0,0:01:20.70,0:01:27.24,Default,,0000,0000,0000,,So instead, they spend the first fraction of a second linearly blending from Spider-Man's previous animation
Dialogue: 0,0:01:27.24,0:01:30.74,Default,,0000,0000,0000,,into this new one,\Njust to smooth that transition out a little.
Dialogue: 0,0:01:30.74,0:01:36.16,Default,,0000,0000,0000,,This is something that you'll see\Nmost games do to smooth the transitions\Nfrom one animation to another
Dialogue: 0,0:01:36.16,0:01:38.90,Default,,0000,0000,0000,,Now, because that blend is somewhat automated,
Dialogue: 0,0:01:38.90,0:01:44.06,Default,,0000,0000,0000,,this is the spot where you're likely to see the most jank, especially when played back in slow motion.
Dialogue: 0,0:01:44.06,0:01:46.80,Default,,0000,0000,0000,,Notice how Spidey's orientation to the ground
Dialogue: 0,0:01:46.80,0:01:50.86,Default,,0000,0000,0000,,changes rapidly (and kind of unnaturally) \Nover the course of just a few frames.
Dialogue: 0,0:01:50.86,0:01:55.12,Default,,0000,0000,0000,,It's a bit of jank that the player is likely to FEEL rather than SEE.
Dialogue: 0,0:01:55.12,0:01:58.82,Default,,0000,0000,0000,,This brings us to the anticipation pose itself,\Nwhich is really nice.
Dialogue: 0,0:01:58.82,0:02:01.68,Default,,0000,0000,0000,,Spider-Man's arms are extended toward his destination,
Dialogue: 0,0:02:01.68,0:02:05.70,Default,,0000,0000,0000,,which both communicates direction\Nand clearly shows his intent.
Dialogue: 0,0:02:05.70,0:02:11.56,Default,,0000,0000,0000,,His body is also curled up into a ball which is going to contrast really wonderfully with what happens next...
Dialogue: 0,0:02:11.56,0:02:16.04,Default,,0000,0000,0000,,Phase Two: The Action, in which Spider-Man launches toward his destination.
Dialogue: 0,0:02:16.04,0:02:19.10,Default,,0000,0000,0000,,He yanks on the webs and stretches out his body completely.
Dialogue: 0,0:02:19.12,0:02:21.94,Default,,0000,0000,0000,,He's like a dart or an arrow shooting at his target.
Dialogue: 0,0:02:21.94,0:02:27.98,Default,,0000,0000,0000,,And the contrast between the curled-up anticipation and THIS gives just a wonderful spring to the move.
Dialogue: 0,0:02:27.98,0:02:31.30,Default,,0000,0000,0000,,This brings us to Phase Three: The Recovery.
Dialogue: 0,0:02:31.30,0:02:34.90,Default,,0000,0000,0000,,As Spidey nears his destination,\Nhe extends his arms to catch himself,
Dialogue: 0,0:02:34.90,0:02:41.54,Default,,0000,0000,0000,,and you get this nice, extended,\Noverlapping bounce on his spine and his head\Nas he absorbs that forward momentum
Dialogue: 0,0:02:41.54,0:02:44.24,Default,,0000,0000,0000,,and settles into the final resting pose
Dialogue: 0,0:02:44.78,0:02:50.70,Default,,0000,0000,0000,,One of the things I really like\Nabout this particular animation is\Nhow much Squash & Stretch plays into it,
Dialogue: 0,0:02:50.70,0:02:57.38,Default,,0000,0000,0000,,and not because Insomniac's animators\Nare noticeably warping or exaggerating \NSpidey's physical proportions or anything.
Dialogue: 0,0:02:57.38,0:03:02.10,Default,,0000,0000,0000,,You don't actually have to turn your character into rubber to make use of this animation principle.
Dialogue: 0,0:03:02.18,0:03:07.48,Default,,0000,0000,0000,,Imagine animating a rubber ball springing from one point to another of its own will.
Dialogue: 0,0:03:07.48,0:03:10.38,Default,,0000,0000,0000,,It would squish in the anticipation before the jump...
Dialogue: 0,0:03:10.38,0:03:12.66,Default,,0000,0000,0000,,stretch as it sprang toward its target
Dialogue: 0,0:03:12.66,0:03:17.34,Default,,0000,0000,0000,,and then squash again as it hit the target and tried to quickly stop all that momentum.
Dialogue: 0,0:03:17.44,0:03:20.88,Default,,0000,0000,0000,,Spider-Man's body does something\Nvery similar in this animation!
Dialogue: 0,0:03:20.88,0:03:23.66,Default,,0000,0000,0000,,He curls up, launches into a stretched-out pose
Dialogue: 0,0:03:23.66,0:03:27.84,Default,,0000,0000,0000,,and then bunches up again at the finish\Nto try to absorb all that momentum.
Dialogue: 0,0:03:27.84,0:03:33.56,Default,,0000,0000,0000,,The other thing that I love is that, throughout all this,\Nall of the key poses are iconic Spider-Man.
Dialogue: 0,0:03:33.56,0:03:37.03,Default,,0000,0000,0000,,The web shooting anticipation,\Nthe flight, the ending perch...
Dialogue: 0,0:03:37.03,0:03:40.14,Default,,0000,0000,0000,,even if you only have a\Npassing familiarity with this character
Dialogue: 0,0:03:40.14,0:03:42.18,Default,,0000,0000,0000,,it all feels just right.
Dialogue: 0,0:03:42.18,0:03:44.56,Default,,0000,0000,0000,,And one last thing worth noting about this
Dialogue: 0,0:03:44.56,0:03:49.48,Default,,0000,0000,0000,,is just how much complexity is hidden\Ninside this one seemingly-simple move
Dialogue: 0,0:03:49.64,0:03:54.66,Default,,0000,0000,0000,,Like, sure, you've got the three parts of this movement: the web shot, the flight and the landing.
Dialogue: 0,0:03:54.66,0:03:55.76,Default,,0000,0000,0000,,Simple enough.
Dialogue: 0,0:03:55.80,0:03:58.14,Default,,0000,0000,0000,,Three animations ought to cover it, right?
Dialogue: 0,0:03:59.28,0:04:04.12,Default,,0000,0000,0000,,What if the player wants to launch Spider-Man toward a perch that ISN'T directly in front of him?
Dialogue: 0,0:04:04.12,0:04:06.72,Default,,0000,0000,0000,,Well, you could use the same starting animation
Dialogue: 0,0:04:06.72,0:04:10.78,Default,,0000,0000,0000,,and just have Spider-Man whip around\Nto face that new direction on the first frame,
Dialogue: 0,0:04:10.78,0:04:16.22,Default,,0000,0000,0000,,but it would feel really unnatural, and totally ignore the momentum his current swing already had.
Dialogue: 0,0:04:16.22,0:04:17.86,Default,,0000,0000,0000,,So, rather than doing that,
Dialogue: 0,0:04:17.96,0:04:22.38,Default,,0000,0000,0000,,Insomniac has created a bunch of variants to that anticipation web shot.
Dialogue: 0,0:04:22.38,0:04:24.86,Default,,0000,0000,0000,,If the player's target is off to one side
Dialogue: 0,0:04:24.86,0:04:28.52,Default,,0000,0000,0000,,Spider-Man will twist his upper body\Nin that direction to shoot the webs,
Dialogue: 0,0:04:28.52,0:04:32.40,Default,,0000,0000,0000,,and then transition into that same \Nstretched-out flight pose after launching.
Dialogue: 0,0:04:32.40,0:04:35.42,Default,,0000,0000,0000,,Aha, but! What if Spider-Man isn't even flying?
Dialogue: 0,0:04:35.42,0:04:38.68,Default,,0000,0000,0000,,What if he's just launching\Nfrom one perch to another perch?
Dialogue: 0,0:04:38.68,0:04:42.40,Default,,0000,0000,0000,,Well, I guess you're gonna need an alternate starting animation for that scenario too.
Dialogue: 0,0:04:42.60,0:04:47.18,Default,,0000,0000,0000,,But ok, what if he's perched AND\Npoint-zipping to a spot behind him?
Dialogue: 0,0:04:47.18,0:04:48.18,Default,,0000,0000,0000,,Well... dang.
Dialogue: 0,0:04:48.18,0:04:51.04,Default,,0000,0000,0000,,I guess we need ANOTHER transition for that edge case.
Dialogue: 0,0:04:51.06,0:04:56.06,Default,,0000,0000,0000,,All of these possible starting positions might lead\Nto the same stretched-out flying pose,
Dialogue: 0,0:04:56.06,0:05:01.74,Default,,0000,0000,0000,,but they require different initial animations to make that transition feel organic and seamless.
Dialogue: 0,0:05:01.74,0:05:04.40,Default,,0000,0000,0000,,BUT it's actually more complicated than even that.
Dialogue: 0,0:05:04.40,0:05:05.96,Default,,0000,0000,0000,,Because I lied a second ago!
Dialogue: 0,0:05:05.96,0:05:09.74,Default,,0000,0000,0000,,Those starting positions DON'T always end up\Nin the same flying pose.
Dialogue: 0,0:05:09.82,0:05:13.40,Default,,0000,0000,0000,,Spider-Man will actually play\Ndifferent Zip-To-Point animations
Dialogue: 0,0:05:13.46,0:05:16.44,Default,,0000,0000,0000,,depending on how far away he is from the target.
Dialogue: 0,0:05:16.44,0:05:20.46,Default,,0000,0000,0000,,If the target is close, he may instead do this simpler hop animation,
Dialogue: 0,0:05:20.46,0:05:22.62,Default,,0000,0000,0000,,more like a web-assisted jump.
Dialogue: 0,0:05:22.62,0:05:25.91,Default,,0000,0000,0000,,But okay, what if the target destination is really far away?
Dialogue: 0,0:05:25.91,0:05:29.80,Default,,0000,0000,0000,,In that scenario, Spider-Man will do\Nthis twisting flight path,
Dialogue: 0,0:05:29.80,0:05:34.18,Default,,0000,0000,0000,,which is functionally the same as the regular one,\Nbut just a little bit more visually interesting.
Dialogue: 0,0:05:34.18,0:05:36.34,Default,,0000,0000,0000,,I don't know this for sure, but I would guess
Dialogue: 0,0:05:36.34,0:05:40.60,Default,,0000,0000,0000,,that the animators felt that having Spidey stay in this one stretched out pose
Dialogue: 0,0:05:40.60,0:05:45.72,Default,,0000,0000,0000,,for a really long distance Zip-To-Point move\Nfelt just a bit flat and same-y.
Dialogue: 0,0:05:45.72,0:05:51.74,Default,,0000,0000,0000,,So they put a little spin in there\Non the long flights to keep Spider-Man feeling\Nvisually interesting and dynamic.
Dialogue: 0,0:05:51.76,0:05:54.32,Default,,0000,0000,0000,,And even the landing on this move can vary!
Dialogue: 0,0:05:54.32,0:05:57.94,Default,,0000,0000,0000,,Not only will Spider-Man's follow-through\Nmomentum-absorbing bounce
Dialogue: 0,0:05:57.95,0:06:02.12,Default,,0000,0000,0000,,be more severe and exaggerated\Nafter those long Point-Zip jumps
Dialogue: 0,0:06:02.12,0:06:05.76,Default,,0000,0000,0000,,because he's having to recover from stopping\Nso much more forward momentum,
Dialogue: 0,0:06:05.76,0:06:08.34,Default,,0000,0000,0000,,but there's a potential branching point here.
Dialogue: 0,0:06:08.34,0:06:12.88,Default,,0000,0000,0000,,If the player has unlocked the Point Launch skill\Non Spidey's talent tree,
Dialogue: 0,0:06:12.88,0:06:16.68,Default,,0000,0000,0000,,they can press Jump immediately after Spidey's hands hit his target
Dialogue: 0,0:06:16.68,0:06:19.20,Default,,0000,0000,0000,,to have him instead SPRING off of that target,
Dialogue: 0,0:06:19.22,0:06:22.34,Default,,0000,0000,0000,,gaining more height and a huge burst of speed.
Dialogue: 0,0:06:22.46,0:06:23.76,Default,,0000,0000,0000,,Think about that...
Dialogue: 0,0:06:23.76,0:06:28.40,Default,,0000,0000,0000,,all of these variants... all of these\Nalternate versions and branching points,
Dialogue: 0,0:06:28.40,0:06:33.70,Default,,0000,0000,0000,,and all of this animation coverage\Njust to make one single move look good.
Dialogue: 0,0:06:33.92,0:06:34.84,Default,,0000,0000,0000,,One!
Dialogue: 0,0:06:34.90,0:06:38.06,Default,,0000,0000,0000,,You would be surprised how common this is in game animation.
Dialogue: 0,0:06:38.08,0:06:44.90,Default,,0000,0000,0000,,It is amazing how much work and technical complexity can go into making a gameplay move feel and look...
Dialogue: 0,0:06:46.90,0:06:48.14,Default,,0000,0000,0000,,...effortless.
Dialogue: 0,0:06:48.14,0:06:50.88,Default,,0000,0000,0000,,Dog GONNIT, this game's animation looks good.
Dialogue: 0,0:06:50.88,0:06:52.48,Default,,0000,0000,0000,,Anyway, I hope you enjoyed this!
Dialogue: 0,0:06:52.48,0:06:55.78,Default,,0000,0000,0000,,I wanted to try doing some episodes\Non just a single animation,
Dialogue: 0,0:06:55.78,0:06:58.06,Default,,0000,0000,0000,,so I decided to take some requests!
Dialogue: 0,0:06:58.06,0:07:00.28,Default,,0000,0000,0000,,Today's episode was a request from Nick Phan.
Dialogue: 0,0:07:00.28,0:07:01.64,Default,,0000,0000,0000,,So, thank you Nick!
Dialogue: 0,0:07:01.64,0:07:02.62,Default,,0000,0000,0000,,What about you?
Dialogue: 0,0:07:02.62,0:07:05.68,Default,,0000,0000,0000,,Can you think of a particular animation \Nyou'd like me to dig into?
Dialogue: 0,0:07:05.68,0:07:07.34,Default,,0000,0000,0000,,Come on, any game you want.
Dialogue: 0,0:07:07.34,0:07:13.66,Default,,0000,0000,0000,,Is there some particular combat move\Nor jump, or maybe a moment in a cutscene\Nthat you'd like an episode about?
Dialogue: 0,0:07:13.66,0:07:16.06,Default,,0000,0000,0000,,Let me know down in the comments, or on Twitter.
Dialogue: 0,0:07:16.06,0:07:18.72,Default,,0000,0000,0000,,Maybe the next episode will be about your suggestion!
Dialogue: 0,0:07:18.86,0:07:22.08,Default,,0000,0000,0000,,And, as always, subscribe if you want\Nto see more animation videos
Dialogue: 0,0:07:22.08,0:07:27.60,Default,,0000,0000,0000,,and click that little bell thingy down there\Nif you want to make sure that YouTube\Nnotifies you of future video releases.
Dialogue: 0,0:07:27.60,0:07:30.22,Default,,0000,0000,0000,,Thank you for watching and I'll see you next time!