AuthorTopic: Tips for animating pixel art! (+ some stuff about outlines)  (Read 3541 times)

Offline gnomey

  • 0001
  • *
  • Posts: 16
  • Karma: +0/-0
  • :)
    • View Profile
Hello! First off, I'm new to this forums and I feel like this place can really help me with my pixel art and I was brought here by the indie game called "Risk of Rain" by Paul Morse in his FAQ page.

I'v had some troubles with animating my pixel art. At the moment, I can't provide my work to show until I get home later today. I would just like to know a general knowledge ways of animating and tips/tricks!

Another small question, what are some benefits of using outlines on works (game items such as Minecraft) and what are the best situations to use outlines for games.

I am currently developing a Java coded game as a rogue-like first-person game and I would just like some few tips so that I can get started. I'v been doing pixel art for a few years now but I don't feel like I am improving as much. I want to get the right resources for me to improve my work to a professional level.
« Last Edit: November 13, 2013, 02:44:14 am by gnomey »

Offline Johasu

  • 0010
  • *
  • Posts: 187
  • Karma: +0/-0
    • @johasu232
    • Johasu232
    • View Profile

Re: Tips for animating pixel art! (+ some stuff about outlines)

Reply #1 on: November 13, 2013, 03:49:26 am
Hello, you should modify this message with some pixel art for criticism soon, or I suspect you will be flamed a bit for a broach in protocol.

As I understand the matter, outlines should be used on pieces that struggle to stand out from the background elements a bit.  You want key elements such as player characters, enemies, and interactive elements to stand out to the viewer. If the colors overwhelm these items or blend them in too well, outline borders are sometimes used to make them stand apart a bit more.
Of course many of the older games simply used palettes that were of complementary colors to create the division.  (Blue vs. Orange/ Red vs. Green) and so on.
There are tons of helpful insights on animations and everything if you read through the hundreds of threads and general discussion forum(which is where this should probably be until you get some art up.)
Gallery:  http://johasu.deviantart.com/gallery/
Twitter:  @johasu232

Offline tcaud

  • 0001
  • *
  • Posts: 60
  • Karma: +0/-0
    • View Profile

Re: Tips for animating pixel art! (+ some stuff about outlines)

Reply #2 on: November 13, 2013, 12:10:52 pm
Outlines save time. Outlined art looks cartoony compared to non-outlined art, which has a tendency to look either blocky/vectory or real. Reality doesn't have outlines, hence non-outlined art can look photo real. Consider the Dark Sun games for an example of what I mean. In the absence of outlines you must use lighting to make the distinction. Getting the lighting right takes hours more than doing the same thing with outlines. It's a choice between realism and non-realism and realism takes longer.
« Last Edit: November 13, 2013, 12:14:32 pm by tcaud »

Offline coffee

  • 0010
  • *
  • Posts: 190
  • Karma: +1/-0
    • JohanAronson
    • View Profile

Re: Tips for animating pixel art! (+ some stuff about outlines)

Reply #3 on: November 13, 2013, 01:41:48 pm
Wanted to add that non-realism can be done without outlines aswell. I don't think that you should focus so much on why in theory, more why in an artistic way. Why would an outline look good here and why would it not look good somwhere else. In my opinion you should try to just study and make things with the use of reference pictures or simple get inspired by other peoples art, and decide on your own.

So don't get stuck on something like outlines, why or why not. I would say it's more a choice of style. However it can of course be used for other purposes like mentioned. Like making something popping out of the screen a little bit more than something else. Use it as a thin shadow or light.

Computer Animations (and pixelart) is something very new compared to other forms of "drawing" etc. and if you see a really good animation or a piece of pixelart, the majority of the times that man or woman have a wealth of experience drawing with a pencil, on paper. So if you've not practised pen and paper I would suggest you try to at least do something every day, or at least regularly.

/coffee

Offline gnomey

  • 0001
  • *
  • Posts: 16
  • Karma: +0/-0
  • :)
    • View Profile

Re: Tips for animating pixel art! (+ some stuff about outlines)

