I Made a Clock that's a Conway's Game of Life

Рет қаралды 3,496

Күн бұрын

In this video I’m looking at how you can build original projects for your web dev portfolio starting with literally nothing but a blank google doc and ending with a bunch of insanely ambitious ideas and a working clock that's made with CSS and is also a digital life form. Sort of. Spoiler: Margareth Thatcher is to blame.
Enjoy! (Hope it’s useful too)
The Clock:
odddirector.github.io/time_of...
The cheap tablet:
amzn.to/42CnrV4
The tablet that should work better for more complex clock configurations:
amzn.to/487hkcB
(those are all affiliate links) (Amazon pays me if someone buys something through those) (very little) (still helps) (every little helps)
(a great gift for someone or yourself) (did I say that already?)
0:00 The Wombats
0:20 Think Different Jobs Tim
1:17 Why clock? (Margaret Thatcher)
1:34 Get an Insane Idea for Your Project Easy!
2:03 The Brainstorming & I hit a fridge
3:20 A Clock That’s Alive
4:17 Building the Alive Clock
6:04 How it Works
6:38 The Basic Working Alive Clock
7:17 The Crazy Variations of the Alive Clock
7:59 Putting it in the Interior
8:23 Idea #2 (and it’s impossible)
The source code:
(not the movie with Jake Gyllenhaal, the actual source code)
github.com/odddirector/time_o...

Пікірлер: 34

@odddirector 3 ай бұрын

So I thought I’d clarify something after you thought something I thought was funny, wasn’t funny. The ChatGpt prompt was: "write a javascript where a canvas 90 px high by 200 wide will display current time in big black digits and then every second convert this image on the canvas into a two-dimensional javascript array, where 0 would represent white and 1 would represent black, and log it to console" That's it. The rest was written by me. github.com/odddirector/time_of_life/commits/main/ Well and by Robert Spatz who’s written the original game of life in js. codepen.io/RBSpatz/pen/rLyNLb There is an interesting conversation to be had about heavily using AI in a dev process (I don’t think there is anything wrong with it personally, especially for fast prototyping). Could be a cool topic for a separate video.

@hubertfarnsworth6172 3 ай бұрын

this channel is going to blow up - you're really onto something here editing style and pacing is off the charts and perfect use of A.I assistance

@odddirector 3 ай бұрын

Thank you so much! Feedback like this is very important to me.

@claytonbennett7797 3 ай бұрын

I lovr that the answer is "f that" for the time-heavy approaches. I need to say that more.

@odddirector 3 ай бұрын

Its a very good point, thanks! Still not sure if I'm saying it often enough myself, but running a YT channel with a posting schedule definitely helps.

@Istarax 3 ай бұрын

Don't really know why this was recommended to me, but it was hilarious! Good job 😂

@odddirector 3 ай бұрын

Thanks! Interesting... You mean you don't watch anything web dev related? (trying a different youtube setting with this one, hence especially interested)

@akssayshay 3 ай бұрын

Amazing production and ideas, loving it

@odddirector 3 ай бұрын

Thank you!

@benjaminbutton9745 3 ай бұрын

Watched the whole thing and was shocked to see that this has only 300 views. Very well made video. Reminded me a bit of code bullet

@odddirector 3 ай бұрын

And you're not alone there 😅 This thing had like 40 views for the first three days, when my other videos usually get around 2-4k. KZfaq is a weird game. Thank you! And thanks for the code bullet reference! I didn't know him!

@DanDeebster 3 ай бұрын

I watched this yesterday and came back to comment (after watching some of your others) and you've got over a thousand extra views since then! Good - I was amazed you only had views in the hundreds for such great content. (I don't really have anything else to add apart from a little juice for the algo overlord)

@odddirector 3 ай бұрын

Thank you! Yes, the overlord works in mysterious ways. 😅 Maybe I'll figure it out some day. (could be that a child sacrifice is required)

@AlexJNef 3 ай бұрын

amazing work dude!!!

@odddirector 3 ай бұрын

Thanks! 😀

@bnooper 3 ай бұрын

Did ChatGPT really do all the website's code by itself or did it give you an idea and you converted that idea into code?

@odddirector 3 ай бұрын

Hey! So ChatGPT only wrote a script that created the running clock on the canvas and converted it to the array of zeros and ones every second. The rest was written by me: github.com/odddirector/time_of_life/commits/main/ And the original js/css game of life of course was written by Robert Spatz codepen.io/RBSpatz/pen/rLyNLb The chatgpt prompt was: "write a javascript where a canvas 90 px high by 200 wide will display current time in big black digits and then every second convert this image on the canvas into a two-dimensional javascript array, where 0 would represent white and 1 would represent black, and log it to console"

@sailor.seahell 3 ай бұрын

This is ART. Hell yeah

@odddirector 3 ай бұрын

Thanks! 😊 It's an interesting point actually. I'd be more tempted to call it "design". That, or "Another stupid thing Philipp has made". 😂

@Juksemakeren 3 ай бұрын

the result's zalgo-ish

@odddirector 3 ай бұрын

Î̴̞͖͙͑̀ ̶̳̻̭͆̑d̶̼̟͠ŏ̸̬̲̉͘͜n̸̺̰̟͉͊̌̓͘'̷͈͖̫̒ͅt̵͙̲͛ ̶͉̳̎̀͝k̸̯̤͇̿̏͛͆n̴̞̜̜͍̅͆̾̀o̸̭̙͇̎w̵̼̣̾̈́̂̀͜ͅ ̵̓͜͠w̷̧̢̘̭͗ḫ̷́ͅâ̴̢̟̠̰͐̄͘t̵͚̹̜͍̍̿̎ ̷̖͌͛̐̈́ỳ̶͎̞̤ō̷̠͚̣̯̇u̴̪͂̓̓̕'̵̹̻̑̍͝͝r̷̳͐̑̍e̶̬̤̩͗̍͝͠ ̸̤̭͓̊ṭ̸̲̒̈̕a̴͋ͅl̶̝̽k̸͎̋́̑i̵̹̙̥͋̎̈́͂n̸̨̎̈g̷̨͖̤͋ ̷̡͖͖̈̇a̵̤͂͌̆b̷̻͚̣̲͐̐͘͠o̸͉̻͔̠͐͋̀͝ǘ̴̖̬̙͈̿̎t̸̥́̌͂.̸͇̜͍̓̊̀

@trollin3915 3 ай бұрын

odd!

@odddirector 3 ай бұрын

very.

@FireyDeath4 Ай бұрын

"All CSS" Like you didn't just use HTML and JS when you had to XD Honestly I don't even know what "all CSS" means when people generally say it, since at least HTML would probably be required (maybe)

@wztly7368 3 ай бұрын

lost me at the part where you started using AI

@TehNitro 3 ай бұрын

same

@odddirector 3 ай бұрын

😅 The ai really just wrote a script where it creates the canvas element with the clock displayed on it, and then every second converts it to an image, reads each pixel, converts it to either 1 or 0 and puts it into an array. I then loop through that array and if a number is 0, make a game of life cell with the same index black (alive), if its 1 -- I make it white (dead). And my game of life is a table where a number of cells matches the number of pixels in that clock image. I explain it here in a Doc Brown style 6:04 😅

@TehNitro 3 ай бұрын

@@odddirector you still used ai...

@odddirector 3 ай бұрын

@@TehNitro ahh so by "lost me" you meant you lost interest in the video? I see ai as just another tool really, especially when you're building something fun / or a proof-of-concept-like on a tight schedule.

@TehNitro 3 ай бұрын

@@odddirector I wouldve enjoyed the video more if you coded it yourself