The Perfect Pixel Art Parallax Tutorial [and Unity script!]

แชร์
ฝัง
  • เผยแพร่เมื่อ 2 พ.ย. 2024

ความคิดเห็น • 216

  • @nobodyinparticular80
    @nobodyinparticular80 3 ปีที่แล้ว +174

    Dude, your tutorials are the best thing I’ve seen on game development. I’ve learned so much from just this one video. Thank you so much for giving this away for free. It is top notch quality instructional videos.

  • @derciter223
    @derciter223 ปีที่แล้ว +18

    I'm 12 y.o. kid form Russia. I can say with confidence that there are good videos from Russian-language channels on the topic of parallax background does not exist from the word at all, and your video helped a lot.

  • @tylerheenan9393
    @tylerheenan9393 2 ปีที่แล้ว +14

    Perfect! To add to this, you can set repeatable textures in the inspector/game hierarchy. Meshtype - > Full Rect, Wrap mode - > Repeat + Sprite Renderer Tile Mode -> Continuous, Draw Mode - > Tiled, Size - > x/y.
    Some tutorials do spawning for repeatable which might be necessary depending on your game but for me wrap mode was fine.

  • @ThePixelExpedition
    @ThePixelExpedition 3 ปีที่แล้ว +61

    Yes! I was really hoping you'd make a tutorial on this! I absolutely love parallax in games! :)

  • @polter5195
    @polter5195 3 ปีที่แล้ว +21

    Your videos have helped me improve more than any other resource I've come across. Thank you!

  • @pauliusgruodis137
    @pauliusgruodis137 3 ปีที่แล้ว +16

    I upvote your videos before even watching because I know you won't fail to deliver. This kind of quality content deserves more views.

  • @doiroco98
    @doiroco98 3 ปีที่แล้ว +93

    Nice to see my name throught the entire video... Great vid as always!!

  • @BeingFriends
    @BeingFriends 3 ปีที่แล้ว +17

    Parallax is literally one of my favorite visual phenomenons )yes I give it that much praise)! And in games it does such an incredible job making a flat world feel alive! Loving these longer form videos!

  • @erengazioglu
    @erengazioglu 3 ปีที่แล้ว +7

    Beautiful video, I especially like it when you explain not only the look of things but also the natural logic behind the system itself. Thanks as always for great content!

  • @alexanderoneill3018
    @alexanderoneill3018 ปีที่แล้ว +3

    Hey! I made some pretty simple pixel art, broke it up into 5 layers on Krita, and got an awesome parallax effect for a project in my Unity class!
    Great video, appreciate your work!

  • @Hiroki_MakeGames
    @Hiroki_MakeGames 8 หลายเดือนก่อน

    Hey Adam, what a great tutorial. The explanation of how it works and how you got all the values it's amazing . We are not just simple copying and pasting , we are learning how this works under the hood . Thanks a lot!

  • @stefan429
    @stefan429 3 ปีที่แล้ว +9

    i really enjoy the indepth scientific/mathematical explanation at the beginning :)

  • @wirs6206
    @wirs6206 2 ปีที่แล้ว +2

    One of the things that made me into pixel arts is your videos. It's really incredible how you made these videos for us. I hope one day i can give you my improvement by watching your videos. Much much thanks!

  • @giratina008MagicRush
    @giratina008MagicRush 3 ปีที่แล้ว +5

    Thank you so much for explaining the theory behind the parallax values and how to implement them efficiently without hard coding numbers till its right.

  • @MrPiggybank1974
    @MrPiggybank1974 3 ปีที่แล้ว +2

    I normally don’t make comments on youtube, but in this instance I hard too, I love the work that you do, been a programmer, and getting paid to do so, I’ve always found drawing difficult as my brain does not think the way an artist does, an artist can be a programmer but not the other way around, now in my middle+ 40’s “birthday today” and looking for an artist to work with over 25+ years in the UK.I have released games but I find myself finally having a go at drawing, not good but trying, you are a young Bob Ross, I love the long tuts that explain why and how, as I’ve not gone to art class.

    • @PDF4711
      @PDF4711 3 ปีที่แล้ว

      Hey Jason,
      actually I would venture that it is more about practice ... If you spend as much time practicing art as you probably did programming... my bet would be that you could create a thing or two 😉 I'm also a programmer by nature but try to get a grasp of artwork and yes it is a struggle when you're not used to it.
      I once had a collegaue mention that if he had spend the gaming time on learning russian instead... he'd probably be fluent by now 😊
      Oh and happy birthday 😊

  • @Distortion3933
    @Distortion3933 3 ปีที่แล้ว +2

    I love this video. I already knew how to do horizontal parallax, but still learned something thanks to the depth you went into. Never knew what the clipping plane did, and didn't know about calculating the camera size based off PPU. Thanks man.

  • @franklinlx2
    @franklinlx2 3 ปีที่แล้ว

    Respect... You're eloquent and knowledgeable, with the right mix of charisma and modesty. I can see the quality in everything you do.

  • @LordMobias
    @LordMobias 3 ปีที่แล้ว +5

    Oh you did a tutorial on background Parallax, thanks so much Adam I was really looking forward to this :D

  • @rhysstephens5019
    @rhysstephens5019 3 ปีที่แล้ว

    for someone currently studying game dev at university these videos are a game changer

    •  2 หลายเดือนก่อน

      badum tss

  • @dirtywhitellama
    @dirtywhitellama 3 ปีที่แล้ว

    Your enthusiasm and enjoyment of the process is so fun to watch :D

  • @marlonc7668
    @marlonc7668 3 ปีที่แล้ว

    every time i see a new thumbnail i open it in another tab. every video seems like there's gonna be some valuable info in it!

  • @92explorer74
    @92explorer74 3 ปีที่แล้ว

    I’m new to pixel art and all your videos are so fun and easy to understand 😭 I could also listen to your voice for hours 😭

  • @Wesz808
    @Wesz808 3 ปีที่แล้ว

    Just stumbled on your channel and already followed the first couple of videos. Just want to say that this is some quality stuff. I followed some courses but they don't add much more than "how to make a tree", no theoretical background that give you some true understanding. Thanks for this. Will become a Patron for sure.

  • @Hersatz
    @Hersatz 3 ปีที่แล้ว +16

    That's a nice tutorial, but I've been wondering about something:
    Wouldn't it be far less complex and computing hungry to do a layer based parallax effect?
    Is there any reason why one would choose to use the distance of an orthographic camera instead of layers?

  • @LassiY
    @LassiY 3 ปีที่แล้ว

    Thank you so much! i have been searching tutorial like this 2 weeks for now + its well done and easy to understand! You earned my sub m8

  • @chrislaguna8390
    @chrislaguna8390 10 หลายเดือนก่อน

    Thanks for the great video! I wanted to highlight a subtle issue I had with the script when making my own version in Unity. It may only be an issue depending on how the camera works in your game engine.
    For me, any time my player moved, the parallax background positions were one frame behind. Not a huge problem, but when the player started or stopped movement, the background movement was a bit delayed/jittery looking and it wasn't great especially if you spam the player to move quickly left and right.
    The reason for this was that my camera position only got updated in LateUpdate() (which seems to be the right time, after everything else is done), so every time the camera position was referenced in the parallax script (seems like properties get updated during Update() time), such as calculating the current travel, the camera position was one frame behind.
    I got around this by using the player position as the reference for where to move the parallax backgrounds instead of using the camera position as the reference, and in the parallax script, doing all calculations from LateUpdate() to ensure that the player position for the current frame was updated before the parallax script referenced them. My player uses physics so all those updates were happening in FixedUpdate(), but I set the rigidbody to interpolate mode so that the character position gets updated every Update() frame.
    Not sure it's the right solution all the time, but when doing anything with the current frame and accessing fields across different game objects/scripts, make sure to be careful about the timing of things, it doesn't seem easy to specify that one script should run before another one for each frame.

  • @sebkolind
    @sebkolind 2 ปีที่แล้ว

    You make it look so simple and easy to create the art… then I tried myself. It’s hard! Love the video..

  • @arrowsdev
    @arrowsdev 2 ปีที่แล้ว

    i can say without any doubt you are the best pixel artist out there indeed

  • @yoshizaki5083
    @yoshizaki5083 2 ปีที่แล้ว

    the best tutorial ever!! thanks dude, Brazil here!!

  • @Metacious
    @Metacious 3 ปีที่แล้ว +1

    I love how you explain the concepts. Subbed.

  • @jakefagan2564
    @jakefagan2564 ปีที่แล้ว

    I love your videos. The energy, the music, the palette...an easy subscribe!

  • @Ricardordz11
    @Ricardordz11 3 ปีที่แล้ว

    Dude you're amazing, thanks for the video, watched it all the way through, I loved the way you explained step by step sparing no detail, thank you soo much

  • @quentincomacle
    @quentincomacle 3 ปีที่แล้ว

    I dont really need that at the moment but i just couldnt stop watching.
    I clicked because i was surprised. isnt it a bit too long for just explaining parallax ?
    well it could have been shorter sure but the way you took tout time and didn t rush the explanations is what kept me curious the whole time.
    That and the fact it was fascinating to see the whole thing grow more beautiful second after second

  • @MrOfearos
    @MrOfearos 3 ปีที่แล้ว +2

    Amazing content! Definitely like the new video style!! keep it up

  • @jeksim
    @jeksim 3 ปีที่แล้ว

    Great explanations, by far the best tutorial on unity I've seen so far!!!!!

  • @tomm7243
    @tomm7243 2 ปีที่แล้ว +1

    The Bob Ross of pixel art ❤

  • @nandanvinjamury
    @nandanvinjamury 3 ปีที่แล้ว +7

    Was hoping for a background tutorial and you did one better

  • @bladesofdestiny
    @bladesofdestiny 2 ปีที่แล้ว

    your channel is priceless and your game looks amazing! props from a fellow game designer!

  • @gamenrage5998
    @gamenrage5998 2 ปีที่แล้ว

    THIS IS JUST BASIC KNOWLEDGE seen in a viewpoint.

  • @fathead827
    @fathead827 2 ปีที่แล้ว

    i loved this tatorial. Its so detailed step by clear thought process. Thanks you so much

  • @OlivierFourniol
    @OlivierFourniol 3 ปีที่แล้ว +1

    This is so interesting ! Well done

  • @anaibrahim4361
    @anaibrahim4361 3 ปีที่แล้ว

    really reaaaaaaaaaaaly deserve the subs and the likes
    piece of art

  • @Meruem_Mondiale
    @Meruem_Mondiale 6 หลายเดือนก่อน +1

    How do you make the colors not overlap when using the pencil? They just go right behind the mountain.

  • @colbykuzontkoski3872
    @colbykuzontkoski3872 3 ปีที่แล้ว

    Thank you for this! Love the script!

  • @LHInstrumentals
    @LHInstrumentals 3 ปีที่แล้ว

    Your pixel art is VERY good

  • @GlassChewer
    @GlassChewer 3 ปีที่แล้ว

    Very cool, Adam!

  • @miguelarriola8623
    @miguelarriola8623 3 ปีที่แล้ว

    I'm loving this thank you!

  • @BennysRadio
    @BennysRadio 3 ปีที่แล้ว

    Saw that on Reddit and it got really good!

  • @terry-
    @terry- ปีที่แล้ว

    Great! In 46:50, line 18, it seems that could result in a division by 0 and an error, as you had setup the near clipping plane of the camera to 0. Good one, more like this!

  • @BacklogDrifter
    @BacklogDrifter ปีที่แล้ว +1

    Great video! Wish it was easier for me to learn C#. It's the only thing holding me back!

  • @andrzejkulakowski
    @andrzejkulakowski 3 ปีที่แล้ว

    Incredible! One can tell when there is love at work :)

  • @AregGhazaryan
    @AregGhazaryan 9 หลายเดือนก่อน

    thank you Adam, very cool

  • @lpeabody
    @lpeabody 3 ปีที่แล้ว

    You are the Bob Ross of pixel art.

  • @brandonjacksoon
    @brandonjacksoon 3 ปีที่แล้ว +1

    Cool tutorial! Thank you!

  • @josiahmanson
    @josiahmanson 3 ปีที่แล้ว +2

    The math and geometric description of how parallax works is incorrect, and I hope I can clarify how it works. Parallax comes from the way objects are projected onto the camera. The x,y coordinates are divided by the distance z from the camera. If you move the camera one meter to the right, then a distant mountain might be 10km away, so will appear to move right by 1/10000 units. This is why distant objects appear stationary. An object 1m away will appear to move right by 1/1 = 1 unit. Where your description breaks down is that the upper limit for how fast close objects move is much faster than you say. An object 1cm away will appear to move at 1/0.01 = 100 units. Consider: how far would a fly crawling on the camera lens have to move to cross the entire frame? As you approach 0 distance, objects will appear to move infinitely fast past the camera. Note that in computer graphics, cameras don't have a physical size and are a single point.

  • @bsvolleyball1
    @bsvolleyball1 3 ปีที่แล้ว

    Awesome as always! You are my new Bob Ross

  • @elHosed
    @elHosed 3 ปีที่แล้ว +1

    Just played Remember Apollo. You're evil man. I thought it would just be a fun little jaunt to see how Arrowbound started, but NOOOO, you just had to go there... ;)

  • @niri8092
    @niri8092 3 ปีที่แล้ว

    I actually used something kind of similar to what you did as a trick for the snow on the trees, when I did a rusty sword I took all the normal metal colors, my rust colors and arranged them in the shading ink so I can just paint over something and it becomes rusty, would also work with this of course!

  • @gamenrage5998
    @gamenrage5998 2 ปีที่แล้ว

    To easy understand layers is simple an object done in line stages as the go back with less and less detail.

  • @lhi5812
    @lhi5812 3 ปีที่แล้ว

    Very useful video in all parts.

  • @rsfan24
    @rsfan24 ปีที่แล้ว

    I ended up buying the asset cause I was actually understanding your programming method, need infinite scrolling for a project I'm working on, but have absolutely no idea how to do it, and while there are a bunch of tutorials available on doing so, their methods just don't mix with yours, and it's either I use yours entirely, or I don't use it at all. I would love to see a proper tutorial on the infinite scrolling at some point, just to understand the method better in your own words. Otherwise, I guess I just wish it was better commented for the same reason? ADHD sucks sometimes, lads ;v;

  • @matiasaranda1529
    @matiasaranda1529 3 ปีที่แล้ว +1

    have to say it your voice make me feel safe...

  • @JonToons0208
    @JonToons0208 2 ปีที่แล้ว

    Cool gaming animation bro. And you have a new subscriber here!

  • @jesterlw
    @jesterlw หลายเดือนก่อน

    Amazing informative video!!

  • @Temus_
    @Temus_ 3 ปีที่แล้ว +1

    I think more I will wait that more tutorials you will create and better my game will be :D

  • @gamenrage5998
    @gamenrage5998 2 ปีที่แล้ว +1

    the art side of the video is more interesting than the unity use of it due to the multiple tools used to set it all up just get me confused so i going to stick with animation without unity maybe find out about movie type set up off my iPad pro in layers to what works best for me.

  • @chilly1g
    @chilly1g ปีที่แล้ว

    Awesome tutorial, I'm just dissapointed that I came all the way through 49 minutes without looping effect in the end

  • @NickNeutron
    @NickNeutron 2 ปีที่แล้ว

    Digital Bob Ross right there ;-) good job m8, and thx for sharing

  • @jessemccarthy1893
    @jessemccarthy1893 3 ปีที่แล้ว

    Your like to dislike ratio, at the time of the writing, is infinite!! which is pretty darn good in my opinion haha. I also think its well deserved!
    EDIT: I guess its actually undefined... But infinite sounds better

  • @gamenrage5998
    @gamenrage5998 2 ปีที่แล้ว

    excellent video dude thanks

  • @boonboy8333
    @boonboy8333 3 ปีที่แล้ว

    The layer right at the back must scroll notably, otherwise it looks like some desktop wallpaper that found it's way into your game.

  • @KyoTotalRock
    @KyoTotalRock 9 หลายเดือนก่อน

    Thanks for the tutorial! Really good stuff. I was wondering how you change only one color using your brush, while ignoring others, preserving the object's shape (e.g. 23:42).

  • @fabiojeromec
    @fabiojeromec 3 ปีที่แล้ว

    Is is simpler to just scroll the uvs. And set your texture wrap mode to repeat. Then as you camera move you just scroll the uv relative to whatever speed you want.

  • @waiyinli2712
    @waiyinli2712 3 ปีที่แล้ว

    Excellent video!!! Thank you!

  • @kazcrash246
    @kazcrash246 3 ปีที่แล้ว

    thanks for this you were amazing man

  • @Aspect8_5_2
    @Aspect8_5_2 3 ปีที่แล้ว

    This . Is. Amazing. You did it so fast that looked so easy...
    Im looking for an animation like this but woth city scape background and alternating backgrounds.

  • @rintohsakadota
    @rintohsakadota 3 ปีที่แล้ว +2

    Hi, ur tutorial is extremely useful especially for newbie like me (im from different background than computer science and art design). While following ur tutorial, i found a problem which is what if the subject jump? In that case, should we make the height of the background higher than the camera screen and high enough with the highest terrain?

  • @xpert9001
    @xpert9001 3 ปีที่แล้ว

    oh cool a new video!

  • @zeto_on_drugs6561
    @zeto_on_drugs6561 3 ปีที่แล้ว +1

    I want to make an GIF of a character walking in a forest with this kind of background, how can i do it?

  • @iskhwa
    @iskhwa 2 ปีที่แล้ว

    Great video! Thanks for it

  • @unifores
    @unifores 2 ปีที่แล้ว

    Thank you!

  • @gielheldens4095
    @gielheldens4095 ปีที่แล้ว +1

    Hi Adam, and others, I have a question. Some time ago I made a simple game with a scrolling background and in front my character was swinging from a rope. I had the character's sprite rotate while swinging such that its head was always pointing towards the rotation Pivot. Only when I added the background, the game was getting jittery. Then when I added pixel perfect camera my character Rotations were getting weird (I think because the pixels were snapping). Any tips on how to solve this? thank you!
    PS. Terraria has scrolling backgrounds, and on attack animations the arm+weapon simply rotate, so I know its possible somehow.

  • @griseus8879
    @griseus8879 3 ปีที่แล้ว +3

    I hope you know you're awesome

  • @Deimophobos
    @Deimophobos 3 ปีที่แล้ว +1

    how did you do to paint these specific parts of the mountain with highlights without invading the darker outline? look like you do it in diferent layers but you paint in the same one

  • @hannibalyin8853
    @hannibalyin8853 3 ปีที่แล้ว

    very nice technique you've got! I'm just hoping maybe you could do a top-down view pixel art sometimes! that'll be fantastic!

  • @MateuszTurbanski
    @MateuszTurbanski ปีที่แล้ว

    I have only one question. What should I do, when I want my player to jump? The background will not be cutted perfectly to the sceene when camera follows player horizontaly too.

  • @m1quta992
    @m1quta992 3 ปีที่แล้ว +2

    this tut is so good but i have 1 problem so on cinemachine 2D camera parralax background sprites is jittering when player is moving how can i fix this ? pls help

    • @mairinger80
      @mairinger80 2 ปีที่แล้ว +1

      Same issue here - didn't find any solution so far...

    • @anishkchhamalwan1471
      @anishkchhamalwan1471 6 หลายเดือนก่อน +1

      Putting the parallax code in FixedUpdate solved it.

  • @Admeuses
    @Admeuses 3 ปีที่แล้ว +1

    This is very cool. What software is that?

  • @NegaNova
    @NegaNova 2 ปีที่แล้ว +1

    As someone who has never done coding, I would love to see a tutorial video on the coding while going a bit slower and explaining the values and what they mean more. In this case, I'm just trying to make a parallax scene according to your tutorial and the beach one as well - but getting to the coding part, it's easy to follow along, but trying to make sense of everything is a bit difficult. Like understanding what Void means, or even understanding what public references are, like when we type public Camera cam; - are we making the program understand that the Camera function in Unity will now be called cam in the script? As the tutorial continues, things like, "Mathf.Abs(distanceFromSubject) / clippingPlane;" go way over my head haha, or how it's explained at the end that we don't want the z-axis of the transform to be continuously reset so we indicate code to make that not happen, but like why would the z-axis be continuously reset?
    Also, because of the way the video is edited, you don't see Adam type a ";" at the end of line 16, incase anyone is confused why their code won't work during the final stretch.
    If anyone knows good 2D Unity coding tutorials for beginners to learn how to code, I'd appreciate anything!

    • @coachmcguirk8277
      @coachmcguirk8277 ปีที่แล้ว

      This tutorial is not really intended for those who lack basic knowledge of C#/Unity, and I don't mean that in an offensive way, we all need to start somewhere. It's just that it's somewhat unreasonable to expect such information in a video like this, some basic knowledge is going to be expected when explaining something that's not really basic. Think of this as like Chapter 4 in the Unity handbook and you've skipped over Chapters 1-3!
      With that in mind, you'd be better off googling "C#" and reading the documentation to learn about things like Void, or "C# void" for example if you want a more specific and quicker answer. For things that Unity provides such as the Camera class and creating draggable public references in the Inspector, you'll need basic knowledge of both C# and Unity. It took me a good while to get the hang of it and I'm still not great, but I can say with confidence that your questions will quickly become common knowledge that you can then apply to ANY tutorial video that you watch.

  • @GeneralBenj
    @GeneralBenj 3 ปีที่แล้ว

    I followed perfectly, but all my backgrounds seem to move together and looks like 1 background when im playing

  • @Lugnut7
    @Lugnut7 ปีที่แล้ว

    Great vid! The only issue I have with my Parallax is the camera moving on the Y Axis. (I'm very new to coding). When my player jumps the camera moves up too, and I would like it to follow the player only on the X axis. It's probably a simple fix but I'm currently at a loss.

  • @michaelklassen2296
    @michaelklassen2296 3 ปีที่แล้ว

    I love this so much! You are an inspiration to an aspiring game developer. Just a quick question - what kind of tablet do you use?

    • @AdamCYounis
      @AdamCYounis  3 ปีที่แล้ว +2

      I use a Wacom Intuos Pro (2013). If you're looking for something entry-level, I recommend checking out Huion tablets, since they're reasonably priced and offer a similar experience.

    • @michaelklassen2296
      @michaelklassen2296 3 ปีที่แล้ว

      @@AdamCYounis Oh wow! You replied quickly. Thank you for the recommendations.

  • @gamenrage5998
    @gamenrage5998 2 ปีที่แล้ว

    I get the speed thing though it is due to size of object it should stay in the frame a lot longer compared to the front objects

  • @hagarnahari7505
    @hagarnahari7505 3 ปีที่แล้ว +1

    What should I do if my character also goes up and down ? Thank you for the video by the way, it's really helpful

  • @ShiroNeko277
    @ShiroNeko277 2 ปีที่แล้ว

    Ayo im learning

  • @_Garm_
    @_Garm_ 3 ปีที่แล้ว +2

    Lets paint some Happy trees! :D

  • @gregghome3339
    @gregghome3339 3 ปีที่แล้ว

    Is there any way to account for the camera zooming in and out? I've been trying to figure it out for a year. The issue is the camera zooms but the parallax bg scrolls back to its original point. The further you are from the original point, the faster and further everything scrolls to adjust. Any ideas?

  • @Aelux5216
    @Aelux5216 ปีที่แล้ว

    Firstly as always, it was a very detailed and easy to follow tutorial but despite that for some reason my furthest away image follows me just fine but the closer ones get left behind when descending, I know you only covered horizontal but I wondered if you might know why this is? (all the background layers have the script with the player and camera values set)

  • @Rivaldix12
    @Rivaldix12 6 หลายเดือนก่อน

    When i move my character the main camera does not follow the player help please :(

  • @فايعالعبدلي
    @فايعالعبدلي 3 ปีที่แล้ว

    أنت موهوب .. ما شاء الله .. إعجاب بالمقطع 👍