Pixelation
Critique => Pixel Art => Topic started by: imnumberfour on April 10, 2013, 08:47:22 pm
-
I have decided to delve into another mockup frenzy! This time I went for something out of my ordinary and decided to pixel a tree (oooh, aaah) and an actual character sprite. The tree is still WIP so help there would be great and the sprite is extremely WIP: i have no idea whatsoever on what to do with him.
(http://i.imgur.com/JvWFSrI.png)
How it will most likely be viewed:
(http://i.imgur.com/BYRjNsx.png)
-
Looks like a character who belongs in an adventure game. A tourist as old as middle age looking for something... That's what I am.feeling when I look at this. Is that what you intended?
-
Yes. The man is supposed to be a tourist at a resort island, attractive, in his 30's and looking for something (haven't yet decided). So I guess I conveyed that pretty well?
-
The earth textures might be too high contrast? It pulls your eyes away from the character. I wonder if you could use more standing-out colors for the character, too? :o
-
I was thinking that about the dirt....originally it was like this (http://i.imgur.com/HwWtNCX.png) but I just REALLY liked it when added more colours, haha. If it's too much of an issue I willl change it, however I thought I could make the character really simple so it still stands out against the detailed background (and, ya'know, easier to animate).
More colours + more contrast? Hawaiian shirt it is then.
(http://i.imgur.com/49kvlxC.png)
(http://i.imgur.com/vAZ5FX5.png)
-
If this is not a platformer, then I strongly recommend adding depth to the scene. Study the design of old cartoons, since they had to work with the same sort of limits as side view video games.
I took the liberty to pasting your character into the background of Donald's Vacation, a 1940 Donald Duck cartoon.
(http://www.4freeimagehost.com/uploads/6e3c99f5d0b3.png)
The lines I drew roughly break the image into the foreground (lowest stripe), the character area (between the cyan lines), the middle ground (up to the red line) and the background (everything else).
The lone tree in the middle ground serves to break up the composition into different areas (clearings in this setting). With the character wandering horizontally, it helps to pace the scene; things happen over here (on one side of the tree), and over there (on the other side), and the character walking in front of the tree is transitioning between the spaces.
The middle ground area also contains scenery objects the character interacts with. Doors, or treasure chests, or whatnot would be placed there. Putting a scenery object in the character space is used only when that object also blocks further movement in the horizontal direction, or transitions to another scene entirely.
The character will generally never leave the character area, but it looks like they could.
Observe the huge jump in scale between the middle ground and background elements. Those background elements are very far away, which emphasizes the character is unlikely to interact with them. Also consider out the saturation differences.
Of course, if you are creating a run and jump platformer, most of this advice is moot. More animation backgrounds are here:
http://animationbackgrounds.blogspot.com/ (http://animationbackgrounds.blogspot.com/)
Hope this helps,
Tourist
-
If this is not a platformer, then I strongly recommend adding depth to the scene. Study the design of old cartoons, since they had to work with the same sort of limits as side view video games.
I took the liberty to pasting your character into the background of Donald's Vacation, a 1940 Donald Duck cartoon.
(http://www.4freeimagehost.com/uploads/6e3c99f5d0b3.png)
The lines I drew roughly break the image into the foreground (lowest stripe), the character area (between the cyan lines), the middle ground (up to the red line) and the background (everything else).
The lone tree in the middle ground serves to break up the composition into different areas (clearings in this setting). With the character wandering horizontally, it helps to pace the scene; things happen over here (on one side of the tree), and over there (on the other side), and the character walking in front of the tree is transitioning between the spaces.
The middle ground area also contains scenery objects the character interacts with. Doors, or treasure chests, or whatnot would be placed there. Putting a scenery object in the character space is used only when that object also blocks further movement in the horizontal direction, or transitions to another scene entirely.
The character will generally never leave the character area, but it looks like they could.
Observe the huge jump in scale between the middle ground and background elements. Those background elements are very far away, which emphasizes the character is unlikely to interact with them. Also consider out the saturation differences.
Of course, if you are creating a run and jump platformer, most of this advice is moot. More animation backgrounds are here:
http://animationbackgrounds.blogspot.com/ (http://animationbackgrounds.blogspot.com/)
Hope this helps,
Tourist
Thats a really neat thing to do, I think I may try that. Would doing so mean I have to change the perspective of the trees/bushes?
-
A little bit for the bushes, not much for the trees. Since there is a horizon line the scene should have some perspective. The viewer should look down just a bit on short objects like the bushes. Tall trees will stretch across the horizon line so you can get away with less perspective. For the trees, make the base curved instead of flat and you're probably fine.
To be honest the degree of perspective tends to vary quite a bit from cartoon to cartoon. There are also perspective tricks to set up the backgrounds with multiple vanishing points across large horizontal layouts, but I'm not sure you need to use them.
One important trick is to hide the explicit breaks in the depth areas. Those lines that I drew? They should not be obvious to the viewer. Notice that the ground around the tree. The shadow/grass spills into the character area to hide the face that there is a hard break in the depth. Same thing on the right hand edge where the ground goes from tan to greenish. This makes the clearing a sort of round, space like a room, even though the character will never step in there depthwise.
The (red) line between mid ground and background is explicit on the right to keep them separate, but on the left the line is broken up by the large rocks and extra trees. Other cartoons place the objects at slanted angles relative to the horizontal axis, but the actual boundaries for the characters and objects remain a fixed horizontal band to make it easier on the character animators.
(http://3.bp.blogspot.com/_QdHn8FT7SdY/TGDTAg7u_YI/AAAAAAAAJzo/67uU-w6g3G8/s400/hiawatha07panD.jpg)
(http://2.bp.blogspot.com/_QdHn8FT7SdY/TGDR9TH-JiI/AAAAAAAAJyw/8AoHESmCYck/s400/hiawatha09LEFT.jpg)
from Hiawatha's Rabbit Hunt, 1941. This is a Bugs Bunny cartoon.
A little perspective on the bushes, not much on the trees. A wide empty space at the bottom for the characters to walk around in. Note how all of the boundaries are curved or angled rather than horizontal. This is illusion for the most part.
The canoe is technically at the edge of the middle area, even though the lake above it is background. You'd have to do a custom animation for a character to get in or out of the canoe.
Browse the blog for more examples (it's not mine, but I think it's rather nifty).
-
This is really helpful. Thank you for all this information! I will definately work this into the tiles.
-
I note that there also was a ton of similar "side-view-character-in-depth-enabled environments" in Lucas Arts DOS point/click adventure games such as DoTT, Monkey Island or Sam&Max Hit the Road...
-
Ok guys and gals: if I was doing that form of perspective would each "section" be comprised out of tiles apart from the background? Or would I draw out each scene?
-
I really like how backgrounds were handled in Metal Slug, in that there was a character standing infront of the bg..
In that game it looked like lots of stuff was drawn out, but they were also really really good at element re-use. So there would be a lot of tileable textures, but they weren't nearly as obvious as say in Megaman or Super Mario Bros.
http://www.vgmaps.com/Atlas/Neo-Geo/MetalSlug3-Mission4.png (http://www.vgmaps.com/Atlas/Neo-Geo/MetalSlug3-Mission4.png) for example
-
So not exact 16x16 tiles, but rather elements that can tile together and be re-used?
-
Yeah, the neo geo at least was capable of breaking the square tile standard of the time... and if the neo geo could do it, I'm sure you can too :)
it depends on the game engine
-
So not exact 16x16 tiles, but rather elements that can tile together and be re-used?
Don't think of your tiles as tiles. If possible, try to draw them as a scene over a grid. This way, I find that I am more conscious of how my tiles look in practice, and I find that it helps avoid making tiles that don't tile well, and in general make stuff that kinda reveals a tile grid. You could probably draw a 128x64 section of wall over a 16x16 grid if you want, if you're up to working that large.
-
quick sketch jsut to see if I understand the whole perspecitve thing: (http://i.imgur.com/Vq18nSU.png)
-
de-saturation and fade-to-blue as you go to further planes is the key to good readability.
-
(http://i.imgur.com/q1IKwzl.png)
I tried to draw different kinds of perspectives. I think the choice comes from what kind of a game you are thinking of. :o!
1. is traditional perspectiveless-blocks - background objects are separated by them being lighter than the foreground and maybe having lighter outlines? Mario is an example, of course.
2. Point and click, of course you have to make different character sizes. Not really relevant, for some reason I included that.
3. Beat-em-up, characters can move up and down slightly. Background objects should still stay off the walk-plane, and the walkable area should be clearly different (a road, a fence, something like that)
4. Kinda what the others are suggesting, I saw jazz 2 do this. Basically the character walks right in the middle of the ground, with the groundplane extending slightly above and below the walkable area. Jazz 2 had pretty lenient jumps, so it wasn't an issue. Notice that the walkable area again should be kinda separated from the background visually so the player doesn't get confused about where they are able to land.
-
Kind of a different topic, but I think you could add more to the character without more colors. Here, I tried to do that, in a sloppy, exaggerated way.
(http://i.imgur.com/GGMbrMi.png)
Things I did: 1st, I used the dark hair color as a third shade for for the pants. 2nd, I changed the color of the flowers to a more neutral blending color. I used this in the hair for anti alias and for more detail with the pants and arms. I also did some other small ideas and color adjustments. The technique is sloppy, but maybe keep in mind some of the ideas. (I also really messed up the shirt)