logo hyperPad Forum
    • Categories
    • Recent
    • Tags
    • Popular
    • Users
    • Search
    • Login

    Pixel Art Character Tutorials

    Scheduled Pinned Locked Moved
    WIP and Showcase
    5
    18
    2.6k
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • Jack8680J
      Jack8680 @TutorialDoctor
      last edited by

      @TutorialDoctor the pose tutorial is really good, the only problem was that I had to change the forum background because I had mine as black, so maybe consider adding a plain background when posting on the forum. I like the pose tutorial because the characters look more realistic than the previous examples. The only problem I have is they have a pretty blank facial expression, but I think that's more due to the fact it's pixel art.

      TutorialDoctorT 1 Reply Last reply Reply Quote 0
      • TutorialDoctorT
        TutorialDoctor @Jack8680
        last edited by

        @Jack8680 Thanks. I didn't consider the background issue. I will remember that. To get more detail in the face you would probably have to go up to 256x256 (unless the size of your character is planned a bit better).

        I'd say that learning to create the art at 32x32, 64x64 and 128x128 is beneficial because you can use each one as a LOD (level of detail) to represent the character at different viewpoints (close or far). At 256x256 it gets a bit more difficult to animate (even at 128x128 it is hard to animate). I tend to animate the character at 64x64 and then add details for each frame once I have scaled it to 128x128.

        You can create a Mario-like character at 32x32. My Wreck-It-Ralph character was created at 64x64 I believe.

        1 Reply Last reply Reply Quote 0
        • TutorialDoctorT
          TutorialDoctor
          last edited by TutorialDoctor

          Heads @ 64x64
          3/4, Front, and Side views

          0_1492020795641_head.png

          1 Reply Last reply Reply Quote 0
          • TutorialDoctorT
            TutorialDoctor
            last edited by TutorialDoctor

            Animation

            1. Draw the full character using the steps for the 128x128 drawing (design the full character).
            2. Draw the extreme poses (in stick-person form).
            3. Now for the breakdowns
            4. You can also do in-betweens for smoother animations.
            5. Next do the triangle pass for the stick figures.
            6. Lastly do the solid/shape pass.

            Note: I actually used straight-ahead for this (no extreme, breakdowns or in-betweens), but I added those instructions if you wanted to know how to animate it that way. Also, I copied and pasted the head for the other frames.

            Stick Poses
            0_1492023546932_anim1.png

            Triangle Pass
            1_1492023546934_anim2.png

            Solid/Shape Pass
            2_1492023546934_anim3.png

            Gif
            0_1492023965675_anim_gif.gif

            1 Reply Last reply Reply Quote 0
            • TutorialDoctorT
              TutorialDoctor
              last edited by

              Most of the time, you will need only three types of color. The shadow color, the midtone color and the highlight color.
              0_1496927980691_color.png

              1 Reply Last reply Reply Quote 1
              • TutorialDoctorT
                TutorialDoctor
                last edited by TutorialDoctor

                What makes a cat a cat?

                One questions you should always ask yourself when designing characters is "what makes this character unique." If you are designing a cat, the first thing you should ask is "what makes a cat a cat?" In other words, what key visual features does a cat have that makes it distinguishable from other animals?

                For a cat, a triangle nose, triangle ears, and whiskers are three key features that make a cat a cat. Whether you give it a box shaped head or a round head, or a triangle head, if you don't have the triangle nose, the triangle ears, and the whiskers, it is not a cat.

                0_1497101886790_design1.png

                In the images above, with the triangle ears and the triangle nose, this still wasn't a cat, but when I added those whiskers, all the details needed to convey a cat were present. Any other details are for personality or to enhance the uniqueness of the individual cat.

                1 Reply Last reply Reply Quote 0
                • TutorialDoctorT
                  TutorialDoctor
                  last edited by TutorialDoctor

                  What makes a man a man and a woman a woman

                  Take these four silhouettes from left to right. With one small change the 2nd figure looks more like a woman than the first figure. This is because it appears that the hips are wider. We know that the key difference between a man and a woman is that a woman can bear children and a man can't. Thus, without the wider hips (which are for the purpose of child bearing) this detail says, "woman."

                  With an additional detail (the breasts), the next figure looks even more like a woman (the breasts are for the purpose of producing milk for the baby). Thus, another detail that says "woman" is the breasts.

                  One final detail that distinguishes a woman from a man is long hair.

                  There are other details but these three are key details that distinguish the two.

                  0_1497102534219_man&woman.png

                  1 Reply Last reply Reply Quote 0
                  • TutorialDoctorT
                    TutorialDoctor
                    last edited by TutorialDoctor

                    Draw a Female eye:

                    1. Draw a downward curve (Important)
                    2. Draw a circle pupil (usually not the entire circle but part of it).
                    3. Start from the outside and draw a partial upward curve.
                    4. Draw the lash tip going up from outside corner of the eye (Important detail)
                    5. Draw a thin arched eyebrow (important detail),
                    6. Draw complete the eyebrows with a tapered triangular shape.
                    7. Color in the eyebrow
                    8. Color in the pupil.
                    9. Add the highlight.

                    The key details of a female eye are the lashes and the thin eyebrows.

                    0_1498248803599_obj_eye.png

                    The important details here is the curve of the top and bottom of the eye, the extended lash in the corner, and the thin eyebrows. The details that distinguish the male eye is the rectilinear shape and the thick eyebrows.

                    0_1498249228934_obj_maleEyebrow.png

                    1 Reply Last reply Reply Quote 0
                    • A
                      anquan
                      last edited by anquan

                      This post is deleted!
                      1 Reply Last reply Reply Quote 0
                      • C
                        chenwei @TutorialDoctor
                        last edited by

                        great tutorials . Piskel app is fantastic. It's offline, online, open source and just works. Also built for this purpose and adding animation is simple. Cannot recommend enough. I've been using Piskel as an art program for almost a year now and I love it. Im using my XP-Pen Artist 12 Pro tablet monitor , a perfect product for pixel art.

                        1 Reply Last reply Reply Quote 0
                        • First post
                          Last post