Show HN: A WebGL Tribute to Tron, the movie that made me fall in love with CGI | Hacker News Reader

Show HN: A WebGL Tribute to Tron, the movie that made me fall in love with CGI

mgz.me

209 pointsmgzme42 comments

This is fantastic! Is it open source, by any chance? I'd love to see how you implemented the scanline filters and particle effects.

I've been juuust dipping my toe into 3D games with a little spline generator I'm hoping to make a game with (https://disco.zone/splines/3/), and as a fellow Tron fan, I'm very inspired by what you were able to do aesthetically here!

That's strangely reminiscent of the gameplay from Stunt Car Racer on the Amiga...

You should definitely keep going with this!

Nice! Rode that like a slow, peaceful roller coaster

Looks great!

This kind of generative art is, I think, one of the best "non-productive" things that computers have enabled.

Two extremely minor nitpicks -

* When browsing through scenes, I notice that a title subtly fades in and out in the lower left corner. I missed this for the first several scenes, and then would often miss it when hitting a new scene, and I'd wonder what the scene was called.

* The "gallery" menu to choose scenes isn't in the upper-left nav, but rather, the hamburger menu. Before trying it out, I expected that clicking on it would take me away from the graphics, and show me a gallery of other projects.

Another nitpick: it hijacks the back button.

Thank you so much for the feedback Yen! I really appreciate the time people take to provide constructive criticism. I agree with you, the navigation can be greatly improved. I have some ideas for better transitions, and I plan to place a more intuitive way to access the scenes gallery throughout this week.

Nice demo. It works well on my IPhone except that it breaks the back button in Safari. If you are making changes to the page address please use location.replace to avoid extra steps in the browser history.

Nice! Some of these also remind me of Rez, which after eighteen years is still my favorite video game.

Reminds me of GLtron. It's GPL and tons of fun. http://gltron.org/

I love Rez too. On a work trip to Tokyo I look a day off to see the sights and went to the Sony building. On one floor, I was beckoned to sit in a chair and take a rumble pack and controller and play Rez, which I'd never heard of. I had no idea what was going on at first but it was such a great experience! You can bet I bought Rez when I got home from that trip!

Rez Infinite in VR is seriously good too!

Maybe a typo, maybe not, but near the end of the About section it says “...pure sweatness...”. Was thinking sweetness, but may be intentional as well.

Regardless, very well done. Liked the ability to swipe on my phone to essentially shift camera direction temporarily (specifically, during the “city” view). Everything seemed well thought out and interactive. Looked great and performed well on an iPhone X in Safari.

Nice! I saw it was made with threejs which I hadnt really seen before. Gallery looks awesome. https://threejs.org/ eg https://bruno-simon.com/

Very cool, it reminds me of Lifelike - So Electric music video; that was like one of the first synthwave tracks I ever head, too. Thanks for reminding me of it.

Never got into Tron, might have started it but left it mid way or earlier. And when the Disney versions came out I never bothered. I might give it a go this weekend.

The new movie has a fantastic soundtrack and awesome CGI.

Sadly that's pretty much the only parts that keep it fresh. It is pretty forgettable and uses some tropes that are both very lazy and "problematic" like born sexy yesterday.

Still, if you end up watching the first one and liking it, it might be worth a watch as well.

The scenes in the first Tron before they get into the virtual world can be a little rough, and feel like they were kind of rushing through some of them.

I'd definitely give it and Tron 2 a chance.

The original Tron was produced by Disney too.

I think it's incredible that a website and desktop computer can generate the kind of graphics in real-time that were state-of-the-art (and not real-time) "only" 38 years ago. I would show this to my friends, but none of them are technical so they'd just think it was a video that's playing.

Great work, thanks for sharing.

(And please fix the back button!)

It works decently even on a smartphone.

It didn't work on mine. There was a loading screen and then it pretty much froze the browser and I had to kill the tab.

Pretty cool! You got some other impressive projects in your website. Congrats!

It's impressive the type of 3D graphics that can be done in a modern browser, i'm surprised why we don't see more websites using these technologies.

With all due respect, please don't encourage more websites to use WebGL for trivial things! This stuff is only really useful for games or some other kind of interactive demo, and wastes power when used for decorative graphics on ordinary informational web sites.

I think compiling native OpenGL ES programs to WASM is probably a bit more of a practical use case, but that comes with its own set of problems... WebGL still suffers from various security issues and bugs on certain platforms: https://github.com/chromium/chromium/blob/master/gpu/config/...

Couterpoint: encourage more people to use WebGL for trivial things! Learn new concepts, break old ways of thinking, experiment with half-baked ideas, allow yourself room to grow. Don't let people tell you that the web is one single thing with rules. There are no rules! You can do whatever you want!

That is all fine for a personal website, but if you're thinking of WebGL for general use, there are an absurd number of rules. I even linked some of them in the parent post.

It really depends what the use case is.

For example one of the sites linked off a site further above is Orano[0]. Beautiful and looks pretty cool, but accessibility doesn't seem that great, i.e. contrast ratio and overall legibility.

So when creating informational sites always keep accessibility in mind, regardless what technology you choose to use.

https://www.orano.group/experience/innovation/en

If only someone would invent a back button so you wouldn't have to stay on the same page.

Also OpenGl ES isn't something that is compiled to WASM, it is a javascript API. WASM does not have access to the DOM or IO.

Interestingly enough, this website hijacks the back button so you can't go back. (Android/Firefox)

I'm not sure what you're saying. WASM can definitely get access to those things through javascript shims. A native OpenGL ES program can be compiled relatively easily to WASM because it maps one-to-one with the WebGL API and barely needs a shim at all. This has been supported in Emscripten for a while now and makes it a lot easier to do things like port mobile games over to the web.

Yes, this is a more detailed version of what I said. Which part makes you want to control what other people make?

Have you tried? The website actually hijack the back button...

Agreed! If not for the current fashion of hyper-minimalism we could be living in the golden age of 3D/skeuomorphic UIs right now. I think it would bring some flavor back to the web. The rest of the site (click the three-bar menu icon in the top-right) is a testament to what can be done with this stuff in a UI setting.

Looks good, but back button doesn't work when inside the website and I had to close the tab.

It looks great on the desktop.

On a Nokia 7.1 Plus not so much, too slow loading the resource and it drops frames.

On a Pixel 4 it looks great!

This is really attractive, but a warning about it having a autoplaying soundtrack that I was not expecting and had no idea how to easily mute without killing the page.

If you want a higher framerate, make the window smaller.

The future was supposed to have surface lighting.

this is so stylish. used to love stuff like this on the chrome experiments website.

Great effort!

oooh, shiny.

Nice! But also, please stop breaking the back button.

Thank you so much for the feedback! I'll keep in mind as a priority to fix the back button issue. I'm glad you enjoyed the scenes.

How is this done? I mean, are they original animations or mapped from videos in some automated way?

Reply on news.ycombinator.com