Chat with us!
Active Forum Topics - (view more)
- LPC Enemies? by Gaurav
- Sharing My Music and Sound FX - Over 2000 Tracks by Eric Matyas
- [Godot 3.5] LPC Character Spritesheet Plugin - now in Asset Library by JaidynReiman
- How to make Subway Surfers like Endless Runner Game Tutorial by mujtaba-io
- how should I improve my pixel art? by Ragnar Random
- Minimalist Sidescroller Collab sheet. by LunaVR
- RTS Game tutorial for Godot Engine by mujtaba-io
- Manic Minutes by Technopeasant
Recent Comments - (view more)
- Re: OGA Fall Game Jam 2024 Logo by VoyPix
- Re: Cursed Lava Golem Knight Pixel Art Animation by VoyPix
- Re: Cursed Lava Golem Knight Pixel Art Animation by Ragnar Random
- Re: Martian tripod vehicle by shedman
- Re: Animated Shadowy Portraits by MedicineStorm
- Re: Animated Shadowy Portraits by Croomfolk
- Re: Box truck + Package by MedicineStorm
- Re: The Swamps by hatmix
Chapter 2: Lines and Curves
If you're not already an accomplished artist, the best way for you to start a drawing is to do it in pencil, the ink once you are satisfied, then color it. The same goes for the pixel-art: the first step in am image is the delimitation of its contours -- this step is called the "Lineart". Lineart is a very important step to achieve a good piece of pixel-art. A few pixels of your image can make up a large percentage of your image (as opposed to a drawing, where the scale allows for greater tolerance) so that an error of one or two pixels can give a make your character look really deformed. To be clear, lineart accuracy is C-R-U-C-I-A-L to the success of a pixel art.
1. Straight
Lineart is composed mainly of lines and curves, and we'll start by talking about straight lines. Those of you who were listening in math class know that a line is characterized by its slope. It is the ratio of "change in y" to "change in x". For the purpose of this tutorial, we will represent this ratio as y:x. Thus, a perfect diagonal "bottom left" to "top right" line is a straight 1:1. Here are some simple guidelines and their coefficients to illustrate the idea.
In pixel-art, the lines that use these simple coefficients (0:1, 1:2, 1:1, 2:1 and 1:0), are called "perfect lines". They make your image look good because the eye can follow them without difficulty. They are not the only ones you can draw, you can for example make "intermediate" lines by alternating segments of length two with segments of length one (to simulate segments of length 1.5 -- see example image). The result is much less aesthetic (especially since the image is enlarged 4 times so you can see what happens) and shows why it's so important to use these kinds of lines sparingly. They still have their usefulness, though, and you will learn to embellish in a more advanced section of the course.
2. Curves
Well, now you know how to draw lines, but you won't get far with just straight lines. Let us therefore look at curves, which are a more complex matter. Unlike a line, a curve can be good or bad. There is only one rule to follow to achieve a smooth curve: the length of the segments will vary in a progressive manner, and you should avoid right angles. Well okay, that's two rules, but in fact the second is included in the first. For example: In Green, a you can see a nice curve that follows this rule perfectly. (From left to right, the lengths are 5 4 3 2 2 1 1 1 2 3 3 3 2 1 1 2 2 1 2 1 2 1 1). The red curve, on the other hand, is flouting it shamelessly (note the right angle that appears in the curve). In the end, a good technique to draw a curve is to draw the curve by hand (we get something like the red curve) and then go back and the change it until it meets "the rule". This ensures in advance that the curve will have the look you want. Well, that's it for curves. In conclusion, I leave you with some small examples of this course. The first is a dragon with curves illustrating the principles of outlined above; the second is a sword that shows that sometimes more angular lines (look at the tip and the pommel) can also be useful in some circumstances.
I strongly recommend you practice some Lineart before you continue reading -- you'll need it to complete the rest of the course (as I will use the dragon above). If you have trouble, you can always use a scanned drawing.