How do games render their scenes? | Bitwise

Поділитися
Вставка
  • Опубліковано 27 тра 2024
  • I'm a professional programmer who works on games, web and VR/AR applications. With my videos I like to share the wonderful world of programming with everyone!
    How do games render their scenes? We'll discuss how oldschool 8-bit games rendered their scenes and gradually move our way towards modern 3D rasterized games. You'll learn about rasterization, anti-aliasing, shadow mapping and more!
    A lot has happened the last year in my life regarding moving, a new job and health issues, which is why I have not been able to make a lot of videos, but all is fine again now and I chose to work part-time so that I can spend more time on making videos more regularly! :)
    I also created a Patreon page on which I release e.g. source code and have a tier option that includes having a personal chat with me!
    My patreon: / digidigger
    References
    OpenGL Game Rendering Tutoria; How Shadow Maps work • OpenGL Game Rendering ...
    8-bit guy • How "oldschool" graphi...
    Doom WASN'T 3D! • Doom WASN'T 3D! - Digr...
    3D Graphics: Crash Course Computer Science • 3D Graphics: Crash Cou...
    How real time computer graphics and rasterization work • How Real Time Computer...
    Doom engine wikipedia en.wikipedia.org/wiki/Doom_en...
    Doom engine techniques qzx.com/pc-gpe/doom.txt
    Doom engine source code review fabiensanglard.net/doomIphone...
    Doom wiki doomwiki.org/wiki/Doom_render...
    Rasterization in one weekend tayfunkayhan.wordpress.com/20...
    Rasterization a practial implementation www.scratchapixel.com/lessons...
    Ray casting tutorial permadi.com/1996/05/ray-casti...
    Music in in outro:
    Besus y Abrazor - Rolemusic: freemusicarchive.org/music/Ro... available under a Creative Commons Attribution license creativecommons.org/licenses/...
  • Ігри

