| Court Records https://forums.court-records.net/ |
|
| Need to know how to make sprites? https://forums.court-records.net/viewtopic.php?f=12&t=3931 |
Page 1 of 8 |
| Author: | The Sandwich [ Mon Sep 24, 2007 5:14 pm ] |
| Post subject: | Need to know how to make sprites? |
We've had a number of topics from members asking how to create sprites. So instead of making a new thread, read this awesomely comprehensive tutorial on spriting by Mikker. --------------- Open paint. Paste in a sprite you want to edit. Pixel-edit your way to glory. There are several techniques to master, namely: Knowing your editor: Knowing all the little tricks needed to do everything else. Best learned by: Playing! Try out all the functions in paint! Knock yourself out! Get used to all the basic tools, how the palette works, what button to hold down to drag the line on a perfect 45 degree angle, and that you should always, ALWAYS, save in .png for sprite use, as paint is VERY bad at .gifs. If you like some like to use more advanced tools, like Photoshop, than this step is the hardest of them all. Recolouring: The action of applying a different set of colours to a sprite for it to look better. Best learned by: Doing it. Take random sprite, zoom in slightly (you'll use this a lot, trust me), and start mixing the colours. You'll soon see that the normal paint-palette is useless for this, and you'll have to make your own colour blends double-clicking the palette OR use a different program that does this better (Photoshop is good at this, for instance). You will also see that one colour isn't enough. Most, if not all, sprites have shading, so you'll need darker variants of this colour. Making it look nice is actually quite a challenge. You'll also learn some techniques in changing colours, like abusing transparency (have the colour you wish to exchange be transparent, then drag it onto a large square made by the next colour) and pixel-by-pixel editing (explained later.) Frankensteining: The action of combining sprites to make them blend seamlessly. Best learned by: Trying it out. Take two random sprites, zoom in extensively, and try and change their heads onto each other. You'll learn (hopefully!) that marking the head with a single square isn't enough, as this leaves a lot of problems with the fact that the head isn't square. To solve this, you'll either need to carefully use the star-crop icon, and manually take the head or, what is the best action, square-move the head, and change some details by pixel-edit them (see next step) before applying them to their new position. Oh, and you will see that you'll need to be able to master transparency for this last part. Because it isn't square, there will be details outside the head that will also be copied. Have it be a single (unused elsewhere) colour, select that as your secondary colour (right-click), and select the appropriate tool when having the section marked. Congratulations! You have the head selected! XD Drop in on the new body, making sure it looks nice :) You may wonder what the purpose of this is, as it doesn't involve any of YOUR spriting. But fear not. A much used spriting trick is to actually make the sprite in different steps - and combining them afterwards. This is especially true for sprites where parts of it is hidden behind another, or details are added afterwards. If you know how to frankenstein, advanced spriting should be made easier. Pixel Editing & Shaping: The action of shaping the basic shape of a sprite, using a single colour. Best learned by: Doing. An idea here would be to try using official art as a base, but an easier way is to try and make... a smiley! A lot less to worry about. Try making a smiley of a character sprite. If you use that, you'll also get the needed base colours. A good idea is to make your outer pixel black. Try and form it to your ideals. Lots of ideas in the 'new smileys' thread, but I made a little walkthrough here: Daian Laugh - from Start to Finish. Notice how shading is made a lot easier when the shape is finalized, or roughly so. Anyway, using the line tool can be useful sometimes, but the single-pixel tool is used more here. Anti-Aliasing: The trick of using partial sprite colour blends in the squarely gabs near edges to make it look non-choppy. Best learned by: Testing, and looking at other sprites. Make a straight line 45 degree line on a blank sheet. It looks choppy. Ehm... so, try and apply a grey next to it on both sides. It doesn't look as choppy! You must trick the eye into thinking that colours blend together, and this is easily done by simply using colours close to each other. Remember to zoom out a lot to see how you're doing! The 'user' will only ever see it in 1x, and maybe sometimes 2x, so those are the ones you should focus on, viewingly! And try different degrees of straight lines, and test what is best. Another line: Make a straight line, and move half of it a single pixel to the left. Remember that it's the line that is needed to flow into another line on a different 'tile', so to speak. By using lesser colours, you can make it look slightly skewed so they kind of look like they fit together. Longer lines need longer lines of lesser colours to look skewed. Using the same black colour on white just makes the line look thicker, and so would it do if you overdo the lesser colours. This is especially important if you try more than one layer of colours (dark grey and light grey, for instance). If you do this wrong, all you will do is make the line blurry. Avoid that. Oh, and you may try this one out with the smiley you made earlier. Shading: The action of actually shading the figure to make it 1) look cool, 2) Visibly 3D-shaped. Best learned by: Not doing, but watching how others do. The shading basically defines the style (excluding the AA-ing, which is a requirement for basically everything to look nice), and if you want your sprite to follow a style, then you'll need to obey the shading used by this style. In Phoenix Wright, for instance, usually the bottom half of the sprites are darkened. And avoid pillow shading (unless lesser and lesser colours the more into the main part of the sprite you go), which will make your model look soft. So unless you're indeed making a pillow, avoid this one. Can be useful for some types of hair, though. It is also what shades the basic smiley yellow circle. Detailing: Making details, in the end, is what shapes the figure. Especially hair. Best learned by: I have no idea on this one. It really depends on how you can put your previously learned skills into the situation at hand. However, In most cases, for sprites, details that are so small single pixels are too big are actually quite common. To do this, you must take advantage of the same skills used for AA to manually make small details. This is HARD to do, and sometimes it may even be better to make large versions of the details, and shrinking them down, editing them to look nice as you go. Remember, it might look foolish zoomed in, but the viewer will see it in 1x! If the needed item is more than 5x5 pixels as this, (20x20 in a similar detail, for instance) then AAing details is really NEEDED. --------------- Thanks to Mikker for writing this. Happy spriting. --------------- -Edit by Ceres 'sorry Darz, hope ya don't mind): If you're interested in animation (both in GIMP and PS), be sure to visit Percei's tutorial's topic: Click --------------- |
|
| Author: | link1438 [ Wed Sep 26, 2007 1:13 pm ] |
| Post subject: | Re: Need to know how to make sprites? |
Great Job Mikker! Although I didn't learn from this XD, it's pretty well made out. I can offer some tips too, if it's needed. Although I currently have nothing to add. I've been spriteing for about 2 years, so I know everything you should need to know from Ripping to Mutations. (Not customs tho...) And nice Daian... 
|
|
| Author: | The Sandwich [ Wed Sep 26, 2007 6:11 pm ] |
| Post subject: | Re: Need to know how to make sprites? |
*reserved for upcoming tutorial on the Basics of Animating, and Animating from sheets.* |
|
| Author: | Brandon Strong [ Sun Sep 30, 2007 6:08 am ] |
| Post subject: | Re: Need to know how to make sprites? |
That tutorial was hilarious. "ejection part" lol its funny because its true |
|
| Author: | Steel Samurai [ Mon Oct 01, 2007 12:30 pm ] |
| Post subject: | Re: Need to know how to make sprites? |
Well-documented tutoial. Good work! |
|
| Author: | DramaticaXIV2 [ Mon Oct 01, 2007 4:13 pm ] |
| Post subject: | Re: Need to know how to make sprites? |
Thanks! I thought I was unable to edit sprites until i read this 
|
|
| Author: | Tajiri Ami [ Tue Oct 23, 2007 6:04 am ] |
| Post subject: | Re: Need to know how to make sprites? |
Hurry your ass up on that animation tutorial, Darzie! Nah, get it done whenever. Just know that I'm looking forward to it.  I'm excited to make my own.
|
|
| Author: | zoe [ Thu Nov 01, 2007 10:24 am ] |
| Post subject: | Re: Need to know how to make sprites? |
thanks for you tutorial  how could i overlap sprites likes MoronSonOfBoron's avatar? http://www.forums.court-records.net/memberlist.php?mode=viewprofile&u=1176 |
|
| Author: | DramaticaXIV2 [ Thu Nov 01, 2007 3:56 pm ] |
| Post subject: | Re: Need to know how to make sprites? |
zoe wrote: thanks for you tutorial how could i overlap sprites likes MoronSonOfBoron's avatar? http://www.forums.court-records.net/memberlist.php?mode=viewprofile&u=1176 Yes, but it's quite complicated: If you want to do something like that, cut of the arms on the top layer (star cut if Paint), place a sprite in front of the back layer (box or star cut with the unfilled box type is your friend) and then place the arms back on. 
|
|
| Author: | zoe [ Fri Nov 02, 2007 2:00 pm ] |
| Post subject: | Re: Need to know how to make sprites? |
DeathsoulXIV2 wrote: zoe wrote: thanks for you tutorial how could i overlap sprites likes MoronSonOfBoron's avatar? http://www.forums.court-records.net/memberlist.php?mode=viewprofile&u=1176 Yes, but it's quite complicated: If you want to do something like that, cut of the arms on the top layer (star cut if Paint), place a sprite in front of the back layer (box or star cut with the unfilled box type is your friend) and then place the arms back on. thanks i thought there were other special ways to do this... i will try that:)
|
|
| Author: | DramaticaXIV2 [ Sun Nov 04, 2007 1:49 pm ] |
| Post subject: | Re: Need to know how to make sprites? |
Tajiri Ami wrote: Hurry your ass up on that animation tutorial, Darzie! I'm excited to make my own.Jk, though i do honestly want it |
|
| Author: | muffinman [ Tue Dec 11, 2007 11:56 pm ] |
| Post subject: | Re: Need to know how to make sprites? |
Thanks a lot for posting this. It's really helpful. |
|
| Author: | Norsk Skogkatt [ Sun Dec 30, 2007 3:58 am ] |
| Post subject: | Re: Need to know how to make sprites? |
Odd question here, sorry. I'm having a hell of a time with adding a text box that partially shows the background, like in the game. How would I go about doing that? |
|
| Author: | Tajiri Ami [ Sat Jan 05, 2008 3:53 am ] |
| Post subject: | Re: Need to know how to make sprites? |
 Norsk Skogkatt wrote: I'm having a hell of a time with adding a text box that partially shows the background, like in the game. How would I go about doing that? Hmmm... I suppose you would need a picture editing program that allowed you varying levels of transparency. That's all I could tell you. ^_^; |
