Hey guys. Do you guys know any tutorials on the web on how to create sprites using Photoshop, as well as on how to animate them?
Thanks a lot.
There are a few easy steps:
1) Pick a game engine, or at least a rendering engine.
2) Learn how this engine handles sprites
3) Learn principles of animation
4) Learn an animation software, hopefully one that will allow you to export files compatible with your engine.
6)Export animations in compatible format
7) Fiddle some more with the files if necessary (for exemple, if your animation software exports individual bmp's you might need to assemble them in a strip in Photoshop)
8 )Integrate into software you are developping.
use square brush with 100 hardness and desired pixel width . make your file with the desired width & Height.
in photoshop open up your animation window. ( window > animation)
in that animation window switch to frame mode if not already there (square frame icon on the lower right)
create the number of frames desired and separate your sprites in seperate folders for each frame that way you can turn on and off desired art for each frame (easiest cleanest way i have found)
thats pretty much it. then it depends on your art skills and animation skills, quite simple really, just like animating on real paper.
Thanks guys! Do you have tips on creating 32x32 sprites? I'm doing something like the early Final Fantasy ones but in isometric. I sketched something out, but I find it hard to make a pixelized version of it. Plus my sketch gets all messed up once I resize to 32x32 so it's hard to use as a guide.
Hi, Maybe you know this but the pencil tool does not produces anti-aliasing when drawing at the pixel level.
Deviant art is actually a great search engine for excellent tutorials (especially for what you'd expect from dA, sprites, animuu or anything fanart)
Here, how to make pixel art:
How to animate it:
Other varying sprite tutorials:
There was a weekly sprite competition here about a year ago. You might do a search to see if there are links and tips to help you. I can almost guarantee that there are. Way of the pixel is a good start.
here is another link I had in the archives.
use a 1 px square pencil brush. sketch out your dude roughly in the small size. create new layer and paint out your guy following your sketch. use 2 -3 tone levels ( shadow, mid tone, highlight) and what helps me usually is creating an isometric tile in a layer so i sorta know the angle I'm supposed to be drawing at. Don't use opacity that will only mess you up.
Oh and when animating, anything you do to the layer on the first frame will move all other frames so careful with that.
One thing which really helps when doing art in general, faces and pixel art in particular, is to create a New Window (under Arrange) and set it at a different zoom. When doing pixel art I set the window I'm not working in to 200%, and the work window to much more.
I turn on the Grid if I'm working with tiles.
Pencil tool is good, yeah. Sometimes if I work with a big palette (256) I just paint big, scale down and clean up the pixels. Sometimes I set the pencil tool to 60% opacity if I want to paint and blend at a pixel level.
It's a pity PS doesn't have some of Deluxe Paint's features. I know there are some new similar programs, but I prefer working in PS.
Jamen jag tror att han skäms, och har gömt sig. Vårt universum det är en av dom otaliga spermasatser som Herren i sin självhärliga ensamhet har runkat fram för å besudla intet.
lookin good, its roughness could be why it doesnt skew at 32x32 so well, try making a linework of it first
if you shrink that to 32x32 it will be too blurry to translate. So just use it as reference and not a tracing device. redraw an outline of him as close as you can to what you want to achieve in the 32x32 square.
the guy has enough detail i think and he's looking good. Keep at it.
Here's a tip: Make a 32*32 size canvas and draw a cube. Now, take that design and work it within that cube's boundaries. I don't know if this technique works for you, but try it anyway.
The Louisianian Sketchbook You can Comment and Criticize if you want.
My Newgrounds Profile Warning: Politically Incorrect thoughts, view at your own risk.
My Facebook Site I normally hate these kinds of websites, but a friend of mine invited me.
Louisianian artists thread If you're from or live in Louisiana, don't hesitate to post here.
My Profile Nothing else needs to be said.
Trillian: Request to be added first.
yeah actually you dont even need to do anything more, I resized it to 32x32 on photoshop (hope you dont mind, I was just curious) and it seems ready. well first I centered it, and removed the excess space before resizing, so that at least in height the little guy is literally 32px
I think what's going to be hard to illustrate is the chin cap and eyebrows
here this is sorta what you want to aim for.
keep the most important features big. aka (face, colors, weapons hands and feet.)
all it is really a quick sketch based on your dude. took me just a few secs but you should start with something like this at the beginning and refine from there always looking at it from 100% to make sure all the important features stand out.
when working that small a line sketch like the one you show isn't gonna help you much. Getting the big shapes to read is essential, and it will probably scale down better that way.
i did a super quick paintover to illustrate my point. There is one step i skipped which is sizing down in steps and clean up every resize to make the resulting shrinkage read clearer.
Here's a serach link for the other S.A.W. challenges.
It would be kind of cool to get a weekly sprite challenge going again if anyone is interested.
Hey, I posted in another place and was directed here.
Is photoshop my best option for creating sprites?
Is it necessary to do a "concept drawing" to reference from?
Also, I was told PNG images are fine, are they really?
I've been asked to volunteer as an artist for a FF-type video game using XNA. I am supposed to have a meeting with the team this week and start on concepts, so what's the best approach for me considering I'm a total noob? Sorry if I'm hi-jacking the thread a bit; I am on topic however!
Graphic Designer - Advertising - Wanting into the gaming world.
Blog: (Abandoned) - http://smalier.blogspot.com/
http://www.thefreedictionary.com/spriteYou can make small pixel art animations anyway you want, but that is not a sprite. A sprite is something that moves in an interactive application such as a game. So the formating of the sprite is entirely dependent on the engine the game runs on. For exemple, some games will need all animations of a single character on the same sheet. Some will need one strip per action. Some will need them all on the same line. Some use animated gifs or proprietary formats.sprite [spraɪt]
1. (Myth & Legend / Classical Myth & Legend) (in folklore) a nimble elflike creature, esp one associated with water
2. a small dainty person
3. (Group Games / Games, other than specified) an icon in a computer game which can be manoeuvred around the screen by means of a joystick, etc.
[from Old French esprit, from Latin spīritus spirit1]
Same goes for transparency, sometimes an engine will use the first upper left pixel as the transparency color, sometimes it's a specific position on the color index, sometimes they use a separate alpha channel in a tga file, sometimes they use a fixed color (eg 255,0,255) or a png file with transparency, or a grayscale bmp as a mask. This is the kind of question you should be asking your programmer about as we don't know how he's going to code the tools for the game.
There are tools specific for pixel animations such as Graphics Gale or Pro Motion (I use Pro Motion at work, I wrote about it on my blog and how I lost work with it, but it didn't happen again!) Photoshop CAN do pixel art, but it's not an animation tool and animating with it is far from optimal. Switching frames around and doing alterations is a major pain the the butt and quickly becomes confusing. Flash is not bad but will not result in clean pixel art, it is however appropriate for hi res games, XNA typically doesn't require ultra small sprites like, say, Iphone or DS games.
learn something new everyday
The advantage of Graphics Gale and Pro Motion is they are really cheap. This is why I didn't mention something like TV paint, it's all kinds of awesome but super expensive. It's also overkill for what you do. I personally prefer to have the possibility of onion skins and layers when animating, even if it's theoritically possible to animate in MSPaint, it's a bit like mowing the lawn with nail clippers.