ฝัง
- เผยแพร่เมื่อ 24 ก.ค. 2024
- Hey folks! It's been a while, and I'm back with a pretty different type of video that my previous ones! In the video, I talk about my journey to create a simple 2D renderer, from a first-person perspective. It's a pretty unintuitive concept to understand in the first place, much less actually implement in code, but I'm very proud of the result I ended up with! I also spent a lot of time and effort working on the video itself, visualizations and all, so I really hope you enjoy it. I really do think this is my best video yet.
I was also very inspired by @SebastianLague & @CodeParade in making this video, so if you enjoyed it, be sure to check out their channels as well.
Source code for this project - github.com/NivMiz0/Flatland-E...
Support me on Patreon - / nivmizgames
Join my Discord - / discord
Buy my commercial game, SINGULARIUM - store.steampowered.com/app/26...
Play my small games: nivmizzer.itch.io/
Video was made with Motion Canvas - motioncanvas.io/
Chapters:
0:00 - Intro
0:37 - What Does First Person Even Mean In 2D?
2:14 - Ray Marching & SDFs
5:21 - Different Shapes & Fog
7:17 - Fixing Our Performance Issues
9:29 - Fixing the Strange Flickering
11:14 - 3D Illusion
11:59 - Adding Gameplay
12:23 - Outro
#GameDev #codingadventure #maths #unity #indiegamedev #devlog - วิทยาศาสตร์และเทคโนโลยี
Nice work! :)
Thank you very much Sebastian! I'm a huge fan of your videos!
I took a lot of inspiration from your own raymarching code for this project, it was a big help in getting everything to work properly haha
- first person 2d game
- look inside
- wolfenstein 3d
This game is still 2d tho
@RenderingUser
Wolfenstein 3d is also technically 2d, the difference to this is the height of each screen column is dependent on distance from the player
@@TheJas-vr2vrSo just like Doom it’s 2.5D because it uses some 3D aspects but it has some 2D parts as well
@@4Kslimythis is very uninformed way of looking at this. There's no such thing as half a dimension. Wolfenstein 3D is actually a 2D game with a 3D renderer. DOOM is actually a 3D game, as the game logic actually accounts for all three dimensions. The 3D renderer is rather limited, hence the simple level geometry and objects rendered as sprites. But objects actually do move in 3D space, i.e., movement up and down is possible and accounted for. This is not the case in Wolf3D, where the game all takes place in two dimensions and then projects a 3D image to the screen.
@@4KslimyThis is closer to Wolf3D, but if Wolf3D only ever printed one pixel (or a single coloured vertical line) for each horizontal position on-screen.
Holy hell man the editing on this is crazy. The entire video is really high quality, and overall it’s great. Everything is explained well, edited well and it’s awesome. Props to you.
Thanks so much! It took like 10x longer than my other videos to make, glad it seems it was worth it!
@@nivmiz0 What is your strategy?
We had to read Flatland in high school. I had very low expectations: 1: it's old 👵 (1884), and 2: it's a math book 🥱. Turns out it reads in a surprisingly modern way, and is written in an engaging "storytime" sort of way. I recommend checking it out if any of that seems remotely interesting.
I absolutely fell in love with it! Cool to hear you did too (:
I honestly loved it! Honestly, I wish I had to do an assignment on it because, asides from mathematics, there's so many themes!
How people automatically distrust anything they don't understand, how one can start to think about complex situations, how people also seem to dismiss theoretical possibilities just because they haven't yet viewed it.
this editing is phenomenal!
gives me 2 hour youtube documentary about something you have no idea about vibes.
Lmao, that's basically how it felt making it. Massive deep dive into a SUPER niche subject
How to make 1D game
Step 1: take one row of pixels from a 3D game
Step 2: stretch the row of pixels to be visible
Step 3: add fog
You have now made a 1d game!
that's pretty much exactly what i thought would be done lol
Step 4 give 2D being a GUN
Oh no, i edited the comment and the heart i got from it got deleted :(
is that not still a 2d game?
How about a first person 1D game...
It would just be one pixel.
the section at 11min where u talk about it being a 3d illusion looks pretty similar to how we originally did the first 3d games.
I had that thought to actually! reminds me of Wolfenstein & Doom
I've seen a million videos were people randomly talk about ray marching, but this is the first time the explanation actually hit me correctly.
Congrats man, this is actually a great explanation of it
The thing that snapped me out of it, was the explanation of signed distance functions. It finally makes sense that the proportional distance motion is actually computationally good, this is very cool.
You have no idea how happy I am to hear that! Thank you!
Brother basically created doom
Doom is 2.5D
@4Kslimy Doom is fully 3D. Just limited. Dont believe me?: th-cam.com/video/ZYGJQqhMN1U/w-d-xo.htmlsi=0GS7_rNc6hjIqBNw
@4Kslimy Doom is 3d but limited. Theres a video on this on yt but i cant send the link here
A 1D fatality would be kinda dope though
Nah that'd be more like wolfenstein.
It's incredible how intuitive it was the second you added the fog
Time for speedrunners to find a glitch to go into the third dimension... WHY YOU GOTTA MAKE MY JOB HARD
Nuh there going to glitch walk perpendically instead
Dude this video is amazing, I never would have known how much thought needs to go into something that sounds very simple - rendering some 2D shapes and walking around.
The editing and explanations were also top tier, and have massively improved since you've started posting. Definitely one of the better videos you've made!
Thank you so much yoyo
I think the fog and colors can be tweaked a bit, no, a lot, to make it more readable. Fog could be the loss of saturation to an extent, going to blackness only at an extreme range, or if there's no source of light. Try adding sources of light, cause why not. It's confusing when the shadows move when you move, light and fog should be different.
How about expanding FOV using the thickness of the line to represent what's in front and what's peripheral vision?
Try to make a building, like the one in the Flatland cover. To balance it so the objects, sizes and stuff make sense.
Make a kind of boundary around the camera/eyes of the character, so you can't or it's obvious when you stick your face in something making the visibility null. Kind of like inverse fog or a character's visual or non-visual sense for distance. Using Y axis and patterns, perhaps like a checkered transparent pattern of increased intensity for the object too close. Or add a second eye, making parallax possible. Run it cross-eyed, or... It's still a 1d game, even if you need 3d setup to run it with parallax.
Thanks for the suggestions! These are really interesting. If I make a follow up I'll for sure look into them!
I got this recommended and watched through the whole video without realizing it's not a million views video from a huge channel.
Good job, It was super interesting and informative! You gained a follower :)
Thank you so much! That's such high praise (:
Yeah seeing more 1D content does put a smile on my face :)
This was super interesting! The editing and graphics really helped me understand this better (because it was *really* hard to grasp when we talked about it lmao).
Godly editing style, good job
Thanks man! Appreciate that.
You extended the height of the render and suddenly I was reminded of how the rendering on Wolfenstein 3d was done. So yeah... I think the game you described has already been done. XD
Yoooo this was sick dude! I would love to see you expand this! And maybe make a real game from it!
I love how most of the comments i see either have a creator comment or a creator like, and it shows the actual passion that he must put into his community. i think that deserves my subscription
I appreciate that so much!
@nivmiz0 I love the way you portrayed this topic I've seen it done before but never quite as well as you have like it answered some questions that had been left unanswered before or undressed so I hope I get to see more of this quality content you are making and please keep up the most amazing work.
This is crazy, loved the video
All of this is really cool, ngl, and the fact our brains can comprehend it is impresive as well
I really agree! It's pretty insane that we can just use these simple tools to pretty accurately simulate living in a different spatial dimension!
well I mean, 2D and 1D are fairly simple, and we're built to understand the comparatively more complex 3D. However, it is impressive that we're able to understand the vastly more complex 4D
@@ack7we cant fully understand 4d, although we can calculate it and understand facets of it
@@circumplex9552 Me who has played 4D Golf: *Foolish Mortal, you have not one modicum of the understanding I possess*
@@ack7 I know about 4d golf. same principles apply: you still cant get a full visual of the scene like a 4d being would. the ghosts are decent at providing one, but they still cant be seen when they overlap objects in your current 3d slice, you cant tell whether theyre coming from ana or kata, and the opacity isnt that good at telling you how far they are. you also still need to look around the 3d space whereas a 4d being would be able to see it all at once
the line is too flat for our eyes but if you add some height it will just feel like Doom. and Doom is technically 2D first person it uses ray casting for rendering, the space itself is 2D but graphic looks 3D that's just illusion
the game shown is more like wolfenstein and not doom.
doom while limited, and uses a 2d map, is still 3d, it renders floors and heights and stuff.
I don't think sdf is necessary here. Visually each object is made out of lines that have a gradient to them, you can probably just render them back to front like a normal polygonal game and it would probably take less processing power.
Video was well put together though!
Wow this video is incredible!!
I had a lot of fun optimising my 2.5D raycaster. It calculates intersections with line segments after making a few attempts to do basic culling. The main issue is that the floorcasting texture isn't correctly aligned.
Awesome video you make!
I think Mar1d have proved that it is possible to make a true 2d game, with perspective, by making the lines smaller in distance.
Thanks for the explanation!
I subscribed your channel.
:-)
It would be interesting to see how it looks for you to move the 2d plane through a 3d space, could be pretty cool
this is great! i bet sebastian lague would dig it
Using SDFs for this feels like shooting sparrows with cannons. Ray-casting would be way more efficient giving you the same results. Nice video though.
Cool information illustation, and now I finally know of a way of doing that myself, thanks for the link
That's really cool to hear, good luck with your own implementation!
Man, who would knew that making a 2d game with a 1d perspective would take this much time
The video took AGES
There's a guy named MashPoe who made a whole 1D game exactly like this, this kinda reminded me of it
This is actually super neat. I wonder how other characters would appear and how would they be distinct from non character shapes.
It's an interesting challenge for sure!
Reminds me of a scratch tutorial I watched once, they also used raycasting but the final effect was „3d“
When NivMiz mentioned rays my immediate thought was "I've used a simple version of that in Scratch!" haha
Wow, I can't phrase how much i appreciate this channel for making such high-quality videos and aspiring to grow better every time!! #thefogiscoming
The fog is coming.
Having 2 eyes can also give depth perception.
Or they could be a cyclops
This is so interesting and easy to understand. Kinda reminds me of the of Doom engine.
Thanks a lot! Yeah the final product turned out reminiscent of those classic "3D" games
the video looks amazing! it feels quite close to a Sebastian Lague video
Thanks a ton! It was very inspired by his stuff, so I'm glad you think that!
Very nice to see more people branching out to make games in other dimensions. But I'm curious, why did you use raymarching for your rendering?
Thank you! I think different dimensions are an amazing mathematical concept and I've always been interested in visual representations of them. As for why I used raymarching, I've wanted to experiment with the algorithm for a while, and I felt like using it in this context would give it my own unique twist! It was a really fun project to make, and an interesting coding challenge.
Plus, it's an excellent system for rendering! It works great, it's quite fast when run on the GPU, and it can render many more shapes than most other techniques, with minimal performance difference. There are of course many other ways to solve the problem I solved here, but I really do think my implementation is a pretty good one.
From the perspective of a 3D creature watching at the side, yeah, that's accurate.
If a Flatlander has two eyes, he could in principle get stereoscopic vision, with each eye creating its own line,which is slightly different from the one from the other eye. Using the parallax effect, that could result in him seeing the world in some kind of weird, but true 2D. It won't be the 2D version that we are used to, as he cannot see what is on the other side of object, from his vantage point, nor can he see what is inside the outlines of shapes, like we can. But he would be able to see shapes (at least the front part of them) and evaluate the distance to them.
''We viewing a 2D world with a 1D view on a 2D screen in a 3D world through a 2D viewpoint'' I love it😂🔥
i love how i had this idea for a vr horror game
you could just use tall 3d models with base of needed shape and apply depth buffer in shader. the result would be the same if not smoother gradient for rounded shapes and much more performant. also mask could be applied to control players visibility
Yeah, but what would be the fun in that? I was trying to make a true 2D/1D engine, not to fake it! If I was trying to make a GAME in this perspective, I'd probably lean more towards your idea, but that really wasn't the goal here haha.
@@nivmiz0 hehe. can't remember who exactly said it: "we are not in a business of making engines, we are making games". anyway video was super entertaining
Or you could render standard 3d but don't allow up/down pan and only display the center scan line...
It's totally possible to remove that edge distortion from high FOV. It's a solved problem for raycasters and it involves either spacing out the rays unevenly so they land on the view plane with an even spacing, or emitting them from a view plane (although this would presumably harm perspective projection).
Or you could get a 2D brain works too
@@Uni_974 maybe, maybe not. Ultimately what really matters is how used our brain is to that particular projection. Since it differs from the projection we're used to seeing it looks weird, really we'd need a brain with eyes that worked like that. Not a necessary or sufficient trait of being 2D.
How do you make your cool video prensentation animations when you are explaining?
I used a tool called Motion Canvas!
NEW NIVMIZ VIDEO LETS GOOO 🔥🔥🔥🔥I DONT GET HES TALKING ABOUT BUT LETS GOOOO 🗣🔥🗣🔥🗣🔥💯💯
I think you should have the pixels stretch to fill the screen since that's easier to see and more like what a flatlander would see
extrude the row upwards than divide the height by the distance of said pixels for a doom like 3d effect, I've used this for 3d in scratch
Really Really Impressive to me, just before the end i was actually just thinking, what if he stretched the entire window's height? and also the bullets thing which i swear i actually tought he was gonna add that before i reached to the end, but still impressive work!
Having a 2D gun is a staple in most 1D games 🔫
Did you fix the fisheye effect? Because of the perspective, it's hard to be sure, but there were a few times that it looked fisheye-ee.
Without fixing the fisheye effect, it's possible to see a bright spot in the middle of an edge and think that there is a vertex in that bright spot.
Bro is going to be the next mashpoe
Can't wait for 3D miner 😎
You should try porting this to 3ds, the need for fog would be mostly eliminated.
It's a cool project. I think you should make a game out of it. For example, a FPS with wall-like covers and AI enemies, that use pathfinding. I also recommend adding a multiplayer.
2D Doom 🔫
id love to play a game like this, though i find it a bit strange that you cant really tell where vertices are, for example if you see a cube in a 3D world on a 2D plane its very clear where the edges n vertices are since theyre typically darkened or theres a significant change in brightness due to how shadows work, i think that wouldve been quite helpful to help visualize the surroundings
Implementing light and shadow properly in a world like this has its own issues, which I may go into in the follow up video. It has to do with the fact that if a light were to be obscured by a single object in flatland, it would cast a shadow behind it for the length of the entire world. Anyway I'm tackling the issue of differentiating between shades at the moment!
@@nivmiz0 oh that's true, and if the shadow of one object gets cast onto another object it makes it very hard to tell whether it's a shadow or an edge
As someone who read flatland in my physics class, this is cool
Don’t forget to look at Mashpoe’s 1D game as well, it’s similar to this implementation. He also has a stereo anaglyph mode for it!
”A first person 2d game is the easiest 3d game to create from scratch”
I think you would not need raymarching for that. You can simply created a 3d environment in unity, and a camera moving around like a player, but it can only move on a plane. Then only show the center row of the render output and override all other pixels to black using post processing?
Damn, cooking once again
it's funny because i was just thinking the other day how despite the fact that we live in 3d space, our vision is sort of 2d (especially if we didn't have depth perception) and part of the reason i was thinking about that is because of the flatland movie
Our vision is absolutely 2D! Part of the logic of the flatland universe is based on the fact that we see in one dimension less than the world we live in.
you made a 1D game in a 2D world. You see in 2D but you are in a 3D world.
interesting. it's cool to see people experiment with spatial dimensions like this. reminds me of SCP-3966, which iirc also took inspiration from Flatland
one thing im curious about is why you're using ray marching at all. would it not be easier to, for each pixel, perform a ray/object intersection test against every object in the scene, remembering which one is nearest? though i suppose SDFs might not be usable that way; you'd need a unique ray/intersection test for each shape or, failing that, a ray/edge intersection test used once per edge per object. hm... math was never my strong suit
anyway, fascinating project
Can you do " for each ( ray in raycasts ) { run raycastTest(ray); } to speed up the process ?
Rather than a thin line you should stretch it to fill the whole screen but each column of pixels is a single color.
I talk about that illusion later in the video! I left it as a thin line for a lot of the video because I feel it's probably more faithful to the book, but stretching them totally makes a really cool effect!
Now do a 1D game from the point of view of a non one dimensional creature
I've thought about this before. The entire screen is one color
ok 2 cameras in 2D to get 2D binocular vision vision using 3d glasses
please continue this one!
Can't you sum up the ray step lengths to figure out the distance to the camera?
That's actually a great idea! I'll have to check it out to see if it improves performance in any way.
Nice project. The only criticism I have, is that the "flatlander" is walking on empty space. In reality, it would need some kind of surface/planet to traverse on, and the planet would just be a massive circle the same way that gravity makes our planets massive spheres.
you can just think of it as floating
or if you want to make it more believable that it can propel itself, maybe its swimming
this is how maze games on Scratch work!
Reminds me of the 1d game that mashpoe made
11:06 Ah, I just figured that you would have a strange fog look.
I really liked that experiment. But im really glad that there are 2d and 3d games and no 1d games Xd
Nuh‚ keep them 1D games coming __________________
Also known as FPS Raycasting tutorials except leaving walls untextured.
i thought about something " to have a 2D vision, you need one 3D eye, to make a 3D vision you need two 3D eyes.
Maybe if you make two 2D eyes like you did with lines, that could be good for a flatland view.
two lines that you crossed to make ( one 2D eye is a line, then two 2D line should be how they see 2D.... )
so it's basically what people would call a 1d game
5:16 if im reading this right (havent read sources) youre actually doing a panoramic projection of the scene, not a planar one
so the shapes are distorted and bendy.
its harder to tell because 1d but if you were to add tops/bottoms to the "walls" like wolf3d then youd be able to see it
it sounds and looks like they are doing a planar projection, as I'm pretty sure that a panoramic (or I suppose circular, really) projection would preserve shape at the edges of the screen.
Damn, these are some thicc ass pixels
Have you ever heard of Wolfenstein 3D and the raycasting method it used to build it's "3D" environments? basically what you did, but the pixel's height is dependent on it's distance to the camera.
Also you might want to consider shading one side of the shapes darker than the other to help with readability.
I've seen this type of representation for 2D a couple of times and there's one thing that doesn't sit right with me. Your renderer aligns to what a character in a top-down world would see (e.g. Binding of Isaac).
However, wouldn't it make more sense from a gameplay perspective to do a side-view inspired rendering system, similar to what Mario would see? The camera would be vertical rather than horizontal, and you would be able to look up and down. You could move forward and back, and you'd be able to jump. You could even allow the character to flip vertically and turn around like Mario can, if you want the player to be able to see where they're going when they move backwards.
With that type of world, you could actually implement gravity, and consequently, a physics system. You'd be able to represent many games more easily. You could also place your 2D character in a 3D world and add back in left and right mouse movement, and it would translate to that medium easier than with a flat plane system.
Yep, that's another legitimate interpretation of "First-Person 2D". But I think you may be slightly overlooking the problems of turning around, getting past objects in front of you and parsing the view to understand what's going on. This view is, at least in my opinion, a more intuitive way to explain the concept.
However, I still think your version is interesting! I may make an implementation of it in a follow up video.
@@nivmiz0 You'd have to rethink the way depth is represented because you can't really feel out objects in the same way. I think a fog effect or something like that would work. Objects far away are dark/foggy and as you get closer they become brighter.
I can imagine you'd be able to at least do Mario style parkour like that. And jumping would help a player feel out the level too as you can reveal more/less of an object by viewing it from lower or higher positions.
It's strange that you recreate the Doom which is 2,5D game that shows the 2D world in 3D and you have chosen an algorithm that struggles to render a single line.
It is an interesting experiment that reminds of an 7D indie game that I played years ago. It uses simpler rendering to orient yourself more accessibly
The developer of the game is Marries van de Hoef, the game was called Seven Dimensions and was developed during 7dFPS about 10 years ago. I was unable to find it now
Haha, a lot of people have made the comparison to Doom, but under the hood it's a pretty different implementation iirc. Either way, I'm not sure why you say that my algorithm struggles! The game runs at a pretty consistently high fps on my pretty bad computer, though of course when recording clips for the video the recording software lowered performance a bit, so it might seem laggier than it should be in the video.
I'll look into that 7D game! That sounds super interesting.
make it into a game yessss!
Wait is that a 3D and 1D game
There are actually plenty of 1d rendering engines that already exist, moreover, these 1d rendering engines are actually used to render 3d graphics, raytracing is commonly used for this, for each X coordinate send out a ray then depending on how long it took for that ray to hit something change the height of the vertical line for that x position, however, this is 2d, or is it? Realistically, the height is irrelevant, it's just there to help portray the ray length, you could easily replace it with something like brightness, brighter colors are closer darker are further. Also, this notably means that you could theoretically portray a 4d environment through the same method, however, in both cases this does a little bit of trickery, in the 1d case all it's really doing is swapping the y axis out for a z axis which makes the game appear 3d when in fact it just traded one axis of movement for another, and in the 2d case it'd be doing the same thing but to achieve the illusion of 4d graphics, and of course it's actually swapping more than just one axis of movement, it also sacrifices the color element to achieve this, color isn't typically thought of as an axis of movement but in a sense it really is, technically making all 2d games 5d due to red, green, and blue components of color, all of this adds up to make this idea a little funky.
Good vid
can you create Mario or Flappy Bird with vertical line renderer with Mario or bird's point of view. I mean, now that you've made a top-down game with a horizontal renderer, can you make a side-view game with a vertical renderer?
That's a really good idea!
Next step is to keep only the center pixel.
This way, you get a glimpse of the pov from a 1d viewer about a 0d scene. 😅
And that’d be awesome!
You my man are truly think in 1D
I wonder how this would feel in VR... like would depth perception work
That might be a little too trippy lol
I think it would be a bit better if you used the distance to the shape to smooth it out a bit more
What ist that Song/piece at 11:37 called 😃
It's called Allégro by Emmit Fenn (:
@@nivmiz0 thanks👍
6:11 the fog is coming
Why not only look for the corners of the shapes and stretch a colour from each point? Ray marching feels a lot harder on the device.
Would be interesting to see an alternative version where distance was shown as height, even if that's not true 1D projection
That's a really cool idea! I've seen comments here saying that's a similar approach to what Wolfenstein did back in the day, I might have to try it out and see!
@@nivmiz0 Ah, true, I guess that is just basic perspective. Though they had textures ofc.
If i had a coin each time i see a video about creating FPS game in a 2D space, i would have 2 coins. Which isn't a lot, but strange that it happened twice
Mashpoe
a few of us already knew that, and it became patently obvious given the thumbnail.
I can imagine a 1D fps game
You could recreate the pentagon shaped house on the cover of flatland.
Totally! That's the power of SDFs, you can make practically any shape you want.
isn't doom93 technically 1d for shooting then, if you only display the center horizontal pixels.
Sort of! It's a 2D game, which you play in first person! However, because it uses sprites and such to display things on screen, I wouldn't say it's exactly a Flatland-like accurate representation of a 2D character's view.