|
| Author: | Android 21 3/7 [ Sat Jan 05, 2008 3:56 am ] |
| Post subject: | Re: Need to know how to make sprites? |
Dang, Ami! You beat me to it! |
|
| Author: | Tajiri Ami [ Sat Jan 05, 2008 4:11 am ] |
| Post subject: | Re: Need to know how to make sprites? |
Sorry 'bout that. ^_^; I love your work, by the way. Perhaps you could make up an animation tutorial? =D |
|
| Author: | Android 21 3/7 [ Sat Jan 05, 2008 4:14 am ] |
| Post subject: | Re: Need to know how to make sprites? |
 I use adobe photoshop elements v2.0 for that. I don't see why I need to make a tutorial.
|
|
| Author: | Tajiri Ami [ Sat Jan 05, 2008 5:14 am ] |
| Post subject: | Re: Need to know how to make sprites? |
Ah well... I don't have Photoshop and I don't know the first thing about animating, so I was hoping someone could help me out. That's all. |
|
| Author: | CarChaseCityMan [ Sun Jan 06, 2008 11:29 pm ] |
| Post subject: | Re: Need to know how to make sprites? |
Nevermind. |
|
| Author: | FerdieLance [ Thu Jan 10, 2008 12:37 pm ] |
| Post subject: | Re: Need to know how to make sprites? |
I don't see the GIMP mentioned here; it's a free alternative to Photoshop. The interface is choppier, and the capabilities aren't as great, but it's open-source! |
|
| Author: | Marshmello [ Sun Jan 13, 2008 9:22 pm ] |
| Post subject: | Re: Need to know how to make sprites? |
How do you make animated *.gif's in Photoshop? (I = Photoshop noob) |
|
| Author: | Allan's Aokage [ Wed Jan 23, 2008 12:46 pm ] |
| Post subject: | Re: Need to know how to make sprites? |
FerdieLance wrote: I don't see the GIMP mentioned here; it's a free alternative to Photoshop. The interface is choppier, and the capabilities aren't as great, but it's open-source! It's wonderful.I find Paint eaiser for sprite-editing, though. |
|
| Author: | Lauro - Zack [ Thu Mar 27, 2008 6:27 am ] |
| Post subject: | Re: Need to know how to make sprites? |
another way is using photoshop like me^^
|
|
| Author: | Robin_Wrong [ Sat Apr 19, 2008 11:43 pm ] |
| Post subject: | Re: Need to know how to make sprites? |
i know how to make sprites on paint thats how i made my icon i will post a tutorial soon so just wait and one should be made soon ^^ 
|
|
| Author: | G.Gustice [ Wed Apr 30, 2008 8:34 pm ] |
| Post subject: | Re: Need to know how to make sprites? |
Robin_Wrong wrote: i know how to make sprites on paint thats how i made my icon i will post a tutorial soon so just wait and one should be made soon ^^ Cool^^ |
|
| Author: | Shadoninja [ Mon May 12, 2008 12:28 am ] |
| Post subject: | Re: Need to know how to make sprites? |
http://www.youtube.com/watch?v=2ZEAMDTjOgU I think this video is good for anyone who wants to edit via MsPaint. |
|
| Author: | Bushka8 [ Tue May 13, 2008 3:43 am ] |
| Post subject: | Re: Need to know how to make sprites? |
Shadoninja wrote: http://www.youtube.com/watch?v=2ZEAMDTjOgU I think this video is good for anyone who wants to edit via MsPaint. That video does help, it reveals more about paint that i didn't know! 
|
|
| Author: | Robin_Wrong [ Thu May 15, 2008 3:43 am ] |
| Post subject: | Re: Need to know how to make sprites? |
8D finally i got the video (yes this is my video) http://www.youtube.com/watch?v=1mJGWPF2yFU |
|
| Author: | Marshmello [ Thu May 15, 2008 9:04 pm ] |
| Post subject: | Re: Need to know how to make sprites? |
Whenever it was that I last looked at this thread, I asked how to make animated *.gif's in Photoshop, and I have finally found my answer. One cannot make animations in Photoshop itself, but packaged with Photoshop 5.5, 6, 7, CS, and CS2 is a program called Adobe ImageReady, which is slightly tedious but can be used to make animated *.gif's. If anyone's interested I'd be happy to make up a tutorial. |
|
| Author: | G.Gustice [ Sat May 24, 2008 8:48 pm ] |
| Post subject: | Re: Need to know how to make sprites? |
That'd be pretty cool,Marsh^^ |
|
| Author: | Marshmello [ Sun May 25, 2008 12:59 am ] |
| Post subject: | Re: Need to know how to make sprites? |
Okay I'll work on making up a tutorial tomorrow 
|
|
| Author: | Marshmello [ Sun May 25, 2008 6:21 pm ] |
| Post subject: | Re: Need to know how to make sprites? |
Okay, here is goes: Making Sprite Animations In Adobe ImageReady Spoiler: |
|
| Author: | CoffeeAddict [ Mon May 26, 2008 10:42 am ] |
| Post subject: | Re: Need to know how to make sprites? |
can you use Adobe Fireworks instead? i used that in coloring my avvie, |
|
| Author: | DramaticaXIV2 [ Thu Aug 14, 2008 5:23 pm ] |
| Post subject: | Re: Need to know how to make sprites? |
Allan's Aokage wrote: FerdieLance wrote: I don't see the GIMP mentioned here; it's a free alternative to Photoshop. The interface is choppier, and the capabilities aren't as great, but it's open-source! It's wonderful.I find Paint eaiser for sprite-editing, though. I always make my sprites in Paint, then transfer them to GIMP for Animating/Making Transparent. |
|
| Author: | undershot1 [ Fri Aug 15, 2008 11:23 pm ] |
| Post subject: | Re: Need to know how to make sprites? |
I'm making my first sprite but when I try to save it, it makes my sprite have a wierd comic book effect like dots all over the thing. how can I fix that? Sorry if there's someone who mentioned it already. EDIT:never mind I just found an aneswer |
|
| Author: | jaydrick0620 [ Thu Sep 11, 2008 6:10 am ] |
| Post subject: | Re: Need to know how to make sprites? |
Know i know how to make sprites! |
|
| Author: | Godot's uncle [ Sat Sep 20, 2008 3:05 pm ] |
| Post subject: | Re: Need to know how to make sprites? |
Edit: I will use google before asking dumb questions... I was wondering, how to change the gif's color palette in GIMP. In case someone else is in trouble you can change it here: Dialogs -> Colormap |
|
| Author: | blinq [ Sat Nov 15, 2008 8:28 pm ] |
| Post subject: | Re: Need to know how to make sprites? |
I'll try right now :D |
|
| Author: | SupwithyouSammie [ Sat Nov 15, 2008 8:36 pm ] |
| Post subject: | Re: Need to know how to make sprites? |
Good luck with it =D Just remember, save in .png Saves you trouble XD |
|
| Author: | blinq [ Sat Nov 15, 2008 9:03 pm ] |
| Post subject: | Re: Need to know how to make sprites? |
SupwithyouSammie wrote: Good luck with it =D Just remember, save in .png Saves you trouble XD I tried to add something but I don't find the right colours , It looks pretty weird  damn
|
|
| Page 1 of 8 | All times are UTC |
| Powered by phpBB © 2000, 2002, 2005, 2007 phpBB Group http://www.phpbb.com/ |
|
