Would you like to inspect the original subtitles? These are the user uploaded subtitles that are being translated:
1
00:00:13,800 --> 00:00:15,649
Hey guys, Nelson here.
2
00:00:15,652 --> 00:00:18,140
Welcome back to my pixel art lesson.
3
00:00:19,300 --> 00:00:20,549
This week we're going to be
4
00:00:20,552 --> 00:00:23,029
focusing on the different sizes of pixel art.
5
00:00:23,032 --> 00:00:25,370
And what kind of effect each size will have.
6
00:00:26,720 --> 00:00:28,019
We're going to be covering topics
7
00:00:28,022 --> 00:00:30,909
like making items in different sizes,
8
00:00:30,912 --> 00:00:33,019
making items in different angles,
9
00:00:33,022 --> 00:00:36,149
and coming up with item concepts that are interesting
10
00:00:36,152 --> 00:00:38,690
and also talking about how to modify them.
11
00:00:40,210 --> 00:00:41,959
Is this video, we're going to be talking about
12
00:00:41,962 --> 00:00:44,609
the different sizes for pixel art.
13
00:00:44,612 --> 00:00:47,779
So what is the best size for pixel art?
14
00:00:47,782 --> 00:00:50,419
The short answer is: it really depends on the look
15
00:00:50,422 --> 00:00:55,099
you're trying to go for and how much detail you're trying to convey.
16
00:00:55,102 --> 00:00:58,559
Pixel art size has three considerations:
17
00:00:58,562 --> 00:01:00,516
What platform are you targeting?
18
00:01:00,518 --> 00:01:02,738
Subtitled by
-♪ online-courses.club ♪-
We compress knowledge for you!
https://t.me/joinchat/ailxpXoW3JVjYzQ1
19
00:01:02,739 --> 00:01:05,819
On a mobile screen, for console, or PC?
20
00:01:05,822 --> 00:01:08,090
What kind of aspect ratio is it?
21
00:01:09,170 --> 00:01:11,379
The most common is 16 by 9,
22
00:01:11,382 --> 00:01:13,259
but some pixel art games take a
23
00:01:13,262 --> 00:01:17,089
ratio of 4 by 3 or one by one.
24
00:01:17,092 --> 00:01:19,409
How do you want your pixel art to look like?
25
00:01:19,412 --> 00:01:23,459
You can have a low resolution or high resolution.
26
00:01:23,462 --> 00:01:25,019
As a good point of reference,
27
00:01:25,022 --> 00:01:27,309
let's look at our screen resolution.
28
00:01:27,312 --> 00:01:31,629
Most screens today are 16 by 9 aspect ratio,
29
00:01:31,632 --> 00:01:37,310
and that's usually a 1920 x 1080 or 1280 by 720.
30
00:01:38,620 --> 00:01:40,699
So we can take that number
31
00:01:40,702 --> 00:01:42,940
and we can downscale it for our pixel art.
32
00:01:44,670 --> 00:01:47,749
Let's use 1920 x 1080 as our base number,
33
00:01:47,752 --> 00:01:50,459
which is our screen size.
34
00:01:50,462 --> 00:01:56,759
Let's try dividing this number by 2, 3, 4, 5.
35
00:01:56,762 --> 00:01:57,759
And each of these sizes
36
00:01:57,762 --> 00:02:01,929
will produce a different effect for your pixel art.
37
00:02:01,932 --> 00:02:03,649
The higher the resolution,
38
00:02:03,652 --> 00:02:06,340
the more detail you can apply to your scene.
39
00:02:08,640 --> 00:02:10,389
Let's talk about some pixel games
40
00:02:10,392 --> 00:02:12,290
and what kind of resolutions they use.
41
00:02:14,090 --> 00:02:17,250
For our first example, let's talk about Hyper Light Drifter.
42
00:02:19,070 --> 00:02:22,189
It's around 480 by 270 pixels
43
00:02:22,192 --> 00:02:24,529
and the quality is already really high
44
00:02:24,532 --> 00:02:27,109
there's loads of details in the scene
45
00:02:27,112 --> 00:02:31,840
and they follow a 16 by 16 tile set up being a top down game.
46
00:02:33,500 --> 00:02:37,049
The character sprites are around 21 pixels high
47
00:02:37,052 --> 00:02:40,589
and you see, they really simplify the character design
48
00:02:40,592 --> 00:02:42,559
and not add too much detail
49
00:02:42,562 --> 00:02:44,109
just a couple of things that stick out
50
00:02:44,112 --> 00:02:45,600
and not make it too noisy.
51
00:02:47,100 --> 00:02:49,289
Their head only being 9 pixels
52
00:02:49,292 --> 00:02:51,439
and there eye only being one pixel.
53
00:02:51,442 --> 00:02:56,419
The character sprite fits within the 16 by 16 tile
54
00:02:56,422 --> 00:02:59,160
and that tile helps get all the rest of the world.
55
00:03:01,440 --> 00:03:03,209
Let's talk about Metal Slug.
56
00:03:03,212 --> 00:03:07,239
The resolution is 330 by 224
57
00:03:07,242 --> 00:03:09,719
and this is probably one of my top Inspirations
58
00:03:09,722 --> 00:03:12,239
for older pixel art games.
59
00:03:12,242 --> 00:03:14,499
Their backgrounds are just so beautiful.
60
00:03:14,502 --> 00:03:17,799
And they really utilize the depth of field using color
61
00:03:17,802 --> 00:03:19,940
and various details on each plane.
62
00:03:21,210 --> 00:03:23,999
They like to use really faded out colors in the
63
00:03:24,002 --> 00:03:26,449
background to give the sense of depth
64
00:03:26,452 --> 00:03:29,149
and adding more harsh shadows
65
00:03:29,152 --> 00:03:32,949
and saturated colors to the playable area in the front.
66
00:03:32,952 --> 00:03:35,580
Just overall a really fun shootem game.
67
00:03:37,630 --> 00:03:41,309
The character sprites are around 37 pixels tall.
68
00:03:41,312 --> 00:03:43,869
With their heads only being 14 pixels tall
69
00:03:43,872 --> 00:03:48,089
giving a more chibi like body to them.
70
00:03:48,092 --> 00:03:51,029
You can see that there's a little bit more room for detail
71
00:03:51,032 --> 00:03:52,979
for the characters but overall their
72
00:03:52,982 --> 00:03:54,540
design is still really simple.
73
00:03:56,100 --> 00:03:58,239
Looking from afar, this character has
74
00:03:58,242 --> 00:04:01,059
brown hair with a yellow jacket,
75
00:04:01,062 --> 00:04:02,939
tan pants and brown boots.
76
00:04:02,942 --> 00:04:04,610
And that's all you really need to see.
77
00:04:05,770 --> 00:04:08,579
Adding extra little details like sunglasses
78
00:04:08,582 --> 00:04:13,249
or socks or a golden watch or even a tattoo
79
00:04:13,252 --> 00:04:16,779
It will make the pixel art a bit more noisy
80
00:04:16,782 --> 00:04:18,859
and the character design will start to
81
00:04:18,862 --> 00:04:23,139
get lost at smaller sizes, simplicity is really key.
82
00:04:23,142 --> 00:04:26,279
It's really a game of subtraction and thinking about
83
00:04:26,282 --> 00:04:28,609
what kind of details do you want to keep
84
00:04:28,612 --> 00:04:29,990
and what you want to take out
85
00:04:31,830 --> 00:04:33,819
Let's talk about Street Fighter 2.
86
00:04:33,822 --> 00:04:38,719
They have a resolution of 384 by 224.
87
00:04:38,722 --> 00:04:41,139
And their backgrounds are really beautiful.
88
00:04:41,142 --> 00:04:42,969
They have more a limited color
89
00:04:42,972 --> 00:04:45,380
palette and a lot of dithering going on.
90
00:04:46,630 --> 00:04:49,869
These characters have a lot of detail to them
91
00:04:49,872 --> 00:04:53,199
Since these characters are more realistically portrayed,
92
00:04:53,202 --> 00:04:55,759
the sprites are round 77 pixels high
93
00:04:55,762 --> 00:05:00,009
and their heads being around 13 pixels high.
94
00:05:00,012 --> 00:05:02,819
This sort of sprite size gives us more opportunity
95
00:05:02,822 --> 00:05:05,819
to add details and give a more rendered look.
96
00:05:05,822 --> 00:05:08,759
Look how beautiful those clothing folds are
97
00:05:08,762 --> 00:05:10,379
we wouldn't have that opportunity
98
00:05:10,382 --> 00:05:12,860
if we were working in a smaller sprite size.
99
00:05:14,370 --> 00:05:17,899
With each division, the amount of pixels to work with will decrease
100
00:05:17,902 --> 00:05:19,329
and the look of your pixel art
101
00:05:19,332 --> 00:05:21,569
will be of a lower fidelity.
102
00:05:21,572 --> 00:05:23,489
All of these sizes are valid
103
00:05:23,492 --> 00:05:26,719
and it just depends on what you're looking to go for.
104
00:05:26,722 --> 00:05:28,319
It's a lot of guesswork at first,
105
00:05:28,322 --> 00:05:31,429
but you'll find a size that you're comfortable with
106
00:05:31,432 --> 00:05:35,999
For example, my backgrounds are usually 400 by 225
107
00:05:36,002 --> 00:05:38,519
and I slept with that size
108
00:05:38,522 --> 00:05:41,989
because I like how the pixels are clearly defined
109
00:05:41,992 --> 00:05:45,660
but still have enough detail to retain in each object that I draw.
110
00:05:47,380 --> 00:05:51,109
These item collages of snacks found at the convenience store,
111
00:05:51,112 --> 00:05:54,909
they're bound by a 250 by 250 canvas size
112
00:05:54,912 --> 00:05:58,179
Though, each item is drawn in a different dimension.
113
00:05:58,182 --> 00:05:59,799
It really depends on how much detail
114
00:05:59,802 --> 00:06:01,360
you want to convey in each object.
115
00:06:02,270 --> 00:06:05,380
Let me show you a coffee can drawn in six different sizes.
116
00:06:06,690 --> 00:06:09,079
I'll explain the nuances of each one
117
00:06:09,082 --> 00:06:10,679
and how each size will change
118
00:06:10,682 --> 00:06:12,740
your perception of the same object.
119
00:06:13,790 --> 00:06:17,689
For this lesson, I want you guys to find some sort of household item
120
00:06:17,692 --> 00:06:19,979
and draw it in six different sizes as well
121
00:06:19,982 --> 00:06:22,139
and create a sizing chart like this
122
00:06:22,142 --> 00:06:25,819
and understand the effect each size has.
123
00:06:25,822 --> 00:06:28,580
Let's start with the biggest size and work our way down.
124
00:06:29,790 --> 00:06:31,559
So to get a point of reference,
125
00:06:31,562 --> 00:06:35,339
I found it useful to take one element from that object
126
00:06:35,342 --> 00:06:37,619
and define it properly and scale-up
127
00:06:37,622 --> 00:06:38,890
everything else from there.
128
00:06:39,980 --> 00:06:43,359
So I have a height of 3 pixels to work with
129
00:06:43,362 --> 00:06:45,109
and that's like the minimum
130
00:06:45,112 --> 00:06:47,689
to define English in pixel form
131
00:06:47,692 --> 00:06:50,340
From there, I can scale everything else around it.
132
00:06:52,130 --> 00:06:53,879
This can is nice and detailed
133
00:06:53,882 --> 00:06:56,860
and really good for a sort of illustration size.
134
00:06:58,990 --> 00:07:01,059
You can see a lot of the text clearly
135
00:07:01,062 --> 00:07:04,700
and it's more of a realistic portrayal of this coffee can.
136
00:07:06,220 --> 00:07:08,039
Moving on to the next size,
137
00:07:08,042 --> 00:07:11,200
It's 2/3 of the previous object.
138
00:07:12,290 --> 00:07:14,099
And you can start to see the text
139
00:07:14,102 --> 00:07:16,389
take on a more abstract form
140
00:07:16,392 --> 00:07:21,469
regular coffee is just lines and dots of pixels.
141
00:07:21,472 --> 00:07:24,509
Some of the Japanese text is blocked in
142
00:07:24,512 --> 00:07:26,690
and can't be defined anymore.
143
00:07:28,440 --> 00:07:30,679
Although UCC and the word
144
00:07:30,682 --> 00:07:33,859
black are still really legible.
145
00:07:33,862 --> 00:07:37,890
Moving on to the next size, it's scale down to 21 by 45.
146
00:07:39,240 --> 00:07:41,899
Here we start to see if that all the small text
147
00:07:41,902 --> 00:07:45,449
including UCC are really hard to define properly
148
00:07:45,452 --> 00:07:46,880
and have to be abstracted.
149
00:07:48,470 --> 00:07:51,269
In the previous sizes, we had the opportunity
150
00:07:51,272 --> 00:07:56,859
to make the word black in bolder text true to its design.
151
00:07:56,862 --> 00:07:58,279
But in this current size
152
00:07:58,282 --> 00:08:02,009
we can only make the font 1 pixel thick.
153
00:08:02,012 --> 00:08:05,629
Moving on to the next size, it's 11 by 24
154
00:08:05,632 --> 00:08:07,549
and here you really start to see
155
00:08:07,552 --> 00:08:09,310
everything turned abstracted.
156
00:08:11,010 --> 00:08:13,139
Any kind of small text and details
157
00:08:13,142 --> 00:08:14,759
are turned into dots and dashes
158
00:08:14,762 --> 00:08:17,599
that are one pixel high.
159
00:08:17,602 --> 00:08:19,819
Each detail placed is really important
160
00:08:19,822 --> 00:08:21,599
and you have to try simplifying
161
00:08:21,602 --> 00:08:24,539
while retaining the design of the object
162
00:08:24,542 --> 00:08:27,329
and you can see that even at this really small size.
163
00:08:27,332 --> 00:08:29,220
It still looks like a coffee can.
164
00:08:31,180 --> 00:08:35,549
Moving on to the second last can, it's 6 by 13 pixels
165
00:08:35,552 --> 00:08:37,729
and here you can really see that
166
00:08:37,732 --> 00:08:39,789
I'm very selective about what
167
00:08:39,792 --> 00:08:42,859
details to portray properly.
168
00:08:42,862 --> 00:08:44,799
There's only room for the top label,
169
00:08:44,802 --> 00:08:48,059
which is now 1 pixel tall and the word
170
00:08:48,062 --> 00:08:50,289
black is only two pixels tall
171
00:08:50,292 --> 00:08:53,209
and I can only have enough room for the circle
172
00:08:53,212 --> 00:08:55,549
label and the yellow bar
173
00:08:55,552 --> 00:08:59,319
which are now two and one pixel tall.
174
00:08:59,322 --> 00:09:01,659
Any kind of small texts that was previously
175
00:09:01,662 --> 00:09:05,239
there is not able to fit in the small size,
176
00:09:05,242 --> 00:09:07,390
but it still reads as a coffee can.
177
00:09:09,030 --> 00:09:12,220
And moving on to our last size it's 3 by 7.
178
00:09:13,860 --> 00:09:17,239
We only have 7 pixels in height to work with
179
00:09:17,242 --> 00:09:20,699
so we have to be really selective.
180
00:09:20,702 --> 00:09:21,929
So the only details
181
00:09:21,932 --> 00:09:25,469
I chose to put were the top and bottom of the can
182
00:09:25,472 --> 00:09:29,250
and the word black and the yellow seal in the middle.
183
00:09:30,930 --> 00:09:33,629
There's no room for a bevelling like in previous cans
184
00:09:33,632 --> 00:09:36,930
because it wouldn't look like a can anymore if this was bevelled.
185
00:09:38,620 --> 00:09:40,819
In this exercise, I wanted to show you guys
186
00:09:40,822 --> 00:09:43,559
how much detail you can put into each size
187
00:09:43,562 --> 00:09:46,379
and how even at smaller sizes, it can still look like
188
00:09:46,382 --> 00:09:47,840
the object you're trying to convey.
189
00:09:49,630 --> 00:09:52,209
You're still able to put in a lot of details.
190
00:09:52,212 --> 00:09:54,869
You just have to be selective about it
191
00:09:54,872 --> 00:09:58,290
and think about what kind of key elements define this object.
192
00:09:59,790 --> 00:10:02,138
For my example, the key elements are the two metal rings,
193
00:10:02,139 --> 00:10:04,182
Subtitled by
-♪ online-courses.club ♪-
We compress knowledge for you!
https://t.me/joinchat/ailxpXoW3JVjYzQ1
194
00:10:04,183 --> 00:10:07,389
the a black can, they UCC logo,
195
00:10:07,392 --> 00:10:10,499
the black logo, yellow
196
00:10:10,502 --> 00:10:12,300
seal, and the small text underneath
197
00:10:14,140 --> 00:10:16,549
From there, I can get a sense of what elements
198
00:10:16,552 --> 00:10:18,900
I need to keep and what can be subtracted.
199
00:10:20,390 --> 00:10:22,119
A common way in top-down games
200
00:10:22,122 --> 00:10:24,350
is to follow the scaling of grid tiles.
201
00:10:25,990 --> 00:10:31,579
Usually they go by 16, 24, 32, and 64-bit
202
00:10:31,582 --> 00:10:34,479
and we use those tiles to help scale up the world
203
00:10:34,482 --> 00:10:35,520
that we're creating.
204
00:10:37,310 --> 00:10:38,909
Here's a delicious bento box
205
00:10:38,912 --> 00:10:41,799
that I made for a top-down style game.
206
00:10:41,802 --> 00:10:43,559
Though, it's a bit too big
207
00:10:43,562 --> 00:10:46,370
and doesn't follow the dimensions of the game.
208
00:10:47,570 --> 00:10:48,829
This size would be used more
209
00:10:48,832 --> 00:10:50,530
for a really detailed cutscene.
210
00:10:52,160 --> 00:10:55,209
So I decided to downscale the bento box
211
00:10:55,212 --> 00:10:58,850
and downsize it to each tileset size.
212
00:11:00,640 --> 00:11:05,859
I personally like getting between the 64 to 32 bit range.
213
00:11:05,862 --> 00:11:08,909
Because it offers a lot of room for detail,
214
00:11:08,912 --> 00:11:10,830
even though you have a really small size.
215
00:11:12,220 --> 00:11:15,259
But I actually really enjoy the 16 bit size in this one
216
00:11:15,262 --> 00:11:18,720
because you can still recognize that it's a bento box.
217
00:11:19,730 --> 00:11:21,949
You can mostly see all the main components
218
00:11:21,952 --> 00:11:25,699
like the rice, the plum, the salmon,
219
00:11:25,702 --> 00:11:27,650
the vegetable, and the side dishes.
220
00:11:28,740 --> 00:11:31,509
These are all valid sizes and it's really up to you
221
00:11:31,512 --> 00:11:33,500
to choose which one works best for you.
222
00:11:35,740 --> 00:11:38,179
If you're first starting out making pixel art,
223
00:11:38,182 --> 00:11:40,889
I recommend training yourself in smaller sizes
224
00:11:40,892 --> 00:11:44,259
because it really encourages you to be more thoughtful
225
00:11:44,262 --> 00:11:47,429
and selective about what details to choose
226
00:11:47,432 --> 00:11:50,109
Having it read properly at smaller scales
227
00:11:50,112 --> 00:11:51,949
and understanding how to use
228
00:11:51,952 --> 00:11:53,790
each pixel is really important.
229
00:11:55,190 --> 00:11:59,300
I'd say a small size to work with is under 30 pixels.
230
00:12:00,120 --> 00:12:02,659
Anything larger than that would be like a medium
231
00:12:02,662 --> 00:12:04,129
or a large size.
232
00:12:04,132 --> 00:12:07,140
Kinda like this coffee can or this bento box.
233
00:12:08,820 --> 00:12:10,779
Working in larger dimensions
234
00:12:10,782 --> 00:12:13,259
gives more opportunity for detail
235
00:12:13,262 --> 00:12:15,460
and it's more similar to digital painting.
236
00:12:17,320 --> 00:12:20,119
I recommend working in smaller sizes to train yourself
237
00:12:20,122 --> 00:12:21,169
if you're a beginner
238
00:12:21,172 --> 00:12:24,190
and then slowly work up the larger sizes later on.
239
00:12:25,250 --> 00:12:27,239
But yeah, that's about it.
240
00:12:27,242 --> 00:12:29,129
Thank you guys so much for watching
241
00:12:29,132 --> 00:12:31,259
and let me know what you guys
242
00:12:31,262 --> 00:12:33,339
think about pixel art sizes.
243
00:12:33,342 --> 00:12:35,469
What's your favorite size to work on?
244
00:12:35,472 --> 00:12:38,079
What kind of objects are you guys into drawing?
245
00:12:38,082 --> 00:12:39,839
I can't wait to see your sizing charts
246
00:12:39,842 --> 00:12:42,099
and see what kind of objects you draw.
247
00:12:42,102 --> 00:12:45,009
So in the next video, we're going to be talking about
248
00:12:45,012 --> 00:12:47,079
drawing items in different angles
249
00:12:47,082 --> 00:12:49,380
and talking about each step along the way.
250
00:12:50,720 --> 00:12:53,500
Thanks so much everybody and see you in the next video.
19131
Can't find what you're looking for?
Get subtitles in any language from opensubtitles.com, and translate them here.