КОМЕНТАРІ • 503

  • @unvergebeneid
    @unvergebeneid 3 роки тому +409

    0:09 to be fair, Asteroids looked a lot better back then than what's shown here. It used vector graphics instead of pixels, so this low-res capture doesn't do it justice!

    • @aXYZGaming
      @aXYZGaming 3 роки тому +15

      Truth++

    • @energeticyellow1637
      @energeticyellow1637 2 роки тому +20

      True. That game actually looks really really good on a vector monitor.

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

      It looked especially good on the horizontal twin table top set up that you could find in some cafes. CRT monitor probably smoothed out a lot and enriched the look.

    • @unvergebeneid
      @unvergebeneid 2 роки тому +6

      @@hpt08 again, the CRT didn't have to smooth out anything. It didn't have pixels but instead, the electron beam drew the shapes directly on the phosphor layer. It was basically infinite resolution!

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

      @@Noel-yh4xp I grew up playing an old hand-me-down vectrex. They use an oscilloscope as a display and doesn't use polygons or pixels. Instead it uses vector based graphics.

  • @Frostyflytrap
    @Frostyflytrap 3 роки тому +154

    Hey, props for taking such a broad topic with a long history and condensing it in into a concise overview easy for anyone to understand.

  • @Ashona
    @Ashona 3 роки тому +767

    HE’S ALIVE. THE MAN IS ALIVE. It’s 4am when I got the notification, but this video is more important than sleep

    • @DigiDigger
      @DigiDigger  3 роки тому +181

      Please go back to sleep :')

    • @Ashona
      @Ashona 3 роки тому +86

      @@DigiDigger hold up, halfway done watching the video. Learning how to Ray Cast
      Edit: well I’m done the video, see you in another 9 months!

    • @blueninja012
      @blueninja012 3 роки тому +7

      4am for me too, I got very excited when I saw the notification

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

      will wait until morning to watch though

    • @DigiDigger
      @DigiDigger  3 роки тому +28

      @@Ashona I have started to work part-time in order to make more videos so I will upload more regularly now! :) (in my description I have explained now why I have been unable to post a lot of videos)

  • @electromaniacal
    @electromaniacal 3 роки тому +64

    8:35 Cel shading comes from traditional animation. From Wikipedia: "The name comes from cels (short for celluloid), clear sheets of acetate which were painted on for use in traditional 2D animation."

    • @elecblush
      @elecblush 3 роки тому +12

      Yes, this is one of many strange assumptions and false statements in this video.
      It's a "ok" video, and a good general summary but the research is flaky, especially in terminology and several technical details, that are mentioned in various comments here.

    • @electromaniacal
      @electromaniacal 3 роки тому +2

      @@elecblush Agreed.

    • @jmalmsten
      @jmalmsten 2 роки тому +1

      As a fan of Cel animation I too was a bit bewildered by his strange use of the term.

    • @HerbaMachina
      @HerbaMachina 2 роки тому +2

      @@elecblush Cel shading is just a slightly different term in 3D graphics... It's not a false statement or anything. You're making way to big a deal about this.
      Besides you could use the same logic to justify the name for the original style of animation techniques on hand drawn 2D animation.

    • @foodank_atr817
      @foodank_atr817 2 роки тому +1

      @@HerbaMachina no. Its named so because of the shading technique's resemblance to animation cels. It's not an industry specific use of the term to refer to units in a color gradient.
      The original pixel art of 2d sprites isn't "cel shading" because while colored and animated like original 2d animation, it doesn't _resemble_ it, which is what cel shading is named for. Resembling old school animation cels.

  • @HerrFlachpfeife
    @HerrFlachpfeife 3 роки тому +37

    Cels are the transparent sheets used in traditional 2D animation. The individual pieces of 2D art are painted on cels and then multiple cels are layered on top of each other to form a single image. Cel shaders are named this way, because they emulate the look of hand drawn toons.

  • @lndozois
    @lndozois 3 роки тому +90

    Also. The “cel” from “cel shading” is not named because the quantized shades form “cells”, but is named after the cartoon shading it was meant to emulate. The shading painted, by hand, onto cellophane sheets or “cels” used in cartoon production.

  • @MDK2k
    @MDK2k 2 роки тому +47

    It's a great video, but there is some misinformation. 3D graphics cards wasn't the thing that enabled true 3D graphics. Quake was released before those and it was a true 3D game with texture maps. A lot of other games used polygons before that as well. some were fully 3D, but were flat shaded. Others were a mix of 2D backgrounds and 3D characters. The game Outcast was released a few years after the first 3D graphics cards and it didn't utilize them at all. However it was one of the most beautiful games of that time. It used Voxels for the terrain and textured polygons for the characters, buildings etc. It also had things like anti-aliasing, depth of field, bump maps, character shadows. It was game ahead of it's time. So no 3D graphics cards (or 3D accelerators if we want to be accurate) didn't enable true 3D. It just made it a lot faster.
    It's also a bit ironic that the game shown on screen is Virtua Fighter. That game had a PC release in 1995 and it didn't use 3D cards.

    • @Brickolas94700
      @Brickolas94700 Рік тому +1

      Soryy but in fact it's not "true" 3D, it's always a 2D screen in fact ^^

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

    One significant change that was omitted was when fixed function pipelines went away and we started witing our own shader code. A lot of cool graphical effects came about because of this change. I think it was around 2005 but that's just from memory.

  • @Chadderbox
    @Chadderbox 3 роки тому +43

    I love when you upload. I always learn something from these videos!

    • @DigiDigger
      @DigiDigger  3 роки тому +17

      I hope you'll at least get a bit wiser!

  • @coolbrotherf127
    @coolbrotherf127 Рік тому +1

    As a computer science student studying 3D graphics, if only it were this simple as what is in this video. There's so much to learn, so so much more.

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

    its amazing to see you posting again! your videos always get me so excited!
    the fact that doom uses a tree structure for level data/rendering is really cool!
    thanks for going into so much detail in your videos, they are always such a joy to watch~

  • @Sorry-bw6qw
    @Sorry-bw6qw 3 роки тому +30

    This channel is pure gold! Glad to see that you still upload!

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

    Your videos are a fantastic introduction to understand how game mechanics are implemented! I've been trying to understand these mechanics for years, but your videos are the first that really allowed me to understand what's going on. Thank you!

  • @evgenius123_
    @evgenius123_ 3 роки тому +80

    "It's just a bunch of triangles"
    *showing game footage, where rendering based on quads, not traiangles*

    • @izzieb
      @izzieb 3 роки тому +8

      This is the comment I was looking for.

    • @elecblush
      @elecblush 3 роки тому +11

      @Coder Husk The early sega VR games (as shown in the footage) used quads instead of triangles.

    • @KillahMate
      @KillahMate 2 роки тому +5

      @Coder Husk The game shown as illustration (Virtua Fighter) is one of the earliest 'fully' 3D games, and both in its original arcade version and its PC ports it used an unusual custom 3D accelerator chip design that was based on quads. One of those quirky things that happen when a market is new and everyone is trying everything. It's just funny that of all the 3D accelerated games, DigiDigger picked one of the few that _don't_ use triangles 🙂

  • @aweik4937
    @aweik4937 3 роки тому +6

    It’s always a party when you upload. Awesome
    stuff, keep it up!

  • @PetersKotstube
    @PetersKotstube 3 роки тому +238

    Nice to see you're back!

    • @tollertyp7230
      @tollertyp7230 3 роки тому +5

      Nice to see you here💩

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

      wtf peter, du hier?!!?!?!?

    • @peterg.8941
      @peterg.8941 2 роки тому +2

      Der Peter ist einfach beste 😉

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

      *your

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

      @@henheya9735 🅱️ruh

  • @elecblush
    @elecblush 3 роки тому +48

    09:20 - Missed opportunity talk about baked vs real time rendered shadows. Two really important phases in the history of game rendering.
    Baked shadows where shadow maps applied to the textures beforehand, to avoid having to do this in real time.
    Would have loved to see more info on shaders, and some of the more advanced renderpasses we see in modern games as well (some of the techniques that have progressed graphics from the N64 age of graphics to the graphics we see today)
    The video is an ok sweep through a few rendering methods and concepts, but you are missing some important milestones and you deep dive into things a bit randomly. It would have been better if you made a firm commitment to either go deep on the technical structure in each of the parts, or made it more of a history sweep with links to other deep dives. Also as you see from the comments have quite a few details and terminology wrong.
    Please don't take my criticism the wrong way. I liked the video, but felt there was room for improvement, especially since the idea of doing such a video (a history of rendering techniques) is great.

  • @aiarch
    @aiarch 2 роки тому +1

    you make all these difficult details look so easy to understand 👍

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

    The explanation is so technically elegant and concise. I had to sub immediately. Well done!

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

    Very good video! You provided a great overview of the different aspects of realtime rendering in a digestible format.

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

    Hope this series continues.. It is really insightful

  • @djessy5001
    @djessy5001 3 роки тому +2

    I don't understand how you can have so little subscribers with the quality of your explanations, I'm sharing 🙏

  • @EvanOfTheDarkness
    @EvanOfTheDarkness 3 роки тому +31

    No. Confusingly enough "8-bit art style" refers to the "8-bit systems" art style, mainly the NES, that had 16 colors, and could only use 4 of them in each 16x16 tile. Meanwhile the "16-bit art style" is *actually* 8-bit because the "16-bit systems" like the SNES could usually display 256 different colors (or close to) on the screen.

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

    This video is mind-blowingly good. I'm a very visual learner so I heavily appreciate all the visual examples and diagrams

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

    This video is gold. This will remain in our heart forever

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

    Thank you so so much for sharing your knowledge and research in a way that everyone can understand! It would be great to have another video of Game Plunge.

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

    Yooooooooo, you're alive! So glad you uploaded :D
    The video is amazing, as expected :)

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

    You explained this very well. I knew nothing about this and now I feel like I understand the basics!

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

    Just new to your channel but really loving the informational videos. Took me only a few seconds to subscribe and like because I could already tell it was quality content. Keep up the good work!

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

    Even though I already know this stuff, I still love watching this kind of videos!

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

    excellent video, gave me a lot of insights into how the game industry have developed over the years. props to you.

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

    Thanks for still trying to explore new topics and making deep and informative content ! I guess it requires a lot of work, and it seems motivation isnt always here (well maybe its is again). Don't give up on this, there is a lot of ppl who would enjoy your content ! Don't focus on the numbers or how it spreads, but the quality of what you create ! It will always bring you positive feedback, from the community but also from yourself ! Great video btw, always simple enough for ppl to understand it, but with enough deep for us to crave for more !

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

    Love this video. So good and easy explanation of such complex topic.

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

    i knew most of this but still enjoyed watching this. subbed!

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

    Yay! So glad this series is still going!

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

    A really amazing and informative video! Thanks a lot man!

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

    I noticed that you are not a frequent video uploader. I just want to tell you that what you sharing is pure gold. Looking for more of your quality videos.

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

      yup, his example is based on quake/half-life/source engine BSP

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

    This is a fantastic video. Thanks so much for uploading and sharing your knowledge.

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

    Thank you very much for the detailed vid. I suck at graphics programming, but understanding the system and theory has really helped me

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

    Love the video! Thanks for uploading again

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

    Fantastic overview! Definitely subscribing :)

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

    thanks man, these videos are very educational and insightful

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

    i absolutely loved it ! thanks for making this video 😁😁

  • @3DSage
    @3DSage 2 роки тому

    So beautifully explained! :)

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

    Thank you for this concise yet helpful video regarding rendering in general. I feel like a render expert now 😂

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

    one of the best things of texturing coulb be parameter materials, man. You can make SO MUCH with shading through dynamic textures is mind boggling.

  • @ChozoSR388
    @ChozoSR388 3 роки тому +22

    The Sega Saturn game you showed while explaining triangles actually used quads, not triangles.

  • @bouncycow3010
    @bouncycow3010 3 роки тому +13

    LADS! HES BACK! The legend has returned to reunite us for a few precious minutes, but will soon return to the void again for an indefinite amount of time.

  • @guts-7210
    @guts-7210 2 роки тому

    Hey this is a really good and well put together video

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

    Incredibly good video, thanks!

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

    This is the type of channel we live to subscribe to

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

    This taught me a lot, thank you! :)

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

    Damn such a good informative video, totally love it

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

    OMG!!! Finally! Love your vids.

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

    cool to se the evolution. Thanks to share it!

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

    This video got me subscribed. Love your style. I learned a lot with this video. Been gaming since 1986 :)

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

    I like these explained in basics educational materials.

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

    Very good and informative video!

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

    Love the content! Excited for more vids!

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

    That's was cool story, very informative and easy to understand.

  • @al-han3804
    @al-han3804 2 роки тому

    Never noticed that data structure and tree data sorting would be this useful! Glad i learned them in college

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

    Amazing vid! YT recommendations are Goldmines most times 🎉 Subbed and will be waiting for ray tracing video

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

    Dude I just remembered this channel and wanted more videos like the terraria and portal one and decided to look up the video again. Low and behold there was another video like those.

  • @ScorgeRudess
    @ScorgeRudess 3 роки тому +7

    OMG, long time no see, this channel is pure gold, I wish to patreon you in order for you to create more content... it is extremely good

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

    very informative, didn't know alot of terms and meani ngs

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

    love your explanations!

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

    i learned something new and that is fascinating as i want to be a game programmer. It's really need hard work and patience to create different parts of a game.

  • @user-sd4qd3lp9h
    @user-sd4qd3lp9h 3 роки тому +1

    Great video, very inspiring, thanks!

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

    One of the best video in the world of gaming history

  • @Niv54niv
    @Niv54niv 2 роки тому +1

    Awesome video! Waiting for the next one on Ray Tracing!

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

    Really cool, as a 3D artist those knowledge are essential

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

    You made me understand shading and cel shading in less than 2 minutes lmao, thanks

  • @user-kw7xk5hj4f
    @user-kw7xk5hj4f 2 роки тому

    Respect the game developers 🙏 bringing more and more realistic environments to explore. Thank you.

  • @user-xe2mn5jl3p
    @user-xe2mn5jl3p 2 роки тому

    Perfect job!Wait video about v/g history!

  • @not_j.
    @not_j. 2 роки тому

    Quality Content! Just SUBSCRIBED!

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

    There is a few errors i the video. Most notable... 8 bit era didnt have 8 bit grapics. It had only 2 bit grapics partitioned into sprites out of a pallet of usualy 16, some Times 32 colors.
    Even the 16 bit era mostly didnt have 8 bit grapics, but mostly 4 bit grapics put of a pallet of typically 16.
    Its also worth saying that most older consoles and also some computers in that era did have a 2d grapics chip that was driving the grapics. There was in most cases no cpu involvment in showing the grapics..
    It was really mostly PC that lacked that ability... sort of. Pc the cpu renderad pixel by pixel. This pushed pc cpu to have more preformance partly to offset this disadvantage. This was why 3d exploded on pc.

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

    I'll have to watch this more than once.

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

    I took a timeout from studies and here I am studying about data structures and computer graphics.Life's got a sense of humor.

  • @mrbigsmile3902
    @mrbigsmile3902 2 роки тому +27

    Some feedback: there is a static background noise. You sound like being in a huge room with echo (google fixes, but recording in a closet is a funny and partially crazy solution I heard). A lot of snappy sounds that can be fixed with a shield thingy (no clue what it is in english).
    Interesting video still! But sadly not something I like having on in the background.

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

      im a sound designer, if i where him id get some acoustic panels to isolate his room

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

      @@TheIndieGamesNL anything he can do to reduce the static? Also asking for myself

  • @lester2dev
    @lester2dev 3 роки тому +27

    Binary Space Partitioning is not even close to what you've shown in the video. It's about compressing surfaces into a binary tree depending on their intersections, thus saving only equation parameters of the surface equation instead of actual vertex positions. What you show is more similar to an octree partitioning, but in 2d.

    • @MrDavibu
      @MrDavibu 2 роки тому +1

      I was so confused by that part. I really thought I remembered BSPs wrongly.
      But I think it's called quadtree in 2D.

    • @lester2dev
      @lester2dev 2 роки тому +2

      @@MrDavibu it's fine, since I remember it not that correct as well. To be more precise it's the way planes are sorted depending on what side they are in relation to the normal of the chosen plane. That's why it's called "space partitioning".

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

    I recently enrolled in a cs course, able to understand your video well.. Nice content..

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

    this is awesome, am enjoying this video

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

    Thanks for the epic content.
    I will enjoy this.

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

    That introduction really made me laugh!

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

    Congrats on the algorithmic success!!!

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

    Finally you are back.
    Yes, Graphics are very important. Visuals are the top 3 most important thing in the games.
    You should see Game-jam submissions. The graphics they make is something else in so less time.

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

    Very nice summary!

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

    Learned a lot and entertaining 💯

  • @bbqgiraffe3766
    @bbqgiraffe3766 3 роки тому +14

    I like this video but watching it as someone who's made 2D game engines is painful, most older games used palletted graphics, where a sprite would have 1 byte per pixel which would be an index on a table of colors(usually 3 byte), sprites would also have a palette index which would point to which palette to use, some early polygonal engines like Quake also used this but it stopped being used that much in the mid-late 90's

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

      This is how I programmed all my own crappy games. The best of this technique was the ability to set the whole palette by calling an interrupt. You did not have to change the pixels to get animation. If used in clever ways you could change the palette and make for fast changes.
      I used this mostly to get lightning effects or even to control 7 segment displays on screen. I loved that era. It was easy to work with.

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

    Thanks for valuable information Sir...

  • @green-retina
    @green-retina 3 роки тому +1

    Really love your channel!

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

    This was quite a pleasant surprise

  • @ifstatementifstatement2704
    @ifstatementifstatement2704 3 роки тому +6

    Raycasting was such a great hack!

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

    2:20 Ah yes, my childhood. Legend of Zelda : Link to the past. Thanks for reminding it!

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

    Your videos are amazing.

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

    Now. this type of content what I am looking for.

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

    Glad to see you back :D

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

    Great vid man keep it up!

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

    looking forward for your next video

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

    When I was a kid I always wanted to be a Game Developer. Thank God I didn't went that path. I can't wrap my head around even this information. Respect for those developers and whoever work behind a game to make it so good.