Hotline Miami 2 Level Editor Tutorial Part 7 - Spriting Tips (Ft. THELEGOmack)
Summary
TLDRIn this episode of the Hotline Miami 2 level editor tutorials, the hosts Rob Salmon, Matt, and guest Lego Mac discuss strategies and techniques for spriting, focusing on creating visually appealing pixel art for games. They cover a range of topics, including selecting and using the right tools such as paint.net and Photoshop, techniques for recoloring and shading sprites to add depth, and ensuring the consistency of animations by aligning sprites accurately. Moreover, they explore how to improve work efficiency by deleting unnecessary sprites and leveraging existing sprite sheets. Viewers are also guided on handling sprite alignment and the limitations imposed by fixed-size metafiles, along with offering tips on compensating for these constraints. The discussion aims to provide game developers or designers with practical, hands-on advice to enhance their spriting process in game design.
Takeaways
- 🎮 Spriting enhances creative elements in games.
- 🖌️ Tools like paint.net and Photoshop are recommended for pixel art.
- 🔍 Choose the right tool for precise color selection.
- 👨🎨 Recoloring sprites involves isolating colors and adjusting thresholds.
- 💡 Unique colors help keep sprite animations aligned.
- ✂️ Deleting unneeded sprites avoids accidental edits.
- 🔧 Shading adds depth and realism to pixel art.
- 🗂️ Use guidelines for consistent sprite animation.
- 🔄 Copy-pasting helps rectify sprite editing mistakes.
- 📏 Constraints exist due to fixed metafile sizes.
Timeline
- 00:00:00 - 00:05:00
The video begins with introductions of the hosts and a brief overview of what will be covered, specifically focusing on sprites and pixel art in game design. They mention some tools like paint.net and Photoshop that can be used for creating sprites.
- 00:05:00 - 00:10:00
The discussion moves to how sprite sheets are formatted in PNG and the importance of understanding each frame of an animation. The hosts talk about how they will revisit the basics of spriting, like recoloring, before moving into more advanced techniques.
- 00:10:00 - 00:15:00
A basic recoloring tutorial is demonstrated using characters from games. The method of isolating and changing colors on a sprite using tools like paint is shown. Common issues, such as inconsistent color shading across frames, are mentioned.
- 00:15:00 - 00:20:00
Further examples with more detailed processes of spriting are discussed. The hosts explain checking sprite details like small inconsistencies, correcting them, and making sure the recoloring is consistent throughout the animation frames.
- 00:20:00 - 00:25:00
They explain that one must find existing mods or sprite sheets to serve as a base or reference for new projects, emphasizing efficiency over starting from scratch. This includes tips on using color shading and focusing efforts on frequently used sprites.
- 00:25:00 - 00:30:00
Advanced tips are given regarding hiding unnecessary sprites to avoid clutter and focusing edits on sprites that will be used. The process of using custom face sprites and adjusting the animation to fit within the game's framework is explained.
- 00:30:00 - 00:35:00
The video stresses the importance of trial and error when it comes to creating original animations. The hosts iterate on using guidelines for sprite alignment and offer detailed steps for recoloring and modifying specific parts of sprite animations.
- 00:35:00 - 00:40:00
Techniques for isolating certain parts of sprites and animations, like weapon sprites, are illustrated, cautioning against saving sprite sheets until the desired results are achieved to avoid making irreversible changes.
- 00:40:00 - 00:45:00
The use of software like GIMP (noted as [__] in the script) is explored. The hosts talk about its features, such as layer management and color selection, and demonstrate shortcuts to make spriting more efficient and less time-consuming.
- 00:45:00 - 00:50:37
Finally, the video explains the significance of shading in spriting, specifically how it creates depth and a more three-dimensional look. Detailed steps on creating a gradient effect are provided, emphasizing its importance in providing realism in sprite art.
Mind Map
Video Q&A
What is this video about?
It is a tutorial on spriting and creating pixel art for the Hotline Miami 2 level editor.
Who are the hosts of the video?
The hosts are Rob Salmon and Matt, with a guest named Lego Mac.
What tools do they recommend for spriting?
They mention using programs like paint.net and Photoshop.
How do you ensure sprites don't jump around in animations?
By creating a guideline or using a unique color for alignment during sprite editing.
What is a key step in recoloring sprites?
Isolating and changing a single color using tools like color selection and adjusting thresholds.
How can shading improve sprite look?
Shading gives depth and a more realistic look to pixel art, especially in showing curvature or slopes.
Why delete unneeded sprites?
Deleting unneeded sprites helps to avoid accidentally editing them and streamlines the spriting process.
What is the challenge with metafiles mentioned in the video?
You cannot change the size of the space each sprite occupies, limiting detailed artwork within fixed dimensions.
How to address errors during sprite editing?
You can copy and paste from the original sprite sheet if changes were wrong or unintended.
Who might find this video useful?
Game developers or designers using the Hotline Miami 2 level editor and interested in spriting.
View more video summaries
Chapter 9 Inflammation and Immunity BIOL300
Power Reporting Deviation on Ryzen: Exploration & Tentative Fix
The Modern History of the UAE
What if India and Pakistan Never Separated? | Dhruv Rathee
Prof. Richard Johnson - 'Nature Wants Us To Be Fat - Part 1'
25 RUMUS EXCEL PALING PENTING - LANGSUNG JAGO EXCEL!
- 00:00:00you want to take it again or you want to
- 00:00:03just keep this train hello everyone
- 00:00:10welcome to another episode of hotline
- 00:00:11Miami 2 level editor tutorials
- 00:00:13I'm your host Rob salmon with me is my
- 00:00:16fabulous co-host this is Matt with us
- 00:00:21today we have hello it's the logo Mac
- 00:00:24here why are we talking about today
- 00:00:28today we are talking about spriting in
- 00:00:32more detail and how to make some cool
- 00:00:34looking
- 00:00:35pixel art in your games and what to do
- 00:00:38what not to do
- 00:00:39so first thing we're gonna do just gonna
- 00:00:42leave the game and we're gonna pull up
- 00:00:44[ __ ] and there's a whole bunch of yeah
- 00:00:48there's a whole bunch of different
- 00:00:49sprite programs that you can use
- 00:00:53paint.net is in [ __ ] or two very popular
- 00:00:56ones what do you use Lego I use a shot
- 00:01:01okay name freaky so probably some extra
- 00:01:06tools other programs I do have I
- 00:01:14actually have use game for a little
- 00:01:15while and I used a pixel program on Mac
- 00:01:18back when I had a bat called a
- 00:01:20paintbrush that's actually very good
- 00:01:22look at the fur I think lard I remember
- 00:01:25and I get dappling a paint on it for
- 00:01:28sometime so yeah I imagine Photoshop if
- 00:01:32it works it works on food yeah yeah I
- 00:01:35love [ __ ] except the text box crashes it
- 00:01:39I don't know if that's just me but I
- 00:01:41have to like do all my text in ms paint
- 00:01:43and then convert it over
- 00:01:49so first we're gonna okay so I brought
- 00:01:52up [ __ ] and then the two like the two
- 00:01:58tools is your paint thing and then the
- 00:02:00wat Explorer which I think I included in
- 00:02:02the description
- 00:02:03last episode I'll probably do it this
- 00:02:05time and so everything that every sprite
- 00:02:10sheet is in PNG format that you can
- 00:02:12possibly edit and just like the we
- 00:02:19talked about this in last episode but
- 00:02:20like a stop-motion animation every
- 00:02:23single frame from the animations is all
- 00:02:26on this sheet here and it's just like
- 00:02:29one single image so you just have to
- 00:02:32like know what the sprites look like in
- 00:02:34game so you can just pick out like the
- 00:02:36animation and start editing it from
- 00:02:39there so we're gonna start cut we
- 00:02:45touched on it briefly in the last
- 00:02:47episode we're gonna start with the
- 00:02:48basics again and then we're gonna get a
- 00:02:49bit more advanced and what we're doing
- 00:02:52so let's read colors yeah let's start
- 00:02:56with three colors again yeah we're
- 00:02:59saying to work lighting up beforehand I
- 00:03:01love the phrase with this that's related
- 00:03:03walk before your run because that's the
- 00:03:05most accurate like like a starting out
- 00:03:08was reading so you're gonna want to go
- 00:03:13you know want to extract it and there's
- 00:03:15three ways to do that you hit this
- 00:03:17little button here and you go to
- 00:03:18resource extract or use the shortcut
- 00:03:20ctrl e and you'll extract the sheet and
- 00:03:24put it where you want I'm just gonna put
- 00:03:27it in
- 00:03:28my pictures folder and then I can open
- 00:03:35up [ __ ] open go to my pictures folder
- 00:03:38and then I find it it's another thing
- 00:03:41about campus there's no search function
- 00:03:46I know with obviously the more files
- 00:03:55you're getting obviously like organizing
- 00:03:57it so you're not having like a heart
- 00:04:00attack kind of fun stuff but everyone
- 00:04:02kind of does it differently but yeah
- 00:04:04when you're working with a lot there it
- 00:04:06kind of helps to have that down right
- 00:04:10all right so I chose the tiger sprite
- 00:04:12Tony the Tiger because he has probably
- 00:04:15one of the easiest ones to edit there's
- 00:04:16very few of him
- 00:04:17the players are easier than the enemies
- 00:04:19because the players don't get executed
- 00:04:21and the are at least I mean I guess they
- 00:04:26do the executing but there's less frames
- 00:04:28usually and let's let's see here so if
- 00:04:34we want to recolor basically all that
- 00:04:37involves is isolating a single color and
- 00:04:41getting rid of it or changing it so the
- 00:04:45button on [ __ ] it's called color tool
- 00:04:48which is pretty easy and you just select
- 00:04:51the color and this threshold down here
- 00:04:53select chooses like how similar the
- 00:04:55colors that it chooses so if you want to
- 00:04:57get like all like all the yellows and
- 00:05:00oranges and whatnot you'd would slide it
- 00:05:03up and like it would select a huge chunk
- 00:05:05and you could select the whole thing if
- 00:05:08you slide it all the way and so
- 00:05:09everything that's like not the bet the
- 00:05:12checkered background what like the
- 00:05:14transparency layer is that what you
- 00:05:15would say mm-hmm
- 00:05:17yeah yep so what do you want to do to
- 00:05:20Tony to make him pretty well color yeah
- 00:05:24let's change his boot color oh I would
- 00:05:29like to make a point about somebody
- 00:05:30sprites by the way new particularly with
- 00:05:33with the the fans and gangs Prince
- 00:05:37apparent from what I can tell these
- 00:05:39sprites were made or leaving in the
- 00:05:41development of hot no to and I don't
- 00:05:45want to be disparaging towards
- 00:05:46veterinary you think about the warm I
- 00:05:48can use for the coloring exam I suppose
- 00:05:51to get consistent I'm only say sloppy
- 00:05:53like if you select a certain color on
- 00:05:56one frame this sprite it's not gonna be
- 00:05:58the same everywhere because the colors
- 00:06:00will just be slightly different you can
- 00:06:03see it pretty well too like the unit
- 00:06:04saying gang members eyes we're gonna add
- 00:06:07their hands yeah hands definitely so
- 00:06:11that's something you're editing and
- 00:06:14sprite to the game sprites that kind of
- 00:06:16thing right so the best I could it the
- 00:06:19best way to fight that would be upping
- 00:06:21your threshold of it so if there's like
- 00:06:24a slight shade off shade of one hand
- 00:06:26it'll still get selected obviously
- 00:06:29you're just gonna have to look out for
- 00:06:30that like especially in game and if as
- 00:06:33long as you're not doing anything major
- 00:06:34you might not even notice it but yeah
- 00:06:38that's that's important so well is it
- 00:06:44just the fans in the gang cuz like I've
- 00:06:46noticed it with the gang only those are
- 00:06:50the one by the fans I'm I I think I'm
- 00:06:53thinking Tony actually I'm not sure if
- 00:06:56it applies to expose their quarry or
- 00:06:58anything
- 00:06:58from what I remember but it probably are
- 00:07:01a couple more space here in there but
- 00:07:02gang is the one that sticks out in my
- 00:07:03head the most mm-hmm okay so let's make
- 00:07:07his shoes bright green so you can notice
- 00:07:10it
- 00:07:11and you then you choose like the paint
- 00:07:13tool and you go whole selection so
- 00:07:16everything that's selected regardless of
- 00:07:18the color or like white like everything
- 00:07:21just in the little dotted lines will
- 00:07:23turn green and then you'll want to do do
- 00:07:28the same thing for the other shade and
- 00:07:31clicking the thing and just like moving
- 00:07:33these sliders with either the numbers or
- 00:07:35the sliding here can like get you the
- 00:07:38perfect color that you're looking for
- 00:07:39that it's really help for first shading
- 00:07:42there is to just like drop the like the
- 00:07:47volume down a bit on the green and
- 00:07:48whatnot and I'll talk about shading a
- 00:07:52bit later because for objects it's super
- 00:07:54important and as as like I said like
- 00:07:57some of his execution sprite feet are
- 00:08:00not the same and so what I would want to
- 00:08:02do is just you know click it and
- 00:08:05resample from the other thing so you
- 00:08:08choose this there we go all right yeah
- 00:08:14and so that that's recoloring
- 00:08:17I think the better one instead of toning
- 00:08:20for me to show you would be mafia
- 00:08:21because the mafia jackets are pure white
- 00:08:24correct and so what else is pure there's
- 00:08:28a couple other pure white things that
- 00:08:30you're not going to want to change
- 00:08:40let's extract that we're going to put
- 00:08:42that and do those pictures I've already
- 00:08:47got something there unfortunately you
- 00:08:49can't really rename them like it gets
- 00:08:51all kind of [ __ ] at you if you try to
- 00:08:53rename the sprite sheets the wot
- 00:09:01Explorer is a real [ __ ] cruel
- 00:09:03mistress on me I'm just gonna put in my
- 00:09:06Uplay folder my folders are not yeah
- 00:09:33because I've had so many different
- 00:09:35campaigns if you're mad at me for all
- 00:09:36the sprites I sent you all the patch
- 00:09:38ones I sent you recently for human being
- 00:09:41you're like one of them's literally just
- 00:09:42named [ __ ] patch wad oh there's no
- 00:09:48organization no cuz honestly I think
- 00:09:53pelo was doing one word he was like just
- 00:09:56struggling constantly to get it right
- 00:09:58and then finally he did it and he sent
- 00:10:00it to me
- 00:10:01I was like within a level mop holder and
- 00:10:03it just said like [ __ ] this piece of
- 00:10:05[ __ ] but I can see it I can like really
- 00:10:08tell the emotion that went through this
- 00:10:10mod respect yeah absolutely
- 00:10:17I just opened up the Mafia sprite sheet
- 00:10:20and I was good I wanted to like they
- 00:10:24have white suits and everything yeah so
- 00:10:26they're white suits so even when the
- 00:10:27threshold threshold is zero and I turned
- 00:10:30them a color they they use the same
- 00:10:33exact color of white for the weapon
- 00:10:36swings then for the tips of the knives
- 00:10:40I can find it right so yeah like the
- 00:10:50holes the tips of I almost all the
- 00:10:52knives now turning green so you're gonna
- 00:10:53have to fix that so we have we have this
- 00:10:55green color for their outfit there was a
- 00:10:58campaign where they made like the Mafia
- 00:10:59lime green and it was hideous but like
- 00:11:02it was as a joke it was like the Italian
- 00:11:04mafia the ant campaign that was just a
- 00:11:20joke never planted Carlos ant I think it
- 00:11:24was like oh and I just turned the golf
- 00:11:31club pipes as well because they're not
- 00:11:37pipes golf club well literally for the
- 00:11:42launch of the entirety of the first
- 00:11:45hotline I just assumed it was a big old
- 00:11:47pipe like a bigger version of the other
- 00:11:48pipe I get it realize with the golf club
- 00:11:51until playing cute hotline Miami 2 and
- 00:11:55picking one up next to a little mini
- 00:11:56golf thing playing and like on that
- 00:11:58final Sun level it connects well not
- 00:12:07really because like hey mr. mafia guy
- 00:12:11I'm giving your friend an assault rifle
- 00:12:13but you get the whole Golf Club carry
- 00:12:17this around the strip club and hit
- 00:12:19anyone
- 00:12:30okay so like as you can see I'm like
- 00:12:32basically you just wreak select that
- 00:12:35color of the knife that you accidentally
- 00:12:38colored it to and just you know make
- 00:12:40sure to correct it the other way to do
- 00:12:42this though if it's like if you've
- 00:12:47really [ __ ] it up is to open the
- 00:12:50sprite sheets don't save your sprite
- 00:12:52sheet as you're working on it and just
- 00:12:54open up the same exact thing so let's
- 00:12:58see here so it's the same exact one like
- 00:13:00if I save it it'll screw this up and
- 00:13:02just find the knife and just highlight
- 00:13:06it ctrl C find the other one and ctrl V
- 00:13:11and just you can just place it there
- 00:13:15ctrl V and then you know you drag it
- 00:13:18correctly you can also do this if you
- 00:13:23like screw something up so let's I'm
- 00:13:26going to accidentally color the their
- 00:13:29undershirts a different color let's make
- 00:13:30it and not do red because super bright
- 00:13:35yellow maybe didn't we do that with the
- 00:13:38Argentine Argentinians yeah it was like
- 00:13:41purple and like yellow yeah yeah say
- 00:13:45like you saved this and now you you want
- 00:13:47it to go back but you like your admin
- 00:13:50details month three you can't like
- 00:13:53control Z because say like you closed
- 00:13:55the program and stuff the way you can do
- 00:13:57this is you just pull up the color
- 00:14:01picker and find their undershirt and you
- 00:14:04click it so like all the undershirts are
- 00:14:07selected and you control see that and so
- 00:14:11every single undershirt is selected and
- 00:14:12then you want to just paste it onto your
- 00:14:14other sprite sheet and
- 00:14:17it's gonna take some time to line it up
- 00:14:20perfectly because there's a like a
- 00:14:25hundred different like just random
- 00:14:26looking undershirt sprites but
- 00:14:28eventually you'll line it up and this is
- 00:14:31how I got the blood on the black and
- 00:14:33white guys and don't feel the reefer out
- 00:14:36now play it on steam today yeah and so
- 00:14:43like it just perfectly lines everything
- 00:14:45up so you know tips and tricks now yea
- 00:14:52unfortunately say with the Mafia you
- 00:14:55have the shoes the same exact color
- 00:14:57right yes yes yeah try to get some
- 00:15:09feedback from you and so if you're like
- 00:15:14oh man I really want to have the Mafia
- 00:15:16have some cool different colored kicks
- 00:15:18but I don't want to spend four months of
- 00:15:21my life coloring it the because other
- 00:15:25people did you can [ __ ] piggyback off
- 00:15:27of their labor and so let's find the
- 00:15:30editor and all you have to do is find
- 00:15:33like some so we showed you how to go to
- 00:15:35the wiki and find something so I do this
- 00:15:41all the time where I'll find someone
- 00:15:42else's sprite sheet that has like
- 00:15:45something recolored and just make what I
- 00:15:48want to make off of theirs and it's not
- 00:15:49like I'm stealing their work it's just
- 00:15:51the I I did this for the French mafia
- 00:15:54human being 3 which you'll see is
- 00:15:56someone had I don't remember what mod I
- 00:15:59used but it the only thing that was
- 00:16:01different was the Mafia odd black shoes
- 00:16:03so I could isolate that color or I don't
- 00:16:07think it was black but I think it was
- 00:16:09great but I could isolate that color
- 00:16:10without selecting their whole suit and
- 00:16:12so it just speeds up frost so you know
- 00:16:15you just have to be smart
- 00:16:20I said it's pretty firm actually yeah
- 00:16:22yeah like you just have to be smart in
- 00:16:24how to like make it efficient because as
- 00:16:27we said yesterday or last episode this
- 00:16:30is a chore Lego specifically said the
- 00:16:33key word is tedious right that's the
- 00:16:38word tedious takes a long time and he
- 00:16:40really wants to get it absence a with
- 00:16:50like having or using like a spreadsheet
- 00:16:52as well you in a way I was gonna say
- 00:16:57using it fairly but it's one thing like
- 00:16:59you said using making the French enemy
- 00:17:03faction other than like 10 there's some
- 00:17:06people like have a sprite in and they'll
- 00:17:08post like the sprite sheet was like a
- 00:17:10link I'm like the subreddit or whatever
- 00:17:12and it's not like you're taking like a
- 00:17:14player sprite and then just like pacing
- 00:17:16a mask over it because that's like
- 00:17:18that's kind of like you're basically
- 00:17:21just using that person so yeah yeah and
- 00:17:23so like you said just using it
- 00:17:24efficiently thank you're not exactly
- 00:17:26like completely piggyback off it but
- 00:17:30you're kind of worth using it like a
- 00:17:31reference and shaping until until what
- 00:17:35you want to use like this right right
- 00:17:37like obviously none of this is backed by
- 00:17:39law but think of it as fair use law like
- 00:17:42did you transform it enough into your
- 00:17:43own and even still then like be like oh
- 00:17:46I based it off of these like my Nazi
- 00:17:49soldiers were based off someone else's
- 00:17:50Russian soldiers from someplace and I
- 00:17:53changed her crapload on it but it saved
- 00:17:56me even more work basing it off of his
- 00:18:02now right now I feel obligated to give
- 00:18:04him a shout-out let's see where it was
- 00:18:06I'm not really gay it wouldn't hurt to
- 00:18:09like give credit but I didn't do that it
- 00:18:12was perfect part oh that's it was the
- 00:18:21other thing to make it more efficient is
- 00:18:24identify sprites that you don't need and
- 00:18:27delete them so for example if you're
- 00:18:31making a campaign and you're positive
- 00:18:33that the that these guys are never gonna
- 00:18:37be hit by acid or by the boiling pan
- 00:18:41like say you're using Richter he doesn't
- 00:18:42have acid or boiling pan you can just
- 00:18:44select these and delete them so you
- 00:18:47don't even have to think about them
- 00:18:48existing and accidentally start spriting
- 00:18:51on them because you can kind of get to a
- 00:18:52rhythm
- 00:18:53same with there's two different
- 00:18:55executions for the like mercy kills I
- 00:18:58think that's what they're called when
- 00:19:00they're crawling all right so if you're
- 00:19:05not if you're not using Jake or [ __ ] pig
- 00:19:09guy mark mark or mark yeah like all of
- 00:19:14them kick the back of their head in
- 00:19:15right yeah so if you're not using a fat
- 00:19:19character you can just select all of
- 00:19:21these and delete them and so and I would
- 00:19:25suggest doing this before you start like
- 00:19:27spriting so you like say I want to put a
- 00:19:29striped shirt on these guys there's no
- 00:19:32fast way to do that I'm just gonna have
- 00:19:33to lower the paint the pencil size to 1
- 00:19:37and just start going that way since
- 00:19:41they're already deleted you're not gonna
- 00:19:43accidentally start working on that one
- 00:19:46also that works so because this is what
- 00:19:49I did with what's the the French mafias
- 00:19:52I gave them striped shirts so a lot of
- 00:19:56them have the same chest sprite
- 00:20:01so do it to one and then you can like
- 00:20:04control C control V control C control V
- 00:20:07and just line it up and it's so much
- 00:20:08faster than actually like drawing each
- 00:20:15line out same with heads I think it's
- 00:20:17the most common with heads you want to
- 00:20:18give them a cool hat make just one and
- 00:20:21control control V it on everyone's head
- 00:20:23is that how you do it
- 00:20:26pretty much yeah what else
- 00:20:34so you're unfortunately the way I think
- 00:20:40the way your tip for animations
- 00:20:42it was eyeball it right like yeah when
- 00:20:47it comes to I mean my first tip is to
- 00:20:51see how look at the sprites
- 00:20:59but if you wanna make an animation
- 00:21:02that's completely new might want to good
- 00:21:05luck to you it's gonna take a lot of
- 00:21:11trial and error you're probably gonna
- 00:21:12want to make you probably wanna try
- 00:21:14animation multiple pines and try to get
- 00:21:18a mental image of how they look from the
- 00:21:21top down and just play with it the way I
- 00:21:30do it is I I select all the sprites in
- 00:21:33that animation since you can't add or
- 00:21:35remove any you're gonna have to like
- 00:21:37compensate for all of them so like I
- 00:21:39would copy the entire strip down like
- 00:21:42this of them of the guys smoking
- 00:21:45and then control-c and then I'm gonna
- 00:21:47open up a new one and make sure you on
- 00:21:53[ __ ] make sure you go to layer and alpha
- 00:21:57channel and then hit delete otherwise
- 00:21:59you're just gonna have that big old
- 00:22:00white background so we have these guys
- 00:22:02we're gonna zoom in on them zoom zoom in
- 00:22:07on them and they're right here and so
- 00:22:10now you can edit or you can change their
- 00:22:12colors and you can do a whole lot more
- 00:22:14without worrying about [ __ ] up the
- 00:22:15rest of the spritesheet and then the
- 00:22:18other thing is fine too like a bright
- 00:22:19color oops
- 00:22:20find a bright color that you haven't
- 00:22:22liked you know it's not on the
- 00:22:24spritesheet so I'm gonna choose bright
- 00:22:25pink right here and your gonna want to
- 00:22:29draw a line that links like so you don't
- 00:22:32have the sprites jumping around I think
- 00:22:34that's the most common issue is the
- 00:22:37sprites will jump around because you
- 00:22:39didn't place them right perfectly where
- 00:22:41they are so if you have a line
- 00:22:45and on [ __ ] basically you click one dot
- 00:22:48in and then you hold shift and you can
- 00:22:51pull this thing up and this line kind of
- 00:22:57like it's almost like a ruler sort of
- 00:22:59like when you're working on woodworking
- 00:23:01or something like it get it as long as
- 00:23:03you know each animation is one thing off
- 00:23:06from the line except for like we pulls
- 00:23:08this shoulder blade black it'll move a
- 00:23:11lot less a guy block yeah a guideline
- 00:23:16the other option if it's a completely
- 00:23:20new animation is to choose the color
- 00:23:23pickle make sure the thresholds all the
- 00:23:25way up and then go to I guess the bucket
- 00:23:30yeah that's what it's called and fill it
- 00:23:32all of them in as pink so since you're
- 00:23:36not planning on like changing the
- 00:23:37animation it's a completely new
- 00:23:39animation you can copy paste it over all
- 00:23:41of these and use their pink silhouettes
- 00:23:45to line it up so it's not bouncing
- 00:23:47around dirt when actually animates and
- 00:23:49then you can just lower the threshold
- 00:23:51all the way down to zero
- 00:23:53delete all the pink and you have a
- 00:23:55perfect lightened up and I do this with
- 00:23:56heads too so I just made this face red
- 00:24:02for my most recent campaign and
- 00:24:05basically what the way that the way you
- 00:24:10get face sprites because like it can be
- 00:24:11a bit intimidating to like recreate the
- 00:24:15same face sprite on all of these so
- 00:24:18basically what I did is I took the Swan
- 00:24:21face sprite and like I just copied it
- 00:24:24put it to another file new put it to
- 00:24:26another one and made it the way I like
- 00:24:29so I got her hair the way I like it and
- 00:24:33then what I had to do is I had a copy
- 00:24:37and paste so I took just the blank face
- 00:24:38not hurt her blinking and not her lips
- 00:24:41moving and I just copied it and then did
- 00:24:45the threshold trick right
- 00:24:46take everything and I make it special
- 00:24:51trick and color all of it in and so then
- 00:24:54when I pasted the face sprite I could
- 00:24:57just line it up based off the pink
- 00:25:00usually hair doesn't change in it in the
- 00:25:03animation so that you can line it up
- 00:25:05with like the dots in the hair let's see
- 00:25:07if I can show you what I mean
- 00:25:08I'm gonna go file how do you do faces
- 00:25:14Lego oh I remember how I started making
- 00:25:21them now just start here for people who
- 00:25:23are kind it is I essentially would just
- 00:25:26Frankenstein parts of a faces together
- 00:25:28right basically I eventually moved on
- 00:25:33like drawing on stuff custom but this
- 00:25:35thing is don't draw us to the custom
- 00:25:37list you love experiencing your doing
- 00:25:40girls
- 00:25:44yeah like breaking on that too when
- 00:25:47broccoli walkway came out with the evac
- 00:25:50the Zolder campaign the ending sprite is
- 00:25:53where he like rescues some general
- 00:25:55whatever and he kind of like the guy
- 00:25:57from No Country for Old Men the hit man
- 00:26:01but basically any time sugar I was like
- 00:26:03kind of check yeah so anyway look at it
- 00:26:07it's like black hair and it's looks
- 00:26:10[ __ ] great and so talking to him I'm
- 00:26:13like what's kind of like your process he
- 00:26:15basically was like if you look closely
- 00:26:16the kind of default as is the Colombian
- 00:26:20boss and then he like used the chin up
- 00:26:23like the fifty blessing manager so yeah
- 00:26:25like Lego said almost you're taking
- 00:26:27certain aspects and features of like
- 00:26:29existing pay sprites and sort of more
- 00:26:32from them like a big break it sounds
- 00:26:33like the best word for that is like sort
- 00:26:35of morphing it into what you're looking
- 00:26:37for that's exactly what I did with
- 00:26:40Veronica blacks
- 00:26:43what do you use for her I basically took
- 00:26:46the Swan spray yeah they can't see it
- 00:26:52because my computer can't handle a live
- 00:26:54stream in a recording at the same time
- 00:26:56it would melt so I'm trying to narrow it
- 00:26:59as best as I can for these guys I'm
- 00:27:01sorry guys
- 00:27:02so basically what I did this one's the
- 00:27:10default yeah so I took the swan face and
- 00:27:15I I copied it I put it on a different
- 00:27:19template so I could just edit the the
- 00:27:21initial face correctly and if you look
- 00:27:23closely I took she has the same exact
- 00:27:26chin I just used the like custom select
- 00:27:31tool what's it actually called the free
- 00:27:33select tool and like selected all her
- 00:27:36hurt like her hair and deleted it I also
- 00:27:40think I think I took the head like the
- 00:27:42forehead from her brother at the same
- 00:27:45head but yeah so I took face I took her
- 00:28:14chin I pluck I made her lips her lips
- 00:28:17more plump I took her eyes and like made
- 00:28:21them a little wider to like you know
- 00:28:24like how women have like that wing on
- 00:28:26the side of their eye with makeup
- 00:28:27a cat cat I yeah I made her nose less
- 00:28:32ugly and then did the hair and so when I
- 00:28:37was happy with that I control and pasted
- 00:28:53it and so you can her hair never changes
- 00:28:56in any of the animation so you can
- 00:28:57literally take it and line it up to a
- 00:29:00specific thing so the head does not
- 00:29:03wobbling around with each animation so
- 00:29:05if you line it up perfectly with the
- 00:29:07same pixel each time so I'm lining it up
- 00:29:09right you see that one that's sticking
- 00:29:12up way high I'm gonna put it right there
- 00:29:14so it looks like that yeah yeah picture
- 00:29:21it in your mind that you're just lining
- 00:29:23it up and so you do that a couple times
- 00:29:24and then eventually you'll have all of
- 00:29:30them and it's just the same expression
- 00:29:32so obviously you want their mouth to
- 00:29:33move so their mouths it's up to you to
- 00:29:38like get the mouth to open and close
- 00:29:41normally basically on hers and you have
- 00:29:44to just look at the original sprite
- 00:29:45sheet to tell she has a closed slightly
- 00:29:48open and open and then a repeat of the
- 00:29:51slightly open and then it closes so you
- 00:29:53only have to make three mouths sprites
- 00:29:55and you know make sure it's not jumping
- 00:30:00around make sure it's okay you tomato
- 00:30:02yes so you can do the metafile
- 00:30:05so use the metafile zoom it in a bit and
- 00:30:08just click through to make sure we
- 00:30:11talked about that last episode I better
- 00:30:12be recording thank God okay okay yet no
- 00:30:18lego-like with yas we got fear like ten
- 00:30:20minutes before I realized that it
- 00:30:21started recording wizard really you only
- 00:30:37have to get these three mouths correct
- 00:30:39and then copy paste it pert back where
- 00:30:41the others are so she'll have one mouth
- 00:30:45open and close why while her eyes are
- 00:30:49fully open so it starts with closed
- 00:30:51little open fully open backed a little
- 00:30:55open then back to fully closed and then
- 00:30:57that same thing copies and sometimes
- 00:30:59there's a pause like you'll see she has
- 00:31:01like this character had three fully
- 00:31:03closed mouths right in a row it's kind
- 00:31:06of various to all them and then it's the
- 00:31:08same mouth animation but her eyes blink
- 00:31:10and so in this in this one there's only
- 00:31:14two frames or her eyes actually closed
- 00:31:16there's one where they're fully closed
- 00:31:18and I just colored in her eyes with her
- 00:31:20skin tone and then do like a line in her
- 00:31:22little lashes there and then kind of
- 00:31:24squinty and like it looks a little derpy
- 00:31:27the way she's squinting at Andy who
- 00:31:29looks like she's just [ __ ] inhaled so
- 00:31:32much weed she's nothing but it's so it's
- 00:31:35so yeah
- 00:31:40I was gonna say like it like with that
- 00:31:43specific frame it's gonna look derpy but
- 00:31:45once you like obviously playtested in
- 00:31:47the made a file as long as it's fluid
- 00:31:49and like her blinking and sort of like
- 00:31:52just overall like as long as it looks
- 00:31:54didn't like fits with the right then
- 00:31:57that's all that really matters
- 00:31:58another thing is shading is important
- 00:32:00almost all the dark black lines or
- 00:32:02accompanied by a slightly less dark gray
- 00:32:06line here and that applies to in color
- 00:32:09photos - let's pull up
- 00:32:12let's pull up is it Alex Arash which
- 00:32:15one's the girl Alex yeah their names
- 00:32:20it's kind of gendered backwards but I
- 00:32:22guess Alex but like all of the collected
- 00:32:28yeah all of her dark lines are
- 00:32:31accompanied with darker shading that's
- 00:32:34the one of the biggest issues I see is
- 00:32:36people don't shade their hair correctly
- 00:32:37they like draw the hair and maybe it's a
- 00:32:39good shape but without shading it
- 00:32:41doesn't look real looks like they just
- 00:32:43have this big plastic leg of thing on
- 00:32:44their head so shading is important and
- 00:32:48so like once you get the eye and then
- 00:32:50you have your face right and just test
- 00:32:52it out back to the it might look derpy
- 00:32:56in frame let's see file
- 00:33:02and fine let's find Pardo
- 00:33:08now I made custom weapon sprites for
- 00:33:11this character and he has weapon
- 00:33:14executions which make him editing a
- 00:33:16little bit more frustrating so when he's
- 00:33:19executing with the shotgun it looks
- 00:33:22ridiculous but it's so fast as long as
- 00:33:25it's the right shape most people won't
- 00:33:28notice and so basically what I did is I
- 00:33:33took the shotgun sprite and then took
- 00:33:43the rotate tool and just kind of turned
- 00:33:47it a bit so it looks weird like that and
- 00:33:50when another thing about [ __ ] I don't
- 00:33:54know if you guys have this on your
- 00:33:55programs but when I use the rotate tool
- 00:33:58the enlarge like the scale tool like
- 00:34:02pretty much any of those like when you
- 00:34:04change like the change the spray click
- 00:34:08and drag like size perspective it comes
- 00:34:11out like there's blurry bits so the way
- 00:34:16to fix that is you turn you take the
- 00:34:18guide number of lines you crank it all
- 00:34:20the way up and you go to entry
- 00:34:22interpolation is like defaults to cubic
- 00:34:26click none and
- 00:34:29that way you'll that way like when I
- 00:34:33next time I do it so I'll control V and
- 00:34:36then
- 00:34:38turn the rotate tool this time when I
- 00:34:40rotate it it's not blurry it it'll have
- 00:34:43some weird errant sprites because it's a
- 00:34:45angry that it's not allowed to have
- 00:34:47blurry like extra things but you can
- 00:34:49like clean those up and eventually
- 00:34:51that's kind of how I got those dang gun
- 00:34:53sprites that don't look good but because
- 00:34:56it's it's up to you to like learn your
- 00:35:21program I'm gonna talk about my
- 00:35:24shortcuts you're gonna look at topic of
- 00:35:31Pardoe is the reason that his face
- 00:35:33practice so long and extensive is
- 00:35:36because he's doing both a math animation
- 00:35:38and he's also blinking like that's the
- 00:35:41case for all the characters there yeah
- 00:35:43but like it's like it's like 10 or 12
- 00:35:46frames for his and I've always been like
- 00:35:49why is it I guess because I want to make
- 00:35:50it real smooth because it's not like I
- 00:35:53mean there's repeating frames but the
- 00:35:55animation does loop sure he keeps his
- 00:36:00eyes open for longer and less frequently
- 00:36:04because smart alert hardly made me to
- 00:36:07part is the Miami mutilator sorry should
- 00:36:10have beaten the game already
- 00:36:11[Music]
- 00:36:15so another I've been I bet someone
- 00:36:17planned all these campaigns doesn't know
- 00:36:21well to be fair I didn't realize that he
- 00:36:24was the man mutilator till I read the
- 00:36:25wiki page the next day I was like oh no
- 00:36:29I get it so here's another thing it's
- 00:36:31probably specific to [ __ ] but when I
- 00:36:32choose the erase tool like and I click
- 00:36:35it first it would help if I merge the
- 00:36:39two layers but if I click it then it's
- 00:36:43like it's not erasing the whole thing
- 00:36:45like it looks weird so what you want to
- 00:36:47do is hard-edged you always check hard
- 00:36:50edge and then it erases just fine so
- 00:36:53like I guess it's because [ __ ] is from
- 00:36:59like way bigger than hotline Miami
- 00:37:01sprites so it kind of want like you know
- 00:37:04probably like if I was erasing from a
- 00:37:05huge image of like a thousand by a
- 00:37:07thousand pixels it would look better but
- 00:37:10like when you're this zoomed in on the
- 00:37:12pixels you have to turn on hard edge or
- 00:37:14it's gonna get like Google like somewhat
- 00:37:16some of the tiles are gonna your sprites
- 00:37:18are gonna be like faded I guess right
- 00:37:23so the way I do [ __ ]
- 00:37:27I've changed I don't remember off the
- 00:37:32top of my head how I changed your
- 00:37:33shortcuts which is Google it's super
- 00:37:34simple there's a lot of good [ __ ]
- 00:37:36tutorials that I just tell you how to do
- 00:37:38it there's probably a tool for it but
- 00:37:41basically I've turned ctrl s into my
- 00:37:45pencil because it's the most useful ctrl
- 00:37:47D into select like the full color ctrl Z
- 00:37:52is by default like undo ctrl Y is by
- 00:37:56default just the redo if you undid too
- 00:38:01much control e for me is erase our is
- 00:38:05just this like selector tool and then so
- 00:38:12this is another thing when you copy and
- 00:38:13paste something like you can click with
- 00:38:17the selector tool and it'll like paste
- 00:38:20onto the layer but like sometimes it
- 00:38:22doesn't want to do it or like you have a
- 00:38:24different tool selected so my shorthand
- 00:38:26is just control because it's next to V
- 00:38:28and it'll merge the layers because if I
- 00:38:30control V and I put I put the gun like
- 00:38:33where I want it and then I pull up the
- 00:38:35pencil and try to draw somewhere else
- 00:38:36it's not gonna let me it's only gonna
- 00:38:37let me do like on the selected area
- 00:38:40yeah and it's a lot like the hotkeys and
- 00:38:42shortcuts like talking about it but
- 00:38:44really like when it comes down to it and
- 00:38:46you get familiar with these programs
- 00:38:48it's just gonna save you so much more
- 00:38:50time you're gonna be like more efficient
- 00:38:52with like spreading whatnot right just
- 00:38:55like that I can create a really nice
- 00:38:57looking level and only a couple of like
- 00:38:59within 30 minutes I I'm also really fast
- 00:39:02at spriting I'm not trying to brag I'm
- 00:39:04just saying the more you work at it
- 00:39:05you'll just get you'll you'll learn
- 00:39:07tricks they'll get more efficient yeah
- 00:39:12it's funny like how long my first
- 00:39:15campaign took me compared to my most
- 00:39:16recent campaign literally they took the
- 00:39:18same amount of time human being one in
- 00:39:21human and don't fear the reaper both
- 00:39:23took a full week to finish and it's just
- 00:39:25my experience that like there's a
- 00:39:30significant jump in quality no it's
- 00:39:38funny too cuz like I was even making a
- 00:39:39cutscene the other day and just looking
- 00:39:41that I think back then it would take me
- 00:39:44like probably two days worth depending
- 00:39:47on like how big my work ethic is but
- 00:39:49like now is like I'll spend like you
- 00:39:52have like two hours and like hour and a
- 00:39:56half just like working on something but
- 00:39:57it just
- 00:39:58of course repetition and the more you
- 00:40:00get better at it the better like
- 00:40:02efficient you're gonna be with one two
- 00:40:10more things first I'm gonna talk about
- 00:40:13size unfortunately at the moment and if
- 00:40:17you can figure out how to change it let
- 00:40:20me know asap but unfortunately the
- 00:40:21moment you cannot change metafiles in
- 00:40:23any way and so the size that each object
- 00:40:27is allotted is the size that you're
- 00:40:29going to get so the biggest thing that
- 00:40:32it affects me in is slow me stop
- 00:40:39recording okay
- 00:40:41unfortunately your joke got probably cut
- 00:40:44when I stopped and started recording but
- 00:40:49he said I said I have too many [ __ ]
- 00:40:53files open yeah I don't know why it's
- 00:40:57closed I imagine it's probably made by a
- 00:41:00company doesn't it's it's a it's a new
- 00:41:03image manipulation I was I was gonna
- 00:41:09assume like English is the first
- 00:41:11language because saying that I you I
- 00:41:14like I like to use anyway right sides
- 00:41:26object to the wall sorry the right sides
- 00:41:34objects you cannot edit the native files
- 00:41:36yes yes so I'm pulling up the weapons
- 00:41:40because that's the one like that's true
- 00:41:41you see the square right here around
- 00:41:43like it's slightly more white if i zoom
- 00:41:45in you can see it so that like this is
- 00:41:48all like the space to edit the Mendoza
- 00:41:51so like I like I've seen some people
- 00:41:55make some really cool weapon sprites but
- 00:41:57they're a little bit too big for their
- 00:41:59little they use more detail ergo they
- 00:42:02need to be bigger
- 00:42:03ergo they can't fit
- 00:42:05like in there and so like my shotgun
- 00:42:11that I put a stock on for don't fear the
- 00:42:15reaper and berlin blitz it's kind of
- 00:42:17goofy-looking because
- 00:42:24it's a shotgun head of stock in the main
- 00:42:29game and I can't if I want to add it
- 00:42:30stock and just gonna have to compensate
- 00:42:31by removing part of the barrel I was
- 00:42:36gonna open up that file yes sir Piper I
- 00:42:44listened with like you can't edit this
- 00:42:48space an object occupies so of course
- 00:42:50we've touched on this before that every
- 00:42:52object or some of the objects in editor
- 00:42:55have a specific characteristic like some
- 00:42:58you can walk over them or they're like
- 00:43:00above you like the powerplant pipes but
- 00:43:03you say like a large object and the
- 00:43:05editor for example like the armored
- 00:43:07transport and if you say take that
- 00:43:11sprite sheet for it I think it's just
- 00:43:13one frame rubber and you can replace it
- 00:43:16with a plant and again very small but
- 00:43:20you put it in the editor your character
- 00:43:22is gonna like hit that area that the
- 00:43:24full like vehicles gonna be so that's
- 00:43:28like an extreme example but that's
- 00:43:30basically the point is that like be
- 00:43:32careful with like one of those
- 00:43:35previously meant the default spaces that
- 00:43:37awkward
- 00:43:44when you're doing a bunch of furniture
- 00:43:45mods I would suggest instead of trying
- 00:43:47to go through the wide because it's just
- 00:43:50stored so inconveniently to like go
- 00:43:52through them all is I would look through
- 00:43:54the item list in the editor and be like
- 00:43:57okay this is like this is sort of the
- 00:43:59size of an item that I want to make and
- 00:44:01try it with that back to the weapons
- 00:44:04thing though the way I do it is I create
- 00:44:08a little like pink wall around the
- 00:44:10weapon so like and then delete it like
- 00:44:14this so now I know exactly how much
- 00:44:18space I have to work with when I'm
- 00:44:19making whatever weapon I want to replace
- 00:44:22another important thing to modding
- 00:44:25weapons is Evan will disarm weapons all
- 00:44:30right and so like yep make sure I don't
- 00:44:35remember off the top of my head which
- 00:44:36shotgun is the disarmed one but they
- 00:44:39look just the same obviously you can
- 00:44:41tell with like the Uzi or the
- 00:44:42double-barrel look like the shotgun the
- 00:44:44pistol I think the only shells in the
- 00:44:50shotgun yeah he only just pumps up the
- 00:44:52shells really you can tell the others
- 00:44:54this pistol is actually the disarm
- 00:44:57pistol the one that you actually use is
- 00:45:00the one up here next to some of the like
- 00:45:03the knife and whatnot and then the rest
- 00:45:07of like all the guns that are like
- 00:45:10spread out this is like it it's like
- 00:45:13they pasted
- 00:45:14the hotline Miami - weapon sheet on the
- 00:45:17hotline Miami one weapon sheet so like
- 00:45:20the axe is here and the axe is there
- 00:45:22this is the X from the first game this
- 00:45:24is the axe from the second game so
- 00:45:25anything you edit here literally doesn't
- 00:45:29affect anything as far as I can tell
- 00:45:31which is sad because I mean I guess you
- 00:45:37can get away with that when you have a
- 00:45:38huge variation yeah well I really like
- 00:45:41the way like the random weapon would
- 00:45:42spawn each time he died I think it's a
- 00:45:56gun or weapon in the first game that
- 00:45:58it's almost like the size of like a
- 00:46:00scorpion and yet its rate of fire is
- 00:46:05ridiculous but remember you get like
- 00:46:21this scissors - but like just like the
- 00:46:24variation of that like we got like
- 00:46:26Jake's like the bottle but like that is
- 00:46:29all right even though like the death
- 00:46:30animation is just like so [ __ ] long
- 00:46:33and I'm just like I have time to sit
- 00:46:36through those and then the last topic
- 00:46:41that I have on my list is gradient and
- 00:46:44this is something that Danny taught me
- 00:46:46while I was working on Berlin blitz is
- 00:46:48like I show I was like showing everyone
- 00:46:51my tank and he's like dude there's this
- 00:46:55thing has no shading so shading really
- 00:46:58helps Express when things downward slope
- 00:47:01because everything's that from straight
- 00:47:03top down in the game it's hard to
- 00:47:05express like what it is
- 00:47:07okay this tank is not walking this is
- 00:47:10the wrong tank it's armored transport
- 00:47:19better repose yep
- 00:47:21so like the tank group art the tank
- 00:47:24replaces armored transport did I just go
- 00:47:28so the like the turret here slopes down
- 00:47:31and seemed with the front here and I'm
- 00:47:35not the best spriter it's not the best
- 00:47:36thing but I think Lego will totally back
- 00:47:39me up when I say shading is everything
- 00:47:41yeah
- 00:47:42shaving also with [ __ ] if you hold ctrl
- 00:47:50with the with the pencil active if you
- 00:47:54hold ctrl and then click on a different
- 00:47:55color like you'll sample that color
- 00:47:57which is super useful but so basically
- 00:48:00when you're wanting to shade something
- 00:48:02you take your original color and you
- 00:48:05draw it and then you click on whatever
- 00:48:07you're doing and you make it darker by
- 00:48:10just like a couple points so I'm gonna
- 00:48:12like to choose this and then yeah just
- 00:48:16kind of go down on the black line and do
- 00:48:18that and then you click and it goes down
- 00:48:21a bit and like you just keep doing that
- 00:48:23it's tedious but it really pays off and
- 00:48:25like making things look around or sloped
- 00:48:28down kind of depending like when you
- 00:48:30know when appropriate
- 00:48:31yeah gradients are just super useful
- 00:48:35this barrel needs shading revolutionize
- 00:48:40my thing and I opened up like 20
- 00:48:42different sprites that I like a you know
- 00:48:59that song it's called [ __ ] it's coming
- 00:49:02my girl or something but oh it seems by
- 00:49:06other temptations
- 00:49:11like rock like no we're keeping that
- 00:49:13like anyways I think that covers
- 00:49:16everything ask me questions in the
- 00:49:17comments as always and I'll do my best
- 00:49:20to answer them or send you to the
- 00:49:23correct video that answers them thanks
- 00:49:26for watching thank you so much Lego for
- 00:49:28coming on yeah yeah hopefully we can do
- 00:49:34something else like this sorry we took
- 00:49:36so long and it's probably your bedtime I
- 00:49:42do appreciate your little your input and
- 00:49:45you have any plugs you want to give
- 00:49:47yourself a shout-out if you know the
- 00:49:55editor you know Lego he's got the number
- 00:49:58one thing on here yeah great great yeah
- 00:50:16maybe
- 00:50:17I'll link that or something is it a
- 00:50:20video or is it just like a poster
- 00:50:30[Music]
- Hotline Miami 2
- level editor
- spriting
- pixel art
- animation
- game design
- Photoshop
- paint.net
- guidelines
- shading