Pixel Art Class - Making Pixel Art Worth Animating

Поделиться
HTML-код
  • Опубликовано: 13 июн 2024
  • Heya Pals!
    Today I've got a good chunk of content for you all about preparing your pixel art (and yourself) for the animation process. I initially was just going to cover some basics for sprite design, but ended up going down the rabbit hole on animation methodologies too, so I hope you enjoy the ramble haha.
    Let me know what you'd like me to cover next!
    Thanks!
    - Adam
    Chapters:
    0:00 - Introduction
    1:33 - What not to do
    7:42 - Visual Semantics and Motion
    14:13 - The Challenge of Animating Pixels
    16:27 - Personal Animation Examples
    19:52 - Keyframing vs Straight Ahead
    23:06 - Straight Ahead Process Demo
    29:48 - Keyframe Process Demo
    35:35 - Creating Animation-Ready Sprites
    40:36 - Conclusion
    40:58 - Outro
    Music:
    Rifti Beats - Chocobo & Chill [Gamechops.com]
    "Disney Animation" Footage:
    AaronBlaiseArt
    "Anime" Footage:
    Dragon Ball Z - Akira Toriyama & Toei Animation
    ----
    This video features clips from my stream. Catch it live: Mon, Tues, Thurs and Fri 1-6pm AEST.
    Twitch: / adamcyounis
    Twitter: / adamcyounis
    Discord: / discord
    Become a Patron at / adamcyounis
    Download assets and games from the stream at uppon-hill.itch.io/
    Later, pals!
  • НаукаНаука

Комментарии • 147

  • @vn74m3d
    @vn74m3d 3 месяца назад +21

    It's a pity that people who are not specifically interested in pixelart miss out on all your clear understanding of semiotics/semantics. What you point out in all of your videos between the lines, so nicely illustrated by pixelart, matters for all design and art related departments, or even put further, matters for everything regarding communication and lastly our whole perception of reality.
    Your content is never just a cheap trick, your genuine understanding of the matter is a promise always kept, and if one wants to, one can learn a lot more than pixelart from this. Thank you Adam!

  • @eboatwright_
    @eboatwright_ Год назад +353

    Me: "Hey, can I watch you make your pixel art, to see your technique?"
    Adam: "Yeah, sure"
    Me: "Ah yes. His technique is being way better than me."

    • @flamesofhellstudio
      @flamesofhellstudio 6 месяцев назад +7

      Practice and understanding why they're doing what they're doing is how they get this good. And likely knowing themselves and knowing when to rest to avoid burnout.

    • @MediHusky
      @MediHusky 2 месяца назад +6

      me, doing basically stick figures but in pixel art: Hmm yes the folds of the shirt yes, indeed. Indubitably. Quite.

    • @eboatwright_
      @eboatwright_ 2 месяца назад

      @@MediHusky Facts 😂

  • @alexeykosogov2652
    @alexeykosogov2652 Год назад +138

    I have the same technique as you, and I use copy-paste in simple animations like breathing. You gave me so much motivation by showing that you spend a lot of time on your animations just like me. But you working non-stop, no matter what! Now im so tired Im not even open Aseprite for 2 weeks. But today, im gonna show that pixels, whos the boss! Thank you so much. I love you, man.

  • @apoxfox
    @apoxfox Год назад +96

    Those spider animations are insane, always feel so inspired after watching one of your videos

  • @Dumbunny420
    @Dumbunny420 4 месяца назад +15

    Just spent five hours making all angles of my character sprite, then made the idle animations, then started with the walking, and realized the legs were so hard to try an animate, went back and changed so much that I hated my sprite, and now I'm remaking the entire sprite, so 10 hours total were wasted on something that I no longer even have but I'm going to continue to convince myself the practice was worth it

    • @360dom360
      @360dom360 Месяц назад +3

      Sounds like a good learning experience

    • @Mgsthpv
      @Mgsthpv 21 день назад

      So in other words: learning time :) dont sweat makin mistakes and wasting time. Not a waste if you enjoy doin art :)

    • @whitehairedpleb954
      @whitehairedpleb954 9 дней назад

      Truest words

  • @JumbaJumby
    @JumbaJumby Год назад +23

    The tip about using separate layers is pretty huge. I already started with the most defining motion and built everything to support that with contrasting colors, but using separate layers for quick iteration is a game changer. I don't know why I didn't think of that lol.

  • @pn4960
    @pn4960 Год назад +36

    Your comments at the beginning reminded me of the “ligne claire” style developed by Hergé, the creator of Tintin and one of the most renown Franco-Belgian comic books author of the XXth century

  • @The_Crucifix
    @The_Crucifix 11 месяцев назад +19

    Literally best man in the world. The amount of invaluable, essential pixelart information you provide is staggering. I always sit down to draw after your videos, because they are very inspiring and put my own practical ideas in place. I'm sure your videos will grow a lot of good pixelart artists

  • @Jhakaro
    @Jhakaro 4 месяца назад +5

    Great video but just want to point out for others watching that Keyframe animation has absolutely nothing to do with copy and pasting aspects or holding frames for longer with only minor altercations. That's called limited animation and is animated on 2's or 3's or even higher sometimes, meaning, every 2 or 3 frames of actual on screen time, only one new drawing is made. In anime, due to time constraints, most studios will generally try to keep certain elements static as much as possible, only moving what is necessary to convey the emotion or movement. This is also true for even high budget movies like Klaus made by expert animators in "the west" where characters in the background will be stuck in place and unmoving as the main focus is on the foreground characters. Most won't even notice as their eye is drawn to the movement up front.
    Keyframe animation is done for multiple reasons and was and IS used WIDELY in western animation. 1) it helps keep the volume of an object or creature consistent. You plot out the basic structure of the movement, beginning, middle, end essentially and as long as those volumes are all the same, then you go in, add breakdowns, which are basically minor keyframes to accentuate specific main keyframes you've drawn. After that movement is looking solid, you then go and do in-between animation which is to smooth out the movement. The in-betweens use the keyframes and breakdowns to transition smoothly between the main points of action and using the breakdowns, you know which parts of a movement to favour in your in-betweens. If you in-between everything evenly, you'll get a bland uninteresting animation. This is often called slow in and slow out, where we slow down the action as we enter it or exit it.
    2) in many studios, the keyframe animator is different than the breakdown artist or the in-betweener. Keyframes are the most vital drawings that set up the entire movement and flow for the others to follow so the idea is that the senior and more experienced animators keyframe the main movement, make the big decisions. Then lower down artists handle the breakdowns based off of their keys and then junior animators often worked on the in-betweens which have the least amount of responsibility or artistic choice/decision making (though still a very important skill in and of itself), all in order to save on time so keyframe artists can work on more keyframes rather than doing an entire scene from beginning to end. This aspect of not doing an entire scene yourself, however, varies greatly from movie or movie, project or project. In many Disney movies a scene might be mostly just one artist that handled everything but even then, most of the time they still used keyframes to keep the sense of volume the same and sketch out the movement first.
    Straight ahead animation is less technical and more flowy. Free. Feel it out. But the main issue with it is that often you might start an animation and spend days or weeks working on it only to realise that the movement you made isn't quite what you wanted or the volumes are inconsistent, off-model etc. the character grows from frame 1 to frame 110 without you realising (especially when on paper as you can only roll about 5-6 pieces of paper at a time on a light desk). And if that happens, you now have dozens or even hundreds of frames wasted that you need to fix or redo entirely. For small, simple animations straight ahead can work well but for very long or complex scenes, keyframes are often nearly a requirement.
    Both have their uses and often honestly, it just comes down to the animator themselves and studio workflow

  • @Pockeywn
    @Pockeywn 6 месяцев назад +2

    your intro does what an intro should. i clicked in a video about animating pixel art and immediately saw well animated pixel art and knew i was in the right place

  • @Sackwiz
    @Sackwiz 12 дней назад

    Your animations are absolutely amazing... I'm amazed. Well done.

  • @nemo9396
    @nemo9396 4 месяца назад +1

    Very interesting and liberating approach this one

  • @stonecoat_art
    @stonecoat_art 4 месяца назад +2

    hey adam, im lucky enough to work as a pixel artist and animator. I gotta say that your videos were instrumental in getting my career off the ground, and i still revisit videos like this one when i feel myself slipping a bit with my art.
    thanks for everything man

  • @jerrygreenest
    @jerrygreenest Год назад +11

    AdamCYounis: Don't do this while making animated pixel art
    Me: I never intended to. I'm not even a pixel artist. Just having pleasure to see a professional in work.

  • @msv266
    @msv266 Год назад +5

    Thank you for putting so much effort into your tutorials. Your videos really help understand complex concepts and are so motivating

  • @pottingsoil723
    @pottingsoil723 Год назад +5

    Just in time for my morning coffee. Thank you Adam, this was exactly the animation help I've been needing lately. ☕👍

  • @Erika10016
    @Erika10016 Год назад +4

    Thank you so much for making those videos! You explain things so well and I've learned a lot from you!

  • @Microbex
    @Microbex Год назад +11

    Uhmm yes, the spider and staircase animations are particularly great.
    Great masterclass! 👍☺️

  • @Dooby_Gooby
    @Dooby_Gooby Месяц назад

    So freaking good. I've been animating pixel art for quite a while now for my game, and this has shown me just how much room I have to improve. I sincerely thank you sir.

  • @goldenPixeler
    @goldenPixeler Год назад +13

    I don't know why your new videos does not hit the 100k views cause you are doing a lot of work 🥺

  • @collin2401
    @collin2401 Год назад +4

    Woah, those animations are super smooth! I'm making my own game right now and trying to keep the visuals as basic as possible, but I'd love to make a Metroidvania with pixel art like yours one day when I have more experience. Anywho, thanks for making such high quality videos! They're very helpful for newbies like me lol

  • @Spaaace
    @Spaaace 29 дней назад

    You're an inspiration, Adam. Thank you.

  • @matthiasklostermeier6799
    @matthiasklostermeier6799 Год назад +1

    Thanks for a new video!! Always love them. Sometimes I watch you on twitch, but honestly most of the time I am just not awake or on my Mac when you stream, so the more compact youtube videos are much easier to watch and concentrate :-)

  • @rageheals1607
    @rageheals1607 4 месяца назад

    Your animations are so smooth. Really great video, thanks.

  • @alejandrovelezsainz2440
    @alejandrovelezsainz2440 Год назад +3

    Wonderful job!! A great workflow video for indie devs and graphic designers

  • @0yaSumi6908
    @0yaSumi6908 Год назад +3

    I am so glad I subscribed to this channel, it's the best pixel art channel I've ever found:)

  • @jerrygreenest
    @jerrygreenest Год назад +4

    Rotating tower to simulate 3D looks so sick!

  • @rolitae
    @rolitae Год назад +1

    Insightful video, Adam! Great job 🥳

  • @morticias5043
    @morticias5043 Месяц назад

    wow i never knew of this trick of animating the moving limbs first, and then filling colors when needed. crazy. i usually find it difficult to move and animate a lot of the details.. and this way makes more sense

  • @antoniojimenezperez50
    @antoniojimenezperez50 3 месяца назад +1

    Very good stuff here❤

  • @Skeffles
    @Skeffles Год назад

    Great to see how your process works!

  • @Jojos_bro
    @Jojos_bro 6 месяцев назад

    simplify is another level of getting better!
    nice video

  • @benjipixel1438
    @benjipixel1438 Год назад +1

    Adam asks: Tutorials? Dev vlogs?
    Adam gives: *both in one video*
    Me: happy

  • @SmashAdams
    @SmashAdams Год назад

    Great video Adam. very insightful

  • @bitbraindev
    @bitbraindev Год назад +15

    I am trying to apply your technique as well now. My sprites are 16x16 and I find it way more difficult to animate properly on such a small canvas (with sub-pixel animations) but on the upside I am much quicker _per frame_
    I love these videos of yours and cannot wait for Insignia to come out!

    • @saku-ra8813
      @saku-ra8813 Год назад

      Good luck with the animation :)! Small sprites are a pain to animate

    • @lonelyfloat2582
      @lonelyfloat2582 Год назад

      @@saku-ra8813 Especially walk cycles, every time i try i get stuck trying to make the leg motion readable

    • @otto2853
      @otto2853 6 месяцев назад

      Pain to animate, blessing to draw xd

  • @SebsterLive
    @SebsterLive Год назад +2

    That's my name on the top haha! Useful video as always!😁

  • @HenkkazoR
    @HenkkazoR Год назад

    These videos are very helpful thank you

  • @GaryParkin
    @GaryParkin Год назад

    Very interesting. Thanks Adam. I'm just starting out with 2D, and it looks like something I'd want to use. Been doing 3D and modeling for ages.

  • @jonathanspangenberg1563
    @jonathanspangenberg1563 4 месяца назад

    Wow, your videos are so helpful. You are such a natural teacher. Do you also do the programming for your game? I would love to hear about that side of things too; the game production side of things. Thank you for your hard work and commitment to this channel.

  • @Blinaka
    @Blinaka Год назад

    18:44 This is incredibly amazing in a totally positive way, woowww

  • @hugoclarke3284
    @hugoclarke3284 Год назад +1

    Brilliant video

  • @ennizodev
    @ennizodev Год назад +1

    Easy to Understand, thanks~^^

  • @Floki-us7gq
    @Floki-us7gq Год назад +2

    Hi just got aseprite. Glad i found this channel, im already involved with some blender modeling and animation, but id like to start doing some pixel art too. Im glad you feature relevant art advice for game dev and animation. Thank you

  • @vincentboulet1937
    @vincentboulet1937 Год назад

    Amazing video!

  • @jumpkut
    @jumpkut Год назад +1

    I'm a simple man. I see a new AdamCYounis video, I click like.

  • @gigaman007
    @gigaman007 Год назад +1

    You doing great job 💪

  • @ricksto87
    @ricksto87 7 месяцев назад

    8:30 Excellent point. What a revelation

  • @DaniPotatoArt
    @DaniPotatoArt Год назад

    Excellent video

  • @themelancholyofgay3543
    @themelancholyofgay3543 Год назад

    the guy on the thumbnail looks so cute, i am practically drooling

  • @c64cosmin
    @c64cosmin Год назад

    Pixel Art Master Class*
    Thank you very much!

  • @rcjvet
    @rcjvet Год назад

    Great work, as always. Adam, do you take freelance work?

  • @jamstarx
    @jamstarx Год назад

    This is a good one!

  • @80Apoc
    @80Apoc Месяц назад

    I'm Looking forward to my lack of detail being an artistic choice that conveys meaning efficiently, instead of my lack of detail conveying a lack of artistic ability.

  • @panampace
    @panampace Год назад

    Wow that staircase. Just wow.

  • @NK-kk9sv
    @NK-kk9sv Год назад +1

    Hey man, I love your videos, but I have a unusual request. In one of your older videos "Pixel Art Class - Platformer Jump Animation" you explained a very cool practice of using different sprites for different velocities ("5:24 - Velocity Based Animation Code Breakdown"). Sadly I am new to Unity and did not understand the full process and I couldn't find a fitting answer elsewhere. Could you please do a very short video explaining this a little more detailed? Thank you in advance.

  • @MaxW0lf
    @MaxW0lf Год назад +3

    Is there any reference on how to make sprites for a top down game for mobile? Like size of the canvas vs how the tilemaps have to be, so the character doesn't look to big in a small world. Gladly appreciated if you could let me know!
    Thx a lot! Started seeing all your vids and this gives me hope that i can make a game, and animate sprites and other stuff. Thx! And good luck in your projects!

  • @stephenrose3202
    @stephenrose3202 7 месяцев назад

    Your shirt is excellent. It is Fall here and I now want a plaid shirt with yellow highlights and my roommate wants a nightgown in the same pattern. 😊 With your old pixel art having a faded brown compared to the new red, you could have him have the old brown haircut in flashbacks? 😂 Yay for art 🎉

  • @sam-bk8hg
    @sam-bk8hg Год назад +1

    i love your videos ❤

  • @rachi7629
    @rachi7629 Год назад +1

    Holy crap that window better be a main fucking character

  • @timpawlovich9522
    @timpawlovich9522 Год назад

    Amazing :)

  • @sebkolind
    @sebkolind 4 месяца назад

    So good. I can’t even make a simple run animation lol

  • @codydragonstone
    @codydragonstone Год назад

    I wish I had a fraction of your talent.

  • @Ralgondo
    @Ralgondo 8 месяцев назад

    The staircase looks great, you could just make a gif of him running down the stairs and use it as a loading screen or something

  • @lethalxarchon7332
    @lethalxarchon7332 5 месяцев назад

    Absolutely love this video.
    Only gripe is you're using a lot of similar shades of red for examples and color blind people might have a harder time following along and seeing what you're talking about.

  • @yonanovack4140
    @yonanovack4140 7 месяцев назад

    commenting for engagement lol great video adam

  • @dnajlwosqkdasjczdbkahdwcs
    @dnajlwosqkdasjczdbkahdwcs 2 месяца назад +1

    3:05 Man runs like Steven Seagal

  • @hewicopter8878
    @hewicopter8878 Год назад

    Can you do a set up video of, programs, hardware, etc. you use for doing pixel art? Thank you so much for your videos !

  • @GINGINSHAAN
    @GINGINSHAAN Год назад +1

    The best 🤝

  • @Winterhe4rt
    @Winterhe4rt Год назад

    So all this is really great advise but do you have any advise on how long a single frame should be hold in ms? I see you got this great animated ball with just a couple of frames used. I personally would need at least double that amount to make it even somewhat close. Is there some rule of thump on how long a single frame for such a purpose should be?

  • @pg3648
    @pg3648 Год назад

    29:53 me (Adam) watching Adam talk about Adams animation

  • @Cottee93
    @Cottee93 Год назад

    Hey legend, incredible tutorial as always! I have a question - if you wanted to include character customization in a game that uses pixel art and frame-by-frame animation, how would you go about that? Is it possible? Would it have to involve unspeakable hours redrawing each frame for changes in hairstyle/clothing etc? Keep up the awesome work!

    • @Taehl
      @Taehl Год назад +2

      One of the simplest ways to do it, in my humble opinion, is to let players pick the colors used on their character - hair, skin, shirt, pants, and/or whatever you feel is appropriate. Then you cut each recolorable thing into its own layer (if they're not that way already) so you can export spritesheets of each separately (eg., spritesheet 1 has just the hair, spritesheet 2 has just the skin, etc.), which in this case should all be in bright greyscale (no color, just shading - like they've all been painted white). That's because when you draw your final sprite in-game, you put those pieces at your character's coordinates and render each with the custom colors that were chosen (instead of drawing them with white like you do for full-color sprites).
      It's is an age-old trick that used to be done with palette swapping on old hardware, but modern variations like this can still be seen in games like Starbound, Stardew Valley, and so on.
      There are other ways you could go about it, but I can't think of anything that would be less work to implement (unless you already have some sort of elaborate system that generates all your sprites for you, like if you already made all your characters in 3D and have Blender rendering your spritesheets (like they did for Factorio) or something).

  • @aliakhtar6079
    @aliakhtar6079 Год назад

    Thanks for an amazing video Adam once again, I wanted to ask why does my animation flicker when I export it to gif 😞

  • @endergame8267
    @endergame8267 4 месяца назад

    The rule i kept from you is start simple, stay simple

  • @krmzdomates1851
    @krmzdomates1851 Год назад +1

    AdamCYounis Can you make a video about the frame properties (duration milisecond).

  • @psyboyo
    @psyboyo Год назад +1

    6:54 Please, whats the name of that palette? You are amazing!

  • @xSPESHERx
    @xSPESHERx Год назад

    Yo Adam. Do you use Graphical tablet for drawing pixels? Or only mouse?

  • @Pixilated_YT
    @Pixilated_YT Месяц назад

    Final fantasy 7 lofi in the background thoughh

  • @gilbert4351
    @gilbert4351 7 месяцев назад

    Found another great channel! 😃

  • @vincentjeorgedapito789
    @vincentjeorgedapito789 Год назад

    can you make a tutorial video showcasing animated tilemaps? I'm curious how to make that, like animated waterfall.

  • @ethanix6815
    @ethanix6815 Год назад

    Hello
    I am creating a 2d pixel game in unity
    You are helping me a lot in the process
    Your videos are amazing, your way of teaching is fabulous
    One thing I ask for is the way to implement some magic effects from scratching to importing it to unity
    Like some water bending or fire bending
    That would really be great!
    You are the best
    Good job and wish you luck👏🙏

  • @SpiderSamYT
    @SpiderSamYT Год назад +1

    What's the name of the program you're using? Because this video was so well done I wanna animate some pixel sprites again, I just dont know what the programs called

  • @jessiwillfressi_3866
    @jessiwillfressi_3866 Год назад

    What did you study to know all this stuff, this is so interesting how you know so much about colors, shapes, drawing in genereal

  • @TheCrawliX
    @TheCrawliX Год назад +1

    11:21 There's hardly anything here but we know it's a head.
    -Me seeing a steak hanging upside down :"oh"

  • @PixelKnight93
    @PixelKnight93 7 месяцев назад

    Hey Adam, I am looking for your video on canvas sizes, but I can't seem to find it.

  • @Jaredbud
    @Jaredbud 3 месяца назад

    hear a year late but gonna ask anyhow....When it comes to idle animations, how would you add a subtle blink to the animation. Would that make it too busy or would it be too much?

  • @3kluffy719
    @3kluffy719 Год назад

    Adam can you make video about using supertiled2unity with aseprite

  • @AstriaTVTruthExposed
    @AstriaTVTruthExposed 7 месяцев назад

    What program did you use to do this ?

  • @frediculous1191
    @frediculous1191 Год назад

    Hi Adam! I'm sorry if you covered this at some point and I missed it, but what framerate/frame duration do you recommend to use with animations? I'm struggling to find one that I like.

    • @AdamCYounis
      @AdamCYounis  Год назад +1

      I've been working with 10fps (100ms) for a long time as a standard. Faster animations I'll go to 12 or even 16.

    • @frediculous1191
      @frediculous1191 Год назад

      @@AdamCYounis Oh wow, for 10fps your animations look super smooth. Thank you so much for getting back to me!

  • @abdoulraoufgambo
    @abdoulraoufgambo Год назад +1

    coooooolll

  • @wilkerl6159
    @wilkerl6159 4 месяца назад

    37:42
    I just want to remind myself of this

  • @bevouliindesign7777
    @bevouliindesign7777 Год назад

    Hi that's an awesome guides. What is the name of the software you use to make the sprites? thank you very much in advance!

  • @gutenpog
    @gutenpog Год назад +6

    Question for you Adam would it be ok to learn pixel art just by using a mouse no tablet included?

    • @shiwanmi
      @shiwanmi Год назад +4

      I'm interested in hearing his opinion as well, but I'd say absolutely! In my experience most pixel artists start on a mouse. I certainly did and many very skilled artists I've talked with use a mix of tablet and mouse depending on the scale of their work. Many use mouse or even track pad exclusively! Don't wait until you have all of the tools you may eventually want. Start now!

    • @figates9220
      @figates9220 Год назад +2

      @GutenPogging @Shiwanmi Check out Brandon James Greer - guy uses only touchpad of his laptop and is doing great

    • @plague_doctor0237
      @plague_doctor0237 Год назад +1

      Yes, it's a valid instrument to use, it only depends on the skill

    • @theotutuianu5567
      @theotutuianu5567 Год назад

      i use a mouse. i want to move to a stylus but i have done soo much art and animation with a mouse

    • @apoxfox
      @apoxfox Год назад

      I use a drawing tablet for digital art but I’ve only ever used a mouse for pixel art. You don’t really need to worry about making perfect straight lines in pixel art so I would say a mouse works great! Totally your preference though

  • @noelleciento7590
    @noelleciento7590 Год назад +1

    Nice. Your art is the right fit for Faketown 2nd creative competition. Faketown is the OG metaverse and it is a popular game back in the early 2000s. It's similar to Sims, but in 8-bit form.

  • @phnkcell710
    @phnkcell710 Год назад

    Crazy both versions . OMG mine looks like make by a child

  • @Kichu0Kalamity
    @Kichu0Kalamity Год назад +1

    Hey guys, what is it that Adam mentioned about digital principles in psychology ? Cant find a specific book or article

  • @l_guy
    @l_guy 10 месяцев назад

    1:29
    WHEN YOU WALK AWAY
    YOU DON’T HEAR ME SAY
    PLEASE!
    (Oh baby don’t go)

  • @Angel-Otk
    @Angel-Otk 4 месяца назад

    Ok bro

  • @John-hm6yh
    @John-hm6yh Год назад

    Does anyone know what theme Adam uses?

  • @txlogs
    @txlogs Год назад

    If I ever make a video game, it started here

  • @sandip_1698
    @sandip_1698 Год назад

    Which software is that ?