Appstore Blogs
If you’ve read my previous blog post, you now know how easy it can be to create basic game art. The next step is to add proper lighting, textures, and details. Whether you want to draw rocks, some foliage, or a giant robot, there’s a trick for every effect. Let's dive right in and have a look at different shapes, colors, textures, and other details!
Shapes
Every drawing starts with a few basic shapes. By rotating, scaling, and positioning these shapes, you can create complex compositions. Try to imagine how a complex figure is built using only a few basic shapes (like displayed below). This will be a great starting point for your sprite.
Colors
Sometimes you want to make it clear that a shape or sprite is a certain material or has a specific use. When working with 3D models, it’s easy to tweak material settings and get them looking exactly like they do in real life. When creating 2D art, you’ll have to perform some tricks. It all starts with the color.
Same sprite, different colors (and thus materials).
As you can see in the image above, the same texture is applied on blocks with different colors. Most players would figure out what these materials are solely based on the color. Textures are equally important however, so let's see a few tricks.
Textures
Adding textures and patterns to an otherwise boring surface can add a bit of detail without straying too far from the overall look of the sprites. The easiest way to create a texture is to randomly duplicate a tiny sprite along the surface.
An egg shape, triangle, tiny leaf, or even just a rectangle can create natural looking textures for foliage. Try to experiment using different shapes; it doesn’t always have to be realistic!
These techniques can be applied to other materials as well. Scattering the details randomly is great for natural materials, but for man-made, it’s best to follow a grid or structure.
Creating seamless textures can be hard, but there’s a trick. Simply create the shape you want to use for the texture, duplicate it in all corners, and remove the overflowing lines. Then, fill the rest of the shape using the same shape. Now, you can place tiles together and the shapes will align perfectly.
Sample textures for various materials and patterns.
Try different shapes for brick walls, cobblestone roads, or wooden planks. Make sure to also duplicate any shape that isn’t in the corner, but overflows on either side.
Lighting
Figuring out where shading should be applied can be a difficult process, especially for artists with little experience. A common mistake is to apply ‘pillow shading,' a technique where shading occurs in all directions. Assuming there’s only a single light source (the sun), shading should be applied in a single direction.
While not common practice, it can make things easier to have the light source directly above the sprite.
If you’re planning to flip sprites horizontally, you can save some work by making the source of the light directly above the object. This isn’t common in art, but it will save you some time creating multiple sprites.
Imagine your sprite in 3D for a guide where shadows are cast.
Unsure where shadows and highlights should be applied? Try to picture your sprite in 3D, that way you can draw an imaginary line and see where a shadow would be cast, and where highlights are needed.
Details
Metal
Add depth to metal surfaces using shadows and highlights. To add even more detail, you can add bolts and screws. These come in all shapes and sizes, but the easiest way to draw one is just to create a circle. You can add a darker diagonal line (or two) for a bit more detail.
Most metal you’ll come across isn’t brand new and has some wear and tear. Create a single line and duplicate it below the first line, make the top line a darker color and the bottom line a lighter one. You can create straight lines, or go wild and scribble some lines for more realistic scratches.
Metal plating can be done by adding random shapes of darker and lighter color, adding screws (or even simple circles) in the corners to convey the plating effect.
Various ways for adding details to metal surfaces.
Create a specular effect by drawing several diagonal lines, then change the color to a slightly lighter one than the background. If you’re more familiar with drawing tools, you can use a gradient (from light to transparent) for more realism.
Painted metal often chips along the edges, so add ragged edges (a combination of triangles, or random geometric shapes) around the outline and show the bare metal color.
Paper/fabric
Maps and flyers often get folded, and there’s an easy way to give an effect like this to your sprite. Simply draw a grid of lines on the sprite, but never let any of the lines cross. Cut away (or erase) the crossings. Pick a slightly darker color than the sprite itself for the grid.
You can also apply some techniques for other materials to wood. Torn paper, screws, and scratches work really well for making wood look a bit more natural.
Similar to the scratches of the metal, you can add cracks and edges to stone.
Final words
By now you’ve learned a few different tricks to create sprites, apply shading, and add textures. There’s much more to explore however and the best advice I can give you is to try and experiment yourself. If you keep experimenting (and failing!), you’ll keep learning and your next sprite is going to look better than your previous. Good luck!
If you enjoyed this post, check out my other articles:
- How Non-Artists Can Use Free Software to Create Basic Sprites and Models
- An Intro to Low-Poly and Flat Design
