multiple people asked, so ill explain here: how did i make the animations? everything is made on Davinci Resolve (free version). all the elements I used: the lines flashes etc... are made of solid colors. screenshots for pictures obviously. and all of those custom graphics i just quickly sketched on krita. (for example at: 5:57) single color texts are a Text+, multicolored texts are normal text. movement is handled either by transitions, or by keyframes (smoothed in graph editor) previous pinned comment (by: @puncherinokripperino2500): [CORRECTION] usually cycle is more general thing, a closed path, and edge from a node to itself is called loop.
Could you scale or colour the nodes dependant on the traffic to the site or the size of it, maybe the larger the node the larger he page/traffic and then use colour to represent the amount of connections
I like this animated coding format, it's not just some guy explaining his codebase vaguely, and it isn't some pro showing you how types and methods interact with each other, It's an actual dive into explaining how browsers work. ( Also random memes, because yes. )
This is so high quality, the idea is spectacularly implemented and I learned so much with all the visual aids and the sound fx (and fx in general) really helped carry that narrative. Very cool, engaging, novel educational content. Thank you so much for sharing it with us!
Damn, I'm only like 5 min in and this is one of the most engaging coding videos and very visually pleasing great job man keep it up your going to be huge!
Just saw this video, the production quality is amazing! Im gonna be binge watching your content now and sending it to friends, this amount of views and subscribers is unacceptable for such leve of quality! Love your content!
that's a pretty cool visualisation, it reminds of star maps from games like elite dangerous or no man's sky. if you were to implement a 'fancier' version of it, you could go even more into the analogy, going to websites as travelling from star system to star system, adding new links as 'scanning' for stars, etc and another idea: grouping pages by the site (domain), maybe star colors, or treating the home page as the star and sub pages as planets;
this is going to make me sound like the schizo here, but ive actually been working on this concept for a couple months now in c++ with sdl. it's an unreleased 2d pixelish space game called C6: Dreadnought Forever, and i have no release date for you, but i can say it has a ridiculous amount of ships in it, the backing music is all finished and licensed, it will be between $2 to $10 on steam depending on how much more time i spend in it, and there will be a couple horror elements to it... I was just magneted to this video because i wanted to see a real representation of what my game's galaxy will look like, and oh god! i might have to cut down on the warp gate maximum value.
I appreciate that you explained how you got to the end result and not skipped the part of starting with python before ending in Unity. Very interesting!
This animation and whole concept as well as the way you have explained everything step by step is absolutly great!, I am planning on doing something simmilar with spotify and finding corellations beetween different artist/genres so this video really helped me get an idea where should i start. Keep up the good work.
good luck! if you need any code ur welcome copying it from github its actually pretty interesting if you like connect individual songs from nodes or something you might be able to see actual genres forming
Honestly man, I love you're video style. I just subscribed and this is a really cool and potentially useful tool. Surprised you don't have many subscribers, keep it up man.
I had always thought a node-based map of the internet is the kind of project someone must have already created before but I never found about.. Still amazed you made it look easy!
Incredible work, keep it up man! You finally got a video that hit the algorithm in the right way (I think it was the title imo). Watched this video a bit over 6 hours ago and you shot up 400 subscribers, impressive!
This is amazing quality. Very informative and interesting to watch. Im an EE major with very minor code experience and I was able to follow this easily. Honestly incredible work dude.
Duuude this is so sick! I had similar ideas when I read the Sprawl Trilogy, but obviously your programming skills are much better. This was really cathartic for me to watch.
@@8AAFFF I can believe it, but the important thing is that you did it! Also I went and I tried it out, and it's super cool. Although I did run into the problem of the physics engine sometimes throwing a node super far away from the rest, and the rendering of the lines starts looking really wonky anywhere but really close to them. My issues aside, I think that this 3D graph is actually a lot more useful than the concept might have seemed initially. I went and checked how all the links in one of my own websites interact with eachother and where my site links out to the greater web. Finally, I think it'd be super useful if the nodes were on a color spectrum corresponding to the length of the URL, just we could better see where the "root" sites are. But anyways I'm sure everyone else has their own feature suggestions so I'll stop right here.
@@CockatooDude thanks every suggestion is welcome :D coloring the nodes based on the length if the url is a really nice idea, didnt think about it, currently im adding something im calling "color modes" so one is all the nodes that are in physics range, another will be a thing that colors nodes based on what branch they are conncted to, and i will probably also add your one. and about the physics flinging nodes too far away, did it happen at a low FPS? or is it also happening at higher frame rates? (if ur curious the problem might be with deltatime)
@@8AAFFF Man, if you implement that I'll be super stoked. I'll be keeping my eyes on the Github page for sure. With all these suggestions, I guess you're thinking of a coloring mode selector or something like that, so the user could switch between how they want it displayed. As for the physics flinging stuff, it started happening when there was a big interconnected hub (most nodes connecting back to each other) and that connected to another hub at a few nodes. Put another way, I think the physics works well for a hub and spoke type graph, but if things become too interconnected then some of the "spokes" spawning from a newly scanned node will get flung super far away. It was happening at high and low frame rates, but the problem was definitely worse at high frame rates.
@@CockatooDude thanks for telling me! im actually working rn on rewriting the physics engine to hopefully be a little better in the previous one there was 100% a mistake so now its hopefully fixed (if ur curious i was multiplying the physics forces by time.deltatime when it wasnt needed) so yes ill be updating the github :D
Would have been cooler to implement the node loading on click asynchronously, also 3D for the graph is kind of too much, 2D really allows for a better visualization. Cool video!
@@kibbewater Imagine having points around you. You can grab one of those points and look for it's links, or just throw it away... It could be more fun to interact, than just with mouse... Also sounds like good learning experience for vr project...
That was really fascinating to watch! The 3D representation in Unity started to look like a universe of stars. I imagine if you could scan the entire Internet it would be about as large as our universe!
Keep up the amazing work! The animations were so good. If you keep going like this i can easily see you with hundreds of thousands of subscribers (If you get a slightly better mic). You have just barely started your journey
You should add a layers function where every new outward expanding link is considered a new layer. This would allow you to control how much of these nodes you actually want to see. For example, you could have UA-cam as the Home Page (same as in the video) and then choose to display any connections on the 6th layer (or in other words, 6 connections from UA-cam). You would need the ability of setting a Base Page for this to work well. Being able to change the Base Page could enable a function of browsing links that are 3 layers away in both directions, only forward (linking to) or only backwards (linked from). Any new connections formed from adding new Home Pages (like the second link added in the video which had a YT connection) would be easily sorted in the layers as well. The program would just have to calculate how many nodes that connection is from the UA-cam homepage. This again allows for additional visual functionality by creating the possibility of sorting by Home Page connections, essentially showing which Home Pages are can be routed to other Home Pages. Then, since you are able to click nodes, you could select 2 nodes and expand the connection to display all the links in between the two Home Pages. Really cool project you did, seems like a good base for a very useful tool for internet mapping and potentially even Ai decision visualization.
multiple people asked, so ill explain here:
how did i make the animations?
everything is made on Davinci Resolve (free version).
all the elements I used:
the lines flashes etc... are made of solid colors.
screenshots for pictures obviously.
and all of those custom graphics i just quickly sketched on krita. (for example at: 5:57)
single color texts are a Text+, multicolored texts are normal text.
movement is handled either by transitions, or by keyframes (smoothed in graph editor)
previous pinned comment (by: @puncherinokripperino2500):
[CORRECTION]
usually cycle is more general thing, a closed path, and edge from a node to itself is called loop.
epic (epic)
Could you scale or colour the nodes dependant on the traffic to the site or the size of it, maybe the larger the node the larger he page/traffic and then use colour to represent the amount of connections
which font did you use at the beginning for "goal: visualize WEBSITE internal structure"?
@@nocattl OCR A extended
Thank you@@8AAFFF
I like this animated coding format,
it's not just some guy explaining his codebase vaguely,
and it isn't some pro showing you how types and methods interact with each other,
It's an actual dive into explaining how browsers work.
( Also random memes, because yes. )
thank you
how the hell does that explain how browsers work
@@michaelsondei4695 An example of how the internet could be visualized was explained at 0:30.
@@michaelsondei4695Might wanna give this vid a rewatch?
@@michaelsondei4695that is indeed how web crawlers which are a component of browsers work
I was shocked when i looked on the number of subscribers. Keep doing this, king, animations are unbelievably good for such a small channel!
thank you! glad you liked the animations :)
True that.
duuuuudeee same!
Same
Really cool stuff! A lot of programmers almost gets angry when you want to "coolify" IT, but I'm all for it. Keep it coming!
What do you mean by "coolify"?
@@slicepie410 probably meant like editing effects and stuff
This is so high quality, the idea is spectacularly implemented and I learned so much with all the visual aids and the sound fx (and fx in general) really helped carry that narrative. Very cool, engaging, novel educational content. Thank you so much for sharing it with us!
thanks! glad you liked the fx :)
This is actually maybe one of the most interesting coding videos I’ve ever seen with one of the best editing as well. Amazing job. Phenomenal.
Damn, I'm only like 5 min in and this is one of the most engaging coding videos and very visually pleasing great job man keep it up your going to be huge!
Great video! I loved the editing and sound fx, and the concept / game is really cool!
Just saw this video, the production quality is amazing! Im gonna be binge watching your content now and sending it to friends, this amount of views and subscribers is unacceptable for such leve of quality! Love your content!
glad you enjoyed the video :D
that's a pretty cool visualisation, it reminds of star maps from games like elite dangerous or no man's sky. if you were to implement a 'fancier' version of it, you could go even more into the analogy, going to websites as travelling from star system to star system, adding new links as 'scanning' for stars, etc
and another idea: grouping pages by the site (domain), maybe star colors, or treating the home page as the star and sub pages as planets;
alot of people suggested colors, and its a really good idea I'm actually working on implementing them rn
this is going to make me sound like the schizo here, but ive actually been working on this concept for a couple months now in c++ with sdl. it's an unreleased 2d pixelish space game called C6: Dreadnought Forever, and i have no release date for you, but i can say it has a ridiculous amount of ships in it, the backing music is all finished and licensed, it will be between $2 to $10 on steam depending on how much more time i spend in it, and there will be a couple horror elements to it...
I was just magneted to this video because i wanted to see a real representation of what my game's galaxy will look like, and oh god! i might have to cut down on the warp gate maximum value.
@@ComwpODG c++ is brave
good luck on this project :) when u have a release trailer or something ill be happy to watch :)
Your video style is very clean, and I'm all here for it, continue these cool programming videos!
This an incredible video. The concept and how u walked hs through your thought process is amazing. And the editing is just beautiful. Just beautiful.
this is genuinely awesome stuff man, at this rate, youre about to blow up.
hopefully :) nice pfp
I appreciate that you explained how you got to the end result and not skipped the part of starting with python before ending in Unity. Very interesting!
one of the great videos I have seen in a very long time
Dude very nice, you showed what i was trying to learn. Thank you. Subscribed and looking forward to seeing you become big. GL!!
This animation and whole concept as well as the way you have explained everything step by step is absolutly great!, I am planning on doing something simmilar with spotify and finding corellations beetween different artist/genres so this video really helped me get an idea where should i start. Keep up the good work.
good luck! if you need any code ur welcome copying it from github
its actually pretty interesting if you like connect individual songs from nodes or something you might be able to see actual genres forming
I love this. Extremely detailed, beautiful animations.
i love the art style & sound design of this video
Honestly man, I love you're video style. I just subscribed and this is a really cool and potentially useful tool. Surprised you don't have many subscribers, keep it up man.
The sound effects keeps me constantly stimulated hahah great stuff dude!
That's very well made buddy! Great video!
Loved the editing too!
Cool video bro. I was shocked to see you only have 29 subs
I had always thought a node-based map of the internet is the kind of project someone must have already created before but I never found about.. Still amazed you made it look easy!
This is a masterclass in “here’s an example in real life” demonstrated and presented so well. Amazing!
this channel has HUGE potential, very professional and fluent speaking. waiting to see some more! good luck brother i hope the alg likes your channel
thank you :D the alg actually recommended this video faaar more than the others
@@8AAFFF thats just the beginning, 2024 is your year dude!
THIS IS SO COOL! keep doing what you're doing man! this peaked my curiosity on how browsers work and integrating with unity was a brilliant idea!
thank you :D
That was really well done. Fantastic work.
This is really cool, can't wait to try it out!
Incredible work, keep it up man! You finally got a video that hit the algorithm in the right way (I think it was the title imo). Watched this video a bit over 6 hours ago and you shot up 400 subscribers, impressive!
thaank you i dont even know why the yt alg made this video so popular! didnt expect such a growth myself :D
I absolutely love the way you did the visualizations
New subscriber, love the editing. Great video!
This is amazing quality. Very informative and interesting to watch. Im an EE major with very minor code experience and I was able to follow this easily. Honestly incredible work dude.
thank you! congrats on the EE major
This is some of the best video editing and animation I've seen in a long time
thanks glad you enjoyed it :D
The editing is crazy on this video. Fantastic
Interesting video! Can't wait to see part 2
This video is just great! It is useful,funny and the animations are smooth! You inspired me to actually start a channel lol
thanks :) and good luck on your channel
awesome video, your underrated for the quality content you are droping. keep it up.
Keep it up man, w video. Underrated 💯
wow i really like the style of your videos keep it up man! your hella smart!
amazing visuals in the video, keep it up. you got a new subscriber ✌
Wow! This is the most high quality video I have watched for some time, and you have less than 500 subs?
Talk about underrated..
Damn, this video quality is great :) You definitely deserve more subs! Keep it up :)
This is fascinating. You are a legend.
I like your use of ChatGPT in this. That feels like a good way to use it, as a way to find details and examples of things
great explanation, cool memes and great editing! i hope you get the followers you deserve mate
thanks appreciate it :D
such a cool concept with cooler person behind it.
this was so good bro!
you deserve more attention with your good content.
very interesting!
This is very well made and really interesting. Good job.
I am obsessed with your editing style
Really glad I decided to watch “one more” video before sleeping. Found a great channel to subscribe to!
heyy thaanks :)
go to sleep though
Duuude this is so sick! I had similar ideas when I read the Sprawl Trilogy, but obviously your programming skills are much better. This was really cathartic for me to watch.
thanks!!! after reading the comments turns out quite a lot of people wanted to do something similar
@@8AAFFF I can believe it, but the important thing is that you did it! Also I went and I tried it out, and it's super cool. Although I did run into the problem of the physics engine sometimes throwing a node super far away from the rest, and the rendering of the lines starts looking really wonky anywhere but really close to them. My issues aside, I think that this 3D graph is actually a lot more useful than the concept might have seemed initially. I went and checked how all the links in one of my own websites interact with eachother and where my site links out to the greater web. Finally, I think it'd be super useful if the nodes were on a color spectrum corresponding to the length of the URL, just we could better see where the "root" sites are. But anyways I'm sure everyone else has their own feature suggestions so I'll stop right here.
@@CockatooDude thanks every suggestion is welcome :D
coloring the nodes based on the length if the url is a really nice idea, didnt think about it, currently im adding something im calling "color modes" so one is all the nodes that are in physics range, another will be a thing that colors nodes based on what branch they are conncted to, and i will probably also add your one.
and about the physics flinging nodes too far away, did it happen at a low FPS? or is it also happening at higher frame rates?
(if ur curious the problem might be with deltatime)
@@8AAFFF Man, if you implement that I'll be super stoked. I'll be keeping my eyes on the Github page for sure. With all these suggestions, I guess you're thinking of a coloring mode selector or something like that, so the user could switch between how they want it displayed. As for the physics flinging stuff, it started happening when there was a big interconnected hub (most nodes connecting back to each other) and that connected to another hub at a few nodes. Put another way, I think the physics works well for a hub and spoke type graph, but if things become too interconnected then some of the "spokes" spawning from a newly scanned node will get flung super far away. It was happening at high and low frame rates, but the problem was definitely worse at high frame rates.
@@CockatooDude thanks for telling me! im actually working rn on rewriting the physics engine to hopefully be a little better
in the previous one there was 100% a mistake so now its hopefully fixed
(if ur curious i was multiplying the physics forces by time.deltatime when it wasnt needed)
so yes ill be updating the github :D
watching this video somehow felt like playing a game, well done!
Fascinating stuff. Keep up the work.
the effort on building this is astronomical!
Awesome video, clearly explained and you even linked the repo
thank you :D doing stuff open source is best
Love the animations! Wish all the UX in my computer looked like your animations
Super fun watch, great work
This was a banger video idea.
Interesting and very cool video! You explained everything in a way that even I with zero programming knowledge understood :)
glad the explanation was good :)
Underrated channel, subbed
Wow the video quality is crazy, Can't wait to see more
hey, i'm super excited to see this develop and be optimised
Very nice explanations and visuals! cool project
This is crazy well made! Good job!
thx
love the video edition! subscribed!
That’s really cool, it’s like that network mapper visualizer in the Hacknet game but even cooler
Amazing video! Can't wait to see more of it.I love the part where you decided to not work with JavaScript very relatable.
thanks!
yeah from a python background js is horrible XD
Really cool video! Gonna play with the code and see what I can do with it haha
Just learned about graph theory in school. Loved this video!
bro you deserve at least 100k subs, you're doing excellent work!
:D
Wow this is amazing. I love this!!!!
Really cool project!
I like the description, "you" is super inspiring!
i dont even know
This is freaking cool project man 👏
appreciate it :)
good shit bro, awesome sauce fr
This is crazy good!
Very nice video, is amazing how the program works!
Bro earned a subscriber with this awesome video! 👍
Some really nice animations
wow, what a very cool video, thanks for this !
This is so cool man, keep up the great work! + 1 sub and like (also yet another Karl Casey W)
I love the style of the "game", you went on full cyberpunk, looks super cool.
thanks really love this genre
Really great video, well explained and interesting. 👏
This is really cool. Now we can look at the internet galaxy.
Would have been cooler to implement the node loading on click asynchronously, also 3D for the graph is kind of too much, 2D really allows for a better visualization.
Cool video!
Totally agree with your opinion, but I'd say 3D visualisation can be way better in VR...
@@pa3kc376 but why would you even use VR??
@@kibbewater Imagine having points around you. You can grab one of those points and look for it's links, or just throw it away...
It could be more fun to interact, than just with mouse... Also sounds like good learning experience for vr project...
@@kibbewater it'd be super cool if it was in vr. Kind of like Scanner Sombre, but with slightly less story and a whole lot more exploration.
Personally I really like the 3D graph, more true to Gibson.
this is how i did imagine the internet to look like.
Amazing video man
i LOVE this.
That was really fascinating to watch! The 3D representation in Unity started to look like a universe of stars. I imagine if you could scan the entire Internet it would be about as large as our universe!
Super cool project
Duuude, this is amazing
Keep up the amazing work! The animations were so good. If you keep going like this i can easily see you with hundreds of thousands of subscribers (If you get a slightly better mic). You have just barely started your journey
thanks!
I love this project and all of the future ideas were ideas I thought would improve it while watching the video lol
You should add a layers function where every new outward expanding link is considered a new layer. This would allow you to control how much of these nodes you actually want to see. For example, you could have UA-cam as the Home Page (same as in the video) and then choose to display any connections on the 6th layer (or in other words, 6 connections from UA-cam). You would need the ability of setting a Base Page for this to work well. Being able to change the Base Page could enable a function of browsing links that are 3 layers away in both directions, only forward (linking to) or only backwards (linked from). Any new connections formed from adding new Home Pages (like the second link added in the video which had a YT connection) would be easily sorted in the layers as well.
The program would just have to calculate how many nodes that connection is from the UA-cam homepage. This again allows for additional visual functionality by creating the possibility of sorting by Home Page connections, essentially showing which Home Pages are can be routed to other Home Pages. Then, since you are able to click nodes, you could select 2 nodes and expand the connection to display all the links in between the two Home Pages.
Really cool project you did, seems like a good base for a very useful tool for internet mapping and potentially even Ai decision visualization.
"where's my site?"
by the way, AWESOME video - the editing is really high quality, ju- it's just really good
Really cool!
Such a genious idea
Really cool 👍🏻
Good work, keep it up