Reply #4 on: November 13, 2013, 02:24:16 pm
Sorry for not uploading my art but I will upload ASAP. Currently, I'm only browsing with a Chromebook which I regret buying. I have few of my art pieces that I want critiques on and whatnot. Thank you!

Offline PixelPiledriver

  • 0011
  • **
  • Posts: 997
  • Karma: +6/-0
  • Yo!
    • View Profile
    • My Blog

Re: Tips for animating pixel art! (+ some stuff about outlines)

Reply #5 on: November 14, 2013, 01:15:02 am
Quote
I would just like to know a general knowledge ways of animating and tips/tricks!

Use a pixel editor that's good for animation
Graphics Gale, ProMotion, Grafx2 etc.
Choose one and learn it well.
Set up easy to use hot keys for moving between frames, creating new frames, duplicating frames, etc.

Don't animate in sprite sheet format.
You need to see the changes between frames overlapping.
You can export a sprite sheet automatically when you're done.

Study the 12 principles and do animations based on them
Link
Take them one at a time and do a handful of small animations per principle.
Take your time on these.
And experiment.
Come to understand them by what they are trying to convey but also on your own terms and what you want to do with them.
Then start to do more animations and use 2 or 3.
When you get comfortable with that try to use more.
Eventually these will come naturally and you won't need to look them up unless you want to.
Also realize that not every animation needs to use every principle.
The link I have provided is not the best.
The examples are kinda sparse.
A few of the explanations there are not good.
I'll try to find a better link but you should search for other pages with the same info as well.
If one of the principles doesn't make sense then ask.

Do the basic animation tests.
Bouncing ball, falling stick, flour sack, walk cycle, facial expressions, phonemes, hand gestures, water splash, fire, etc
Use these tests to work with the above studies.
Do several of each.
Do the boring straight ahead version then do some creative versions.
Divide your time between practicing motion and acting.

Become comfortable with manipulating all parts of animation.
Frames, delays, fps, drawings, motion, color, etc.
You can work on each part separately with purpose.
It is possible to improve an animation just by swapping frames, changing delays, bumping positions, etc without adding any extra drawings.
It's also possible to improve an animation by adding some pixels here and there, redrawing only isolated parts,  or redrawing a frame completely without changing timing.

There are lots of tips that I don't mention here.
Animators have come up with lots of motion / frame theories.
Most of them are very small things that don't take a lot of time to implement but can improve an animation greatly.
However I don't have the time to go thru any of them.
And you have a lot to do already.
So some day bother me about that, I forget things easily.

Formulate your own ideas about animation.
Read what others have to say.
Combine your own and others thoughts.
See what happens.

Move on to do other things with animation like interactions, ideas, games, stories, etc
Make stuff that does stuff.
 :y:

You don't have to do all of that in order.
If you want to spend time working on animations for a game that's fine.
You will still gain valid experience from that.
But the more time you spend on the basics the smoother the animation process will be for you.
It will help you break down more complex animations into steps.



Also, it's good to talk about general tips.
But maybe you could elaborate more specifically on this:
Quote
I'v had some troubles with animating my pixel art.
What kind of troubles?
« Last Edit: November 14, 2013, 05:35:09 am by PixelPiledriver »
And knowing that it is, we seek what it is... ~ Aristotle, Posterior Analytics, Chapter 1

Offline gnomey

  • 0001
  • *
  • Posts: 16
  • Karma: +0/-0
  • :)
    • View Profile

Re: Tips for animating pixel art! (+ some stuff about outlines)

Reply #6 on: November 14, 2013, 05:49:38 pm
well basically what i mean by "troubles" is that i have a hard time doing it. I animate something but usually doesnt look right. I tend to use the "move" tool? I dont know the specific name for it but what I basically do is select an area with a box and then move it around, especially the main part of the animation (body, head, maybe the arms) and then I try to connect them all together because it usually ruins it. Then again, I'll be uploading my work very soon! Sorry for such delay x.x



I made a separate post for my work to be critiqued here: http://wayofthepixel.net/index.php?topic=15978.0
« Last Edit: November 17, 2013, 05:07:04 am by gnomey »