A simple but very helpful tool that is often overlooked is the 'Align and Distribute'. It's the answer to a question I have been asked a few time 'How do you place your objects precisely in line?'.
The tool can do a lot more than that by aligning not only objects but groups of objects.
In order to 'kill two birds with one stone' I am going to use and explain the tool while creating a cute animal. What defines cuteness? Cute usually is achieved by more 'child-like' proportions - round shaped heads, big eyes, small nose, small body. Perfect for my favorite start of a tutorial: "Let's create a circle" - well in this case we create three.
Note: Users familiar with Adobe Illustrator or CorelDraw for example might ask why I bother with the duplication and rotation when it's already build in. You create one copy, rotate it and the next copy will be a repeated version and you can create the full circle of triangles that way. I find this way easier and more controlled when creating evenly spaced content for a circular shape.
Let's give the lion some facial features. The mouth might like conplexe but really it's just an up-side-down Y and if the deforming of the circle looks too difficult you might try using 3 separate elliptical shapes to create the same effect.
I added another circle for the body, a deformed circle for the leg and the paw, duplicated them 3 times to create the legs and added a line with a deformed circle with a pointy edge for the tail. A simple (and in my opinion cute) little lion.
With a little bit more detail (eyelids and eyebrows) it's easy to give the lion some features and create some variations.
Variations don't stop there. Taking the basic shapes, rearranging them and changing the colours you have a whole zoo at your fingertips.
I hope you enjoyed the tutorial and start playing around with the tools inkscape (and other vector tools) have to offer to create some magic.
[and remember - if this seems too difficult, read my blog/ this post from the earlier postings onward. I am explaining a lot of the tools and techniques in earlier tutorials]
Hey @SpriteAttack I can't run Inkscape in Mountain Lion, I already downloaded XQuartz and installed the package, but when I try to run Inkscape it asks me: "Where is X11?" and I have to select the X11 app, but no app was installed, just the package installation. Do you know what I have to do?
My biggest issue is figuring out where to put the shades ot the things that assist with a depth. how many? not to many? not enough? It seems shading and depth is the major things that make a image look good to not. Im always sticking with flat images. And thats not healthy.
With more rounded objects it doesn't hurt to have a gradient shading it darker along the edges. It looks like you've just added a highlight to the basic shapes, which is good, but adding some darker shading couldn't hurt and could be useful in more fully defining details.
Like this:
Something I like to do sometimes is changing the colors of the outlines around objects, which can help to more easily define individual shapes:
It's also a HUGE help if you define a specific direction the light source is coming from. Even having a rough idea like, say, "above and between the camera and the actor" can be helpful as a starting point, and then you can add shadows/highlights that compliment that lighting position, then add a secondary light source, like a rim light, after you've defined your main light source.
One light source (front, above & to the right, though the lighting on the face is different for clarity's sake):
Multiple light sources (key/background lights + local light from box:
Try to think about it as not a technical issue in how to do it, but as straight-up art that follows the rules all art uses with lighting. There's a good Wikipedia entry on basic 3-point lighting here: http://en.wikipedia.org/wiki/Three-point_lighting
This gets off the shading topic a little, but if you're designing a character, maybe also think about doing a character sheet, which is just a set of sketches (detailed or not, up to you) for you to reference for things like poses, sizing of various pieces of the object/character, and can also be a good way to help define your character's personality through appearance and motion:
ok now your making me jealous... the first image i did with photoimpact... I finished playing with inkscape and tried one of my characters there. this is what i did so far.
the first image i did with photoimpact... I finished playing with inkscape and tried one of my characters there. this is what i did so far.
Maybe try moving the light around to the front of the character a bit more. Just having that slight edge highlight results in the character still looking pretty flat, and having the highlight slightly inset from the edge doesn't help give it shape.
Some reference art that does what you're trying to achieve could be a good starting point for figuring out your shading. He looks kinda gumdrop-shaped to me, so I see something like a box of candy...maybe look at pictures of gumdrops and try to copy the way they look in a vector style? If that's what you're going for.
then its working cause thats what he is... a gumdrop. its a lemon gumdrop against the lime gumdrop type game. thank you for the image. i like this image i just dont want the light coming off him so bright and dispersed
Comments
The tool can do a lot more than that by aligning not only objects but groups of objects.
In order to 'kill two birds with one stone' I am going to use and explain the tool while creating a cute animal. What defines cuteness? Cute usually is achieved by more 'child-like' proportions - round shaped heads, big eyes, small nose, small body. Perfect for my favorite start of a tutorial: "Let's create a circle" - well in this case we create three.
Note:
Users familiar with Adobe Illustrator or CorelDraw for example might ask why I bother with the duplication and rotation when it's already build in. You create one copy, rotate it and the next copy will be a repeated version and you can create the full circle of triangles that way.
I find this way easier and more controlled when creating evenly spaced content for a circular shape.
Let's give the lion some facial features. The mouth might like conplexe but really it's just an up-side-down Y and if the deforming of the circle looks too difficult you might try using 3 separate elliptical shapes to create the same effect.
I added another circle for the body, a deformed circle for the leg and the paw, duplicated them 3 times to create the legs and added a line with a deformed circle with a pointy edge for the tail. A simple (and in my opinion cute) little lion.
With a little bit more detail (eyelids and eyebrows) it's easy to give the lion some features and create some variations.
Variations don't stop there. Taking the basic shapes, rearranging them and changing the colours you have a whole zoo at your fingertips.
I hope you enjoyed the tutorial and start playing around with the tools inkscape (and other vector tools) have to offer to create some magic.
[and remember - if this seems too difficult, read my blog/ this post from the earlier postings onward. I am explaining a lot of the tools and techniques in earlier tutorials]
Darren.
My GameSalad Academy Courses! ◦ Check out my quality templates! ◦ Add me on Skype: braydon_sfx
New to GameSalad? (FAQs) | Tutorials | Templates | Greenleaf Games | Educator & Certified GameSalad User
Hopefully I'll use it later to make some sprites for my game
Like this:
Something I like to do sometimes is changing the colors of the outlines around objects, which can help to more easily define individual shapes:
It's also a HUGE help if you define a specific direction the light source is coming from. Even having a rough idea like, say, "above and between the camera and the actor" can be helpful as a starting point, and then you can add shadows/highlights that compliment that lighting position, then add a secondary light source, like a rim light, after you've defined your main light source.
One light source (front, above & to the right, though the lighting on the face is different for clarity's sake):
Multiple light sources (key/background lights + local light from box:
Try to think about it as not a technical issue in how to do it, but as straight-up art that follows the rules all art uses with lighting. There's a good Wikipedia entry on basic 3-point lighting here: http://en.wikipedia.org/wiki/Three-point_lighting
This gets off the shading topic a little, but if you're designing a character, maybe also think about doing a character sheet, which is just a set of sketches (detailed or not, up to you) for you to reference for things like poses, sizing of various pieces of the object/character, and can also be a good way to help define your character's personality through appearance and motion:
Some reference art that does what you're trying to achieve could be a good starting point for figuring out your shading. He looks kinda gumdrop-shaped to me, so I see something like a box of candy...maybe look at pictures of gumdrops and try to copy the way they look in a vector style? If that's what you're going for.
Research is good. Google is your friend.
thank you for the image. i like this image i just dont want the light coming off him so bright and dispersed
something like this?!?
I don't know if you like it but it was a good warmup @FINBOGG
I would really like to know
all your tutorials or really great
keep working on them
they are really useful