How to Draw and Animate Hollow Knight Characters - PS and Unity BEGINNER TUTORIAL (2019)

Поділитися
Вставка
  • Опубліковано 30 лис 2024

КОМЕНТАРІ • 154

  • @Blackthornprod
    @Blackthornprod 5 років тому +214

    Hollow Knight + a great tutorial :D, count me in ! Great job, keep it up :)

  • @daisyfairy42
    @daisyfairy42 3 роки тому +82

    Awesome tutorial! Animator here who's a fan of hollowknight and was curious - here's some tips for folks trying this at home:
    - Bare minimum number of fps you need to make an animation appear smooth to your eye is 24, so you can also choose to set your animation to that FPS if you want something really fancy
    - Animate on 2's instead of 1's to have a more stable and less jittery animation. In normal terms, that means have your drawings be 2 frames long, instead of just 1. Also means you cut the number of drawings you need to do in at least half. Reserve 1's for very fast movements.
    - please, god, PLEASE use the timeline animation in photoshop instead of frame animation. It works more like a video editor such as premiere, letting you drag out the length of different clips & such very easily, rather than having to copy them to an entire new frame, and manipulate separate layers of animation at the same time. (meaning you don't need to do something like copy the head, just transform it vertically to bob up and down
    Have fun and happy animating! :)

    • @babayaga1220
      @babayaga1220 2 роки тому

      Thx a lot bro

    • @MrXlee1967
      @MrXlee1967 Рік тому

      can you make a tutorial?

    • @daisyfairy42
      @daisyfairy42 Рік тому

      @@MrXlee1967 Not for photoshop unfortunately since I've graduated and lost access to adobe software, but honestly there's already a lot of excellent tutorials out there for animation! Just searching up 12 principles and "how to animate in x software" will get you good results on youtube. (Also to be completely honest I'm not comfortable making video tutorials, this is my personal yt channel)

    • @binaktivamkoten2173
      @binaktivamkoten2173 3 місяці тому +1

      Still, after 3 years, your comment helped me A LOT

    • @daisyfairy42
      @daisyfairy42 3 місяці тому

      @@binaktivamkoten2173 Ayyy I'm glad it did!! It was some of the stuff we learned day 1 of my uni program ^.^ (Though nowadays post-grad I'm like "run as far from adobe as you can" lol)

  • @johnstonliu
    @johnstonliu 5 років тому +51

    I accidentally set my size to 300x500 inches. No wonder my Photoshop was so slow.

  • @cromo4839
    @cromo4839 5 років тому +91

    Video: Hollow knight
    Music: Minecraft
    *yes*

    • @thecrusader677
      @thecrusader677 4 роки тому +8

      Hotel: Trivago

    • @AQ-101
      @AQ-101 3 роки тому

      @@thecrusader677 audible: idk

  • @TheRealCornelius
    @TheRealCornelius 5 років тому +9

    Art and animation is my strong suit, its making games that makes my head pop

    • @gamesbygrigg7447
      @gamesbygrigg7447  5 років тому +4

      I guess we're opposite :b

    • @SadTown99
      @SadTown99 7 годин тому

      My strong suit is music/sound design & writing…. Sounds like between us 3 we would make a well balanced team 😜

  • @DoctorTrainGaming
    @DoctorTrainGaming 5 років тому +40

    That ASMR Voice

  • @Invulneraty
    @Invulneraty 5 років тому +17

    This was the most underrated tutorial that I have ever seen, a huge thanks.

  • @gen2777
    @gen2777 3 роки тому +4

    This dude created kickass tutorials and then left

  • @voids5225
    @voids5225 5 років тому +8

    I'm surprised you don't have more subscribers with the video quality and information

    • @gamesbygrigg7447
      @gamesbygrigg7447  5 років тому +2

      hey thankyou! That is very motivating to hear. I am just starting out so fingers crossed!

  • @dasyud
    @dasyud 5 років тому +16

    Came from the subreddit
    Edit: It's an amazing tutorial! Wouldn't be surprised if it gets a million views!

  • @ndjxisjenxjix9525
    @ndjxisjenxjix9525 5 років тому +3

    Hollow Knight's art was made by hand. All of it, no vectorial stuff. Nice video and tutorial anyway!

  • @soysauce6534
    @soysauce6534 4 роки тому +3

    Thank you so much! A ton of tutorials don’t explain as well, not to mention that since I’m just starting out the export process has been a struggle. Thanks for the in depth tutorial, you earned a new subscriber

    • @chillolacom
      @chillolacom 4 роки тому

      Soy Sauce do u know a video that will show me how to export the way he does?

  • @DanBeau
    @DanBeau 3 роки тому

    i had no idea about the pen path editing at 8:18, that is insanely helpful!

  • @qasim-_-5218
    @qasim-_-5218 3 роки тому +1

    For those in 2021 version, and cannot see the samples, go to the top right of animation window, then click on the three dots, and then click show samples

  • @VurseFilm
    @VurseFilm 3 роки тому

    The music... So calm

  • @YuvrajSingh-hp7ig
    @YuvrajSingh-hp7ig 3 роки тому

    This should have like a million views. Keep up the good work.

  • @mrmikutome797
    @mrmikutome797 4 роки тому +1

    Exactly what i was looking for

  • @kaizensystemstudio
    @kaizensystemstudio 4 роки тому +2

    Nice tutorial super clean and easy to follow 👍👍

  • @waltercastro2847
    @waltercastro2847 4 роки тому +2

    Brother! You made it so damn easy. YOU'RE AWESOME!

  • @zibji
    @zibji 4 роки тому +3

    Great content mate, this is super helpful for a project I’m working on. Thanks a bundle!

  • @mikamuestudios
    @mikamuestudios Рік тому

    Great tutorial. Well explained, and I have been using Photoshop for years and never knew how the Pen tool worked nor did I know about expanding selections... That's a process improvement for my workflow!
    However, I have 1 tip. Skip the reference dot for pivot point. Instead, simply set the pivot point on the first image wherever you want it, then, (since all the images are the same size) copy and paste the X/Y pivot point coordinates to the new images. This is much easier, and will give you better, more consistent results, and you won't have to worry about getting rid of the dot after.
    Cheers. :)

  • @grated2371
    @grated2371 5 років тому +11

    Neat and clean explain bro ! Superb and I'm going to try ! Actually I'm using inkscape but some way it not same as Photoshop ! Keep updating !

    • @dblades2240
      @dblades2240 3 роки тому

      Agreed even the unity master explaining unity its still a doose

  • @QuiverKiller
    @QuiverKiller 5 років тому +2

    Awesome video, I had no idea PS was that useful for animating

  • @eitanezra8963
    @eitanezra8963 5 років тому +2

    Very nice, mate

  • @jack8356
    @jack8356 3 роки тому +1

    Thank you so much for making this. You actually explained it very well and im going to try to make games so i needed to know how to make characters.

  • @Richard-zs1bm
    @Richard-zs1bm 3 роки тому

    You earnt my subscription. Great video!

  • @mrmixedvideomaker9767
    @mrmixedvideomaker9767 4 роки тому +1

    Exactly what I was looking for
    Thanks for the tutorial!!!

  • @brandondelahoussaye8323
    @brandondelahoussaye8323 5 років тому +1

    Very nice tutorial! Please keep them coming

  • @ays9949
    @ays9949 3 роки тому +1

    Wow this was realy relaxing to watch and also very helpfull.Thanks a lot!

  • @ThemildmanneredgamerBlogspot
    @ThemildmanneredgamerBlogspot 2 роки тому

    Great tutorial, thank you for posting.

  • @JSGGamingChannel
    @JSGGamingChannel Рік тому

    what a great tutorial

  • @saieshpatil7077
    @saieshpatil7077 5 років тому +8

    I wish I had seen this at starting when I learned PS and unity. Great video !
    Q - What was the purpose of red dot ?

    • @gamesbygrigg7447
      @gamesbygrigg7447  5 років тому +2

      Thank you!
      The red dot is so you can set a pivot point for your animation. If it's not in the exact same spot every frame then the whole thing won't be smooth.

    • @artexho4188
      @artexho4188 4 роки тому

      Hi. Did you complete full unity course ?

  • @jseneque
    @jseneque 4 роки тому +1

    Hey well look at that. I have been following Blackthornprod and admire his workflow but thought you need a drawing pad.... you have introduced a tool a programmer can actually draw with...a mouse. Thank you for taking the time and sharing this.

  • @Rhapsolin
    @Rhapsolin 3 роки тому

    this is really really great

  • @ReasonWhyAsk
    @ReasonWhyAsk 7 місяців тому

    Really helpful viedo! Thanks

  • @mangadoofus1725
    @mangadoofus1725 2 роки тому

    I know thats a late comment
    But hollow knight + animation tutotial + minecraft music
    You son of a ***** im in

  • @G000POINTBLANK000D
    @G000POINTBLANK000D 2 роки тому

    love it! cool vid! thx!

  • @ragnarokgc
    @ragnarokgc 3 роки тому

    awesome tutorial, thank you!

  • @clock3589
    @clock3589 4 роки тому

    I love that skeleton creature

    • @gamesbygrigg7447
      @gamesbygrigg7447  4 роки тому

      Well thanks! He doesn't have a name yet. Any thoughts?

    • @clock3589
      @clock3589 4 роки тому

      @@gamesbygrigg7447 umm Skelly?

  • @campbellclark3331
    @campbellclark3331 2 роки тому

    thank you for making this video, it saved
    m
    y marriage

  • @CodeGaff
    @CodeGaff 5 років тому +2

    Great tutorial mate!
    I'm sure many will find this extremely helpful!

  • @TM-jb8bw
    @TM-jb8bw 3 роки тому

    Really good tutorial!

  • @ChrisTeeGaming
    @ChrisTeeGaming 4 роки тому

    So useful. Thanks mate

  • @anjobihis2052
    @anjobihis2052 4 роки тому

    I like your taste in music

  • @Chriszeki
    @Chriszeki 3 роки тому

    Great tutorial, thanks for sharing

  • @FavoriteCentaurMoe
    @FavoriteCentaurMoe 5 років тому +1

    what an awesome video!!!!

  • @ahmet-ln7hs
    @ahmet-ln7hs 4 роки тому

    This tutorial is awesome.

  • @rafarodriguez4765
    @rafarodriguez4765 9 місяців тому

    Thanks for the video. New Follower
    I want to ask: why not create vectorial characters in a dedicated software like Illustrator? And why do not animate in Adobe Animate (for example)? it looks like Photoshop is a tedious process and prone to error while enabling/disabling layers

  • @markov829
    @markov829 Місяць тому

    Hi! Can I use GIMP to do this? Great tutorial btw :)

  • @StackAcademy
    @StackAcademy 5 років тому +1

    Awesome I like it

  • @DankMemes-xq2xm
    @DankMemes-xq2xm 2 роки тому

    Whenever I try to export layers as files, the process gets cancelled and says something about I can't use "Delete"

  • @kanchukotarevanth9449
    @kanchukotarevanth9449 3 роки тому

    It's so underrated

  • @canonwright3761
    @canonwright3761 4 роки тому +3

    I'm getting a gray outline on my sprite after importing it to Unity, I'mfinding that it's the slightly opaque pixels of the outer edge of the outline. I was wondering how I could fix this?

    • @pulaturalov5176
      @pulaturalov5176 8 місяців тому

      If you are still having this issue, select all frames inside your Unity project, go to Inspector > Advanced and check "Remove PSD Matte" option. This should remove the outline around your sprite

  • @SlaYerOne77
    @SlaYerOne77 Рік тому

    But what if i want it in that position like hollow knight ? Should i start directly to draw it from the side ? Or better all poses from behind front and sides ?

  • @tronalddump8442
    @tronalddump8442 4 роки тому

    Deserve more subs.

  • @Bruno-mq5ss
    @Bruno-mq5ss 3 роки тому

    Thanks it helps a lot :)

  • @johnwyke4415
    @johnwyke4415 5 років тому

    Thanks. I cant wait to try this when I get home.

  • @jessej071
    @jessej071 5 років тому +2

    Great video, I hadn't thought about editing with the pen tool so that helps the workflow and quality a ton.
    I do have a question tho: in Unity, since the sprite frames are all the same size (300x500px), could you just copy/paste the X position and Y position of the pivot from the first frame? I haven't tried this but it could help eliminate the red dot step and re-export.

    • @gamesbygrigg7447
      @gamesbygrigg7447  5 років тому +1

      hey thankyou!
      The unity sprite editor auto crops to the smallest dimension. Pretty sure it's because we are exporting to png and losing the transparent layer information. Each frame has a different size. There might be a better way around this but what I did with the red dot is just a quick solution I found myself!

    • @paulwin9036
      @paulwin9036 5 років тому

      Most likely not. Since the actual character is smaller than the starting canvas.

  • @SkelleRok
    @SkelleRok 4 роки тому

    Great tutorial!

  • @cungvuong9690
    @cungvuong9690 3 роки тому

    Thanks

  • @sosonena1238
    @sosonena1238 8 місяців тому

    hey thanks for the easiest tutorial ever just wondering what ps you are using

  • @agenoredivino950
    @agenoredivino950 4 роки тому

    thank you

  • @maixshinra6152
    @maixshinra6152 4 роки тому +2

    Hi. I understand that it is better to draw the character twice as large as the resolution of the game. If you want it in 4k, wouldn't it be better to draw it twice that size and then make it smaller? Thanks a lot.

  • @maixshinra6152
    @maixshinra6152 4 роки тому

    Very good video. This size to create the character will come in handy for smaller screen resolutions starting from 4k as the first option? I don't know if lowering the resolution of the character would still look good. Thank you.

    • @TaliYD
      @TaliYD 3 роки тому +1

      I was thinking about this issue too. In that sense, it's better to draw in Illustrator which is vector. Can scale it to any size and will always look perfect. But I find the outcome way less appealing so I'm really struggling which way to go with this. Photoshop -- nice with textures etc. More organic. Illustrator: practical, vector.

  • @loonaingamells6928
    @loonaingamells6928 4 роки тому

    I found you on reddit and I've subbed

  • @vegitoblue2187
    @vegitoblue2187 5 років тому +1

    If you really want to import that stuff to unity shouldn't you be using the power of 2 logic which is more performance-friendly? Just curious

  • @orchard800
    @orchard800 4 роки тому

    A great tutorial, but wasn't the Hollow Knight character made up of multiple sprites in a Sprite atlas?

  • @MrRayhan61
    @MrRayhan61 3 роки тому

    Cool

  • @osrsrs3
    @osrsrs3 3 роки тому

    Is there any way to attach a path to an already drawn shape that wasnt created with a path?

  • @pradityapascalisprawito3153
    @pradityapascalisprawito3153 4 роки тому +1

    Me: sees this video
    Also me: CLICK CLICK CLICK CLICK CLICK

  • @lordmango6060
    @lordmango6060 4 роки тому

    Whoa this is so easy to follow. I do like to hand draw my characters though, could this be achieved by drawing my character with my drawing tablet instead of using the mouse and pen tool? Maybe if photoshop has a vector pen tool?

    • @gamesbygrigg7447
      @gamesbygrigg7447  4 роки тому +1

      Yes!
      You can totally use your own style and just follow my flow with your own drawings. It will turn out just great.

  • @il4w
    @il4w 3 роки тому

    when i try adding stroke for hair it doesn't work for me although for head it was am I missing something?

    • @gamesbygrigg7447
      @gamesbygrigg7447  3 роки тому

      Make sure you have the right layer selected :)

    • @il4w
      @il4w 3 роки тому

      @@gamesbygrigg7447 hey thanks for this i tried this but that also doesnt seem to work I think part of the reason is I am working in photopea which is kind of an online version of photoshop since I cant pay for it rn but would you know any way I could download photoshop for free ?

  • @zinapantorno5905
    @zinapantorno5905 5 років тому

    Can you make a video of how to draw the grime but easy steps? 🙂🙂🙂

  • @MetalX-zt2ws
    @MetalX-zt2ws 2 роки тому

    Can you hand draw this as well?

  • @christofferhenriksen7631
    @christofferhenriksen7631 4 роки тому

    my image is the same size as yours, but you can see the pixles on mize so easy, but i cant see the pixeles on yours at all...

  • @motion-designerr
    @motion-designerr 3 роки тому

    If the character is similar to the character of another game, then there may be copyright issues? It's just that I also made a character similar to Hollow Knight...

  • @LagunaPreza
    @LagunaPreza 4 роки тому

    How would I make grass etc ? In the same resolution

  • @abdelatifaitouche3255
    @abdelatifaitouche3255 4 роки тому

    Which approach is better for animation , is it frame by frame with photoshop or with Bones (spine2d) , great tutorial by the way ❤️

  • @NgaeGameStudio
    @NgaeGameStudio 4 роки тому

    Super

  • @rashidfarhan6223
    @rashidfarhan6223 5 років тому +1

    subscribed bro

  • @Endriu192
    @Endriu192 3 роки тому

    Can you tell me the size of those sprites?

  • @AYB-17
    @AYB-17 4 роки тому

    hello i have a question do we need to use photoshop or we can use an other art app ?

  • @mrkickasser1566
    @mrkickasser1566 4 роки тому

    Well, it’s still more detailed than hollow knight :D

  • @tombrandis
    @tombrandis Рік тому

    I can't afford PS, what do you suggest I use instead?

  • @elton9310
    @elton9310 4 роки тому

    CAN SOMEONE HELP ME, I AM DOING SIMILAR TO THE VIDEO, BUT MY PATHS DISAPPEARED, WHY IS THAT HAPPENING? IS NOT IN THE PATH TAB ANYMORE

  • @junjielim111
    @junjielim111 3 роки тому

    Is there any other free softwares to use beside PS?

  • @firelordzuzu
    @firelordzuzu 3 роки тому

    how to u make the character walk and run?

  • @bkjvnbnjnfjrkdnvrv1809
    @bkjvnbnjnfjrkdnvrv1809 2 роки тому

    photo shop costs alot what if i dont have it

  • @siothrun1380
    @siothrun1380 3 роки тому

    Hey. Cool tutorial but for me photoshop is too expensive. Its my first game. Any alternatives?

    • @thecodeanvil5779
      @thecodeanvil5779 3 роки тому

      I would suggest using Krita, it is a free and open source digital art editor with tons of brushes and tools. You could also use Gimp, but I don't think it is as easy to pick up and go with. Hope this helps!

    • @siothrun1380
      @siothrun1380 3 роки тому

      @@thecodeanvil5779 Thx.

    • @thecodeanvil5779
      @thecodeanvil5779 3 роки тому

      @@siothrun1380 Glad I could help!

  • @kanielxu5310
    @kanielxu5310 3 роки тому

    My animation keeps moving side to side and I don’t want it to

  • @1Nurali
    @1Nurali 4 роки тому

    Thx please do videos with your ai movement pls

  • @anonymoustroll8062
    @anonymoustroll8062 4 роки тому

    Why you stop uploading videos?

  • @eyalpita9066
    @eyalpita9066 2 роки тому

    wowwww

  • @PeterMilko
    @PeterMilko 8 місяців тому

    I do a simpler method that doesn't require a sprite sheet. Come look.

  • @icey2157
    @icey2157 4 роки тому

    Any alternativ Than Photoshop?

  • @kimromero4497
    @kimromero4497 3 роки тому

    Why wont it show stroke path, only stroke subpath

    • @gamesbygrigg7447
      @gamesbygrigg7447  3 роки тому +1

      If you want to join the discord and share a screenshot, I can help you.

    • @kimromero4497
      @kimromero4497 3 роки тому

      @@gamesbygrigg7447 I'll join now, I'll be home in a couple hours. I'm making my first game ever and I'm hella excited 😁 I worked on it for three hours last night and just barely got to the first step of animation last night 😅😅😅 my character also may possibly look like a 6 year old drew him lmao

  • @jacecranberry3107
    @jacecranberry3107 4 роки тому

    Is there a way to get PS on a tablet?

  • @SAURAVVISHNUGITTE
    @SAURAVVISHNUGITTE Місяць тому

    Any othrer tool than Photoshop ?

  • @vegitoblue2187
    @vegitoblue2187 5 років тому

    Do you need a tablet to do such kind of art?

    • @gamesbygrigg7447
      @gamesbygrigg7447  5 років тому

      Nope! In fact I find it easier without.

    • @vegitoblue2187
      @vegitoblue2187 5 років тому

      @@gamesbygrigg7447 damn that was quick.
      I was thinking if I should buy something like that for 2d art. What do yo think about getting a tablet for ding 2d art in general?

    • @gamesbygrigg7447
      @gamesbygrigg7447  5 років тому

      It depends what you're drawing really. I have one but I only use it for my backgrounds.

  • @nickname5405
    @nickname5405 4 роки тому +1

    Minecraft song ohh yea