Mapping The Internet

Поделиться
HTML-код
  • Опубликовано: 28 июн 2024
  • in this video i coded up a little project, which can scan a webpage for its links, and display them as a mathematical node graph.
    --------------------------------------------------------------------------
    useful links:
    - github repo: github.com/marmust/internet-s...
    - songs:
    1: arcadia - white bat audio: • Video
    2: glitch in reality - white bat audio: • Cyberpunk Synthwave - ...
    --------------------------------------------------------------------------
    thanks for watching, feedback in the comments is appreciated :D

Комментарии • 599

  • @8AAFFF
    @8AAFFF  7 месяцев назад +322

    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.

    • @unflexian
      @unflexian 7 месяцев назад +4

      epic (epic)

    • @Volt64bolt
      @Volt64bolt 7 месяцев назад +3

      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

    • @Pittjenium
      @Pittjenium 7 месяцев назад +5

      which font did you use at the beginning for "goal: visualize WEBSITE internal structure"?

    • @8AAFFF
      @8AAFFF  7 месяцев назад +8

      @@Pittjenium OCR A extended

    • @Pittjenium
      @Pittjenium 7 месяцев назад +2

      Thank you@@8AAFFF

  • @lordofforces
    @lordofforces 7 месяцев назад +552

    I was shocked when i looked on the number of subscribers. Keep doing this, king, animations are unbelievably good for such a small channel!

  • @Seedwreck
    @Seedwreck 7 месяцев назад +294

    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. )

    • @8AAFFF
      @8AAFFF  7 месяцев назад +23

      thank you

    • @michaelsondei4695
      @michaelsondei4695 7 месяцев назад +5

      how the hell does that explain how browsers work

    • @Seedwreck
      @Seedwreck 7 месяцев назад

      @@michaelsondei4695 An example of how the internet could be visualized was explained at 0:30.

    • @FunkyFurret
      @FunkyFurret 6 месяцев назад +2

      @@michaelsondei4695Might wanna give this vid a rewatch?

    • @satadruroy4156
      @satadruroy4156 2 месяца назад

      ​@@michaelsondei4695that is indeed how web crawlers which are a component of browsers work

  • @Odd-RamonHSteen
    @Odd-RamonHSteen 7 месяцев назад +196

    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!

    • @slicepie410
      @slicepie410 7 месяцев назад +2

      What do you mean by "coolify"?

    • @quack3891
      @quack3891 7 месяцев назад +9

      @@slicepie410 probably meant like editing effects and stuff

  • @SmartToaster
    @SmartToaster 7 месяцев назад +56

    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!

    • @8AAFFF
      @8AAFFF  7 месяцев назад +4

      thanks! glad you liked the fx :)

  • @pinkorcyanbutlong5651
    @pinkorcyanbutlong5651 7 месяцев назад +33

    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;

    • @8AAFFF
      @8AAFFF  7 месяцев назад +6

      alot of people suggested colors, and its a really good idea I'm actually working on implementing them rn

    • @ComwpODG
      @ComwpODG 7 месяцев назад +1

      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.

    • @8AAFFF
      @8AAFFF  7 месяцев назад

      @@ComwpODG c++ is brave
      good luck on this project :) when u have a release trailer or something ill be happy to watch :)

  • @yackamajez
    @yackamajez 7 месяцев назад +7

    Cool video bro. I was shocked to see you only have 29 subs

  • @FOBSStrizzy
    @FOBSStrizzy 7 месяцев назад +16

    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!

    • @titoadesanya9369
      @titoadesanya9369 7 месяцев назад

      I’m here and I feel the same way. 2:22

  • @Asterism_Desmos
    @Asterism_Desmos 7 месяцев назад +3

    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.

  • @No-Niche
    @No-Niche 7 месяцев назад +7

    Great video! I loved the editing and sound fx, and the concept / game is really cool!

  • @user-xr1bg5dp9p
    @user-xr1bg5dp9p 7 месяцев назад +14

    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

    • @8AAFFF
      @8AAFFF  7 месяцев назад +3

      thank you :D the alg actually recommended this video faaar more than the others

    • @user-xr1bg5dp9p
      @user-xr1bg5dp9p 7 месяцев назад +1

      @@8AAFFF thats just the beginning, 2024 is your year dude!

  • @lionlight9514
    @lionlight9514 7 месяцев назад

    Your video style is very clean, and I'm all here for it, continue these cool programming videos!

  • @NikZapp
    @NikZapp 7 месяцев назад +9

    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!

    • @8AAFFF
      @8AAFFF  7 месяцев назад

      glad you enjoyed the video :D

  • @43021
    @43021 7 месяцев назад +4

    this is genuinely awesome stuff man, at this rate, youre about to blow up.

    • @8AAFFF
      @8AAFFF  7 месяцев назад

      hopefully :) nice pfp

  • @Cokodayo
    @Cokodayo 7 месяцев назад

    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.

  • @oneredpanda9933
    @oneredpanda9933 5 месяцев назад

    I love this. Extremely detailed, beautiful animations.

  • @cherrymountains72
    @cherrymountains72 7 месяцев назад

    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!

  • @siddheshdhomane7642
    @siddheshdhomane7642 6 месяцев назад

    one of the great videos I have seen in a very long time

  • @lossless4129
    @lossless4129 7 месяцев назад

    This is a masterclass in “here’s an example in real life” demonstrated and presented so well. Amazing!

  • @sufyanfaris
    @sufyanfaris 7 месяцев назад

    The sound effects keeps me constantly stimulated hahah great stuff dude!

  • @gamecashers2472
    @gamecashers2472 6 месяцев назад

    i love the art style & sound design of this video

  • @ColinTimmins
    @ColinTimmins 7 месяцев назад +1

    That was really well done. Fantastic work.

  • @_creare_2742
    @_creare_2742 6 месяцев назад

    I absolutely love the way you did the visualizations

  • @devopstoolbox
    @devopstoolbox 7 месяцев назад

    That's very well made buddy! Great video!
    Loved the editing too!

  • @DrHuman-fj5xl
    @DrHuman-fj5xl 5 месяцев назад

    This is really cool, can't wait to try it out!

  • @gnosissignal9830
    @gnosissignal9830 4 месяца назад

    This is fascinating. You are a legend.

  • @kkuran371
    @kkuran371 7 месяцев назад

    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.

  • @goldstein47
    @goldstein47 6 месяцев назад

    Dude very nice, you showed what i was trying to learn. Thank you. Subscribed and looking forward to seeing you become big. GL!!

  • @cinnamonjam9173
    @cinnamonjam9173 7 месяцев назад

    The editing is crazy on this video. Fantastic

  • @aboucard93
    @aboucard93 6 месяцев назад

    Interesting video! Can't wait to see part 2

  • @JacquesDerderian
    @JacquesDerderian 7 месяцев назад +55

    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.

    • @8AAFFF
      @8AAFFF  7 месяцев назад +5

      thank you! congrats on the EE major

  • @biggiecheese5255
    @biggiecheese5255 6 месяцев назад

    New subscriber, love the editing. Great video!

  • @mrbonono2951
    @mrbonono2951 7 месяцев назад

    Fascinating stuff. Keep up the work.

  • @phyl568
    @phyl568 7 месяцев назад +24

    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!

    • @pa3kc376
      @pa3kc376 7 месяцев назад +3

      Totally agree with your opinion, but I'd say 3D visualisation can be way better in VR...

    • @kibbewater
      @kibbewater 7 месяцев назад +2

      @@pa3kc376 but why would you even use VR??

    • @pa3kc376
      @pa3kc376 7 месяцев назад +2

      @@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...

    • @DWal32
      @DWal32 7 месяцев назад +2

      @@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.

    • @CockatooDude
      @CockatooDude 7 месяцев назад

      Personally I really like the 3D graph, more true to Gibson.

  • @rhn8696
    @rhn8696 5 месяцев назад

    the effort on building this is astronomical!

  • @kireitonsi
    @kireitonsi 7 месяцев назад

    I am obsessed with your editing style

  • @cukhi3719
    @cukhi3719 7 месяцев назад

    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.

    • @8AAFFF
      @8AAFFF  7 месяцев назад

      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

  • @tuxhome3686
    @tuxhome3686 7 месяцев назад

    This is very well made and really interesting. Good job.

  • @paypalcashrich5222
    @paypalcashrich5222 7 месяцев назад

    Keep it up man, w video. Underrated 💯

  • @ZeLoShady
    @ZeLoShady 6 месяцев назад +2

    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 RUclips 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 RUclips). 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 RUclips 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.

  • @hotlinefrenzy
    @hotlinefrenzy 7 месяцев назад +1

    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!

  • @sahilnatikar6149
    @sahilnatikar6149 7 месяцев назад

    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!

    • @8AAFFF
      @8AAFFF  7 месяцев назад

      thank you :D

  • @ecogreen123
    @ecogreen123 7 месяцев назад

    such a cool concept with cooler person behind it.

  • @v0rap
    @v0rap 7 месяцев назад

    Damn, this video quality is great :) You definitely deserve more subs! Keep it up :)

  • @maximood-tired
    @maximood-tired 7 месяцев назад +1

    watching this video somehow felt like playing a game, well done!

  • @jamesbaconreid
    @jamesbaconreid 7 месяцев назад

    Super fun watch, great work

  • @kickassvideos5469
    @kickassvideos5469 7 месяцев назад

    awesome video, your underrated for the quality content you are droping. keep it up.

  • @Krieger501
    @Krieger501 7 месяцев назад

    amazing visuals in the video, keep it up. you got a new subscriber ✌

  • @jdjd99AA
    @jdjd99AA 5 месяцев назад

    wow i really like the style of your videos keep it up man! your hella smart!

  • @comosaycomosah
    @comosaycomosah 6 месяцев назад

    this was so good bro!

  • @Rollthered
    @Rollthered 7 месяцев назад +1

    This was a banger video idea.

  • @drumba
    @drumba 7 месяцев назад

    you deserve more attention with your good content.
    very interesting!

  • @augustinenguyen6703
    @augustinenguyen6703 7 месяцев назад

    This is crazy well made! Good job!

    • @8AAFFF
      @8AAFFF  7 месяцев назад

      thx

  • @bblessed
    @bblessed 7 месяцев назад

    This is some of the best video editing and animation I've seen in a long time

    • @8AAFFF
      @8AAFFF  7 месяцев назад

      thanks glad you enjoyed it :D

  • @sankalppatil2994
    @sankalppatil2994 7 месяцев назад

    Underrated channel, subbed

  • @normal1203
    @normal1203 7 месяцев назад

    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!

    • @8AAFFF
      @8AAFFF  7 месяцев назад

      thaank you i dont even know why the yt alg made this video so popular! didnt expect such a growth myself :D

  • @MrModez
    @MrModez 7 месяцев назад +1

    This is freaking cool project man 👏

    • @8AAFFF
      @8AAFFF  7 месяцев назад

      appreciate it :)

  • @parmesanzero7678
    @parmesanzero7678 6 месяцев назад

    Having grown up alongside the Internet, going from BBS, to dialup, to ISPs, getting a description of how pages link feels like having someone explain basic addition. But I stuck around for the map. ^_^

  • @dragonfire4356
    @dragonfire4356 7 месяцев назад

    hey, i'm super excited to see this develop and be optimised

  • @Lrelni
    @Lrelni 7 месяцев назад

    Very nice explanations and visuals! cool project

  • @volkingdeath5312
    @volkingdeath5312 7 месяцев назад

    That’s really cool, it’s like that network mapper visualizer in the Hacknet game but even cooler

  • @neut_ro
    @neut_ro 7 месяцев назад +1

    This video is just great! It is useful,funny and the animations are smooth! You inspired me to actually start a channel lol

    • @8AAFFF
      @8AAFFF  7 месяцев назад

      thanks :) and good luck on your channel

  • @augnix888
    @augnix888 7 месяцев назад

    love the video edition! subscribed!

  • @Joel-qo6gt
    @Joel-qo6gt 7 месяцев назад

    This is really cool. Now we can look at the internet galaxy.

  • @Modding_
    @Modding_ 7 месяцев назад

    Some really nice animations

  • @snats
    @snats 7 месяцев назад

    Wow this is amazing. I love this!!!!

  • @morganolivianewton8061
    @morganolivianewton8061 6 месяцев назад

    Just learned about graph theory in school. Loved this video!

  • @lel7531
    @lel7531 7 месяцев назад

    Wow the video quality is crazy, Can't wait to see more

  • @remie123
    @remie123 7 месяцев назад

    Wow! This is the most high quality video I have watched for some time, and you have less than 500 subs?
    Talk about underrated..

  • @spiniferous
    @spiniferous 7 месяцев назад +1

    Id love to see this visualized as orbiting planets

  • @normalgenericlazyguy5589
    @normalgenericlazyguy5589 7 месяцев назад

    I love how this video sounds

  • @aquadap219
    @aquadap219 7 месяцев назад

    great explanation, cool memes and great editing! i hope you get the followers you deserve mate

    • @8AAFFF
      @8AAFFF  7 месяцев назад +1

      thanks appreciate it :D

  • @DylanShouldice
    @DylanShouldice 7 месяцев назад

    good shit bro, awesome sauce fr

  • @mattwandcow
    @mattwandcow 5 месяцев назад

    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

  • @alspal
    @alspal 7 месяцев назад +2

    Awesome video, clearly explained and you even linked the repo

    • @8AAFFF
      @8AAFFF  7 месяцев назад +1

      thank you :D doing stuff open source is best

  • @lsfrdev7768
    @lsfrdev7768 7 месяцев назад

    wow, what a very cool video, thanks for this !

  • @malusmundus-9605
    @malusmundus-9605 2 месяца назад

    As soon as this dude said "we're going to need a more local approach" I was onboard. Good engineering right there.

  • @glyph2011
    @glyph2011 7 месяцев назад

    Absolutely amazing 👍 and fascinating. 👍

  • @Drippy_Jesus
    @Drippy_Jesus 6 месяцев назад

    Bro earned a subscriber with this awesome video! 👍

  • @jasonedward
    @jasonedward 7 месяцев назад

    Love the animations! Wish all the UX in my computer looked like your animations

  • @igna3132
    @igna3132 7 месяцев назад

    Very nice video, is amazing how the program works!

  • @Three2NineProject
    @Three2NineProject 7 месяцев назад

    Really glad I decided to watch “one more” video before sleeping. Found a great channel to subscribe to!

    • @8AAFFF
      @8AAFFF  7 месяцев назад +1

      heyy thaanks :)

    • @8AAFFF
      @8AAFFF  7 месяцев назад

      go to sleep though

  • @shubhankartrivedi
    @shubhankartrivedi 6 месяцев назад

    This is crazy good!

  • @chiggywiggy524
    @chiggywiggy524 7 месяцев назад +2

    I'm your 29th subscriber!

    • @8AAFFF
      @8AAFFF  7 месяцев назад +1

      YESSSS

  • @variablenine
    @variablenine 7 месяцев назад

    This would be a very cool thing to implement into a web browser

  • @Egeskov959
    @Egeskov959 7 месяцев назад

    Really cool project!

  • @phpsoftwareengineering
    @phpsoftwareengineering 7 месяцев назад +26

    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!

  • @botanicalyuuchan
    @botanicalyuuchan 7 месяцев назад +1

    Interesting and very cool video! You explained everything in a way that even I with zero programming knowledge understood :)

    • @8AAFFF
      @8AAFFF  7 месяцев назад

      glad the explanation was good :)

  • @karthiksunil219
    @karthiksunil219 7 месяцев назад

    this is how i did imagine the internet to look like.
    Amazing video man

  • @ilanheas8723
    @ilanheas8723 7 месяцев назад

    Really great video, well explained and interesting. 👏

  • @teamredstudio7012
    @teamredstudio7012 7 месяцев назад

    I like the description, "you" is super inspiring!

    • @8AAFFF
      @8AAFFF  7 месяцев назад

      i dont even know

  • @jakubzakowski7422
    @jakubzakowski7422 7 месяцев назад

    bro you deserve at least 100k subs, you're doing excellent work!

    • @8AAFFF
      @8AAFFF  7 месяцев назад

      :D

  • @inertiasquared6667
    @inertiasquared6667 7 месяцев назад

    Really cool video! Gonna play with the code and see what I can do with it haha

  • @marshallbcodes
    @marshallbcodes 7 месяцев назад

    Amazing video! Can't wait to see more of it.I love the part where you decided to not work with JavaScript very relatable.

    • @8AAFFF
      @8AAFFF  7 месяцев назад

      thanks!
      yeah from a python background js is horrible XD

  • @nyx019
    @nyx019 7 месяцев назад

    I usually don't watch coding videos. But this was captivating!

  • @itsmeallejandro
    @itsmeallejandro 7 месяцев назад

    Thats incredible man the math and phisics with coding together

  • @nonridiculousadjective6597
    @nonridiculousadjective6597 7 месяцев назад

    I love the style of the "game", you went on full cyberpunk, looks super cool.

    • @8AAFFF
      @8AAFFF  7 месяцев назад

      thanks really love this genre

  • @captainMony
    @captainMony 6 месяцев назад

    You know its a good techy video with white bat audio

  • @shyvv.
    @shyvv. 7 месяцев назад

    This is so cool man, keep up the great work! + 1 sub and like (also yet another Karl Casey W)

  • @alexcummings6935
    @alexcummings6935 7 месяцев назад

    lovely idea. Love Neuromancer.