Nightdrive

I&#x27;m amused that we share initials and a passion for this kind of project! Mine&#x27;s <a href="https:&#x2F;&#x2F;rezmason.github.io&#x2F;drivey" rel="nofollow">https:&#x2F;&#x2F;rezmason.github.io&#x2F;drivey</a> .<p>One key difference: this guy built his demo from scratch, whereas mine&#x27;s a port of someone else&#x27;s work. It&#x27;s great to see another implementation, with its own techniques and features.

See also Martijn Steinrucken aka BigWings&#x27;s The Drive Home:<p>ShaderToy: <a href="https:&#x2F;&#x2F;www.shadertoy.com&#x2F;view&#x2F;MdfBRX" rel="nofollow">https:&#x2F;&#x2F;www.shadertoy.com&#x2F;view&#x2F;MdfBRX</a> [WebGL]<p>Video: <a href="https:&#x2F;&#x2F;www.youtube.com&#x2F;watch?v=WrxZ4AZPdOQ" rel="nofollow">https:&#x2F;&#x2F;www.youtube.com&#x2F;watch?v=WrxZ4AZPdOQ</a> &#x2F; Making of: <a href="https:&#x2F;&#x2F;www.youtube.com&#x2F;watch?v=eKtsY7hYTPg" rel="nofollow">https:&#x2F;&#x2F;www.youtube.com&#x2F;watch?v=eKtsY7hYTPg</a>

&gt;There are a few more things that I think would be fun to do:<p>First off, it&#x27;s beautiful! Second, just because you can, doesn&#x27;t mean you should :)<p>I think it&#x27;s art, so be careful about adding more. The minimalism is beautiful. Just a bunch of moving lights, but they capture the feel of night driving! If you add everything mentioned as upgrades, it will be a simulation. An impressive engineering feat, but (I think) less as a work of art.<p>I wonder, what does someone who&#x27;s never ridden&#x2F;driven in a car at night &#x27;feel&#x27; when they see this?

This reminds me of the movie Drive (2011), in particular the first song on the soundtrack, Kavinsky - Nightcall<p><a href="https:&#x2F;&#x2F;youtu.be&#x2F;MV_3Dpw-BRY" rel="nofollow">https:&#x2F;&#x2F;youtu.be&#x2F;MV_3Dpw-BRY</a>

<p><pre><code> It&#x27;s hard to classify what it is. It&#x27;s not a video, because it&#x27;s generated dynamically. It&#x27;s not a game, because you just watch. It&#x27;s not a screensaver, because it&#x27;s not the 90s. Maybe it&#x27;s a &quot;demo&quot;? </code></pre> It&#x27;s an animation.

This reminds me of Desert Bus, the legendary&#x2F;notorious driving game by Penn &amp; Teller. During the second half of the game, you&#x27;re driving at night and the view is not dissimilar.<p><a href="https:&#x2F;&#x2F;www.newyorker.com&#x2F;tech&#x2F;annals-of-technology&#x2F;desert-bus-the-very-worst-video-game-ever-created" rel="nofollow">https:&#x2F;&#x2F;www.newyorker.com&#x2F;tech&#x2F;annals-of-technology&#x2F;desert-b...</a><p>Of course, because Desert Bus <i>is</i> literally the worst game ever, the steering continually veers to the side and you have to keep nudging the wheel or you&#x27;ll crash.

<i>&gt; It&#x27;s not a screensaver, because it&#x27;s not the 90s.</i><p>It may be 2022, but I would love a screensaver version of this.

&gt;<i>The entire scene is created purely by drawing circles on a HTML5 canvas. It actually works a lot better than I expected. The biggest flaw is that the cars are totally transparent, so you can see lights from distant cars even where they should be occluded by closer cars.</i><p>Hmm, why not just draw a black rectange around any pair of car lights? It should work for givimg the impression of a solid car within the context of the video...<p>Edit: hmm, he does say this &quot;This would be slightly harder than street light occlusion. Probably a first pass would be to render a black cuboid behind each car&#x27;s lights, so that the cuboid blocks out anything that would be blocked by the car.&quot;

This reminds me of this video: <a href="https:&#x2F;&#x2F;youtu.be&#x2F;WrxZ4AZPdOQ" rel="nofollow">https:&#x2F;&#x2F;youtu.be&#x2F;WrxZ4AZPdOQ</a><p>He does incredible work with shaders and explains them in very clear detail.

Nice!<p>It would be cool if it flipped from left- to right-side driving depending on host&#x27;s IP address?

I wanted to do the same for the train feeling: <a href="https:&#x2F;&#x2F;qewasd.com&#x2F;train" rel="nofollow">https:&#x2F;&#x2F;qewasd.com&#x2F;train</a>

&gt; <i>It&#x27;s not a screensaver, because it&#x27;s not the 90s.</i><p>XScreenSaver had its most recent release <i>two weeks</i> ago.

I love how this written. I&#x27;ve wanted to document how a personal project works, and this style&#x27;s exactly what I was looking for.

As a German, it would have been more relaxing if cars on the left were faster.

Beautiful. This is something I’ve thought about too. Thanks for making it!<p>One of the most beautiful light effects I’ve seen while being a passenger in a car is the reflection of oncoming headlights on the underside of powerlines, whether they be mains power or for electric trains. It’s a dazzling pattern, reminiscent of the wormhole scene in Interstellar.<p>Perhaps something to add to your “more” list? :smiling-emoji-with-eyes-closed-and-sweat-bead:<p>Edit: At first I thought there were also stars, but it was just dust on my phone…

Does anyone have good resources for creating &quot;generative assets&quot; like this?<p>I have a decent handle on js but I have no idea where to start in terms of tooling. For now, I&#x27;ve been trying to build basic eye tracking to apply a &quot;block&quot; of color over eyes with an animation in said block on top of a real-time video stream.<p>Elsewhere, automating mouth animations from audio &#x2F; even moving a character in a random motion when audio input is provided.<p>Any advice where to start would be greatly appreciated!

This is the sort of thing I&#x27;d leave on an unused monitor all the time or have on display somewhere. Really cool aesthetic

If this is what most people see driving at night I&#x27;m jealous. Astigmatism makes every light source at night a big star-burst for me. Oncoming lights are near-blinding at some angles, the only way to cope is stare at the road lines on the opposite side.

Who else grew up playing Night Driver on the Atari 2600?

I suggest detecting the viewers geographic location and changing the left&#x2F;right side drive.

For something similar, I always liked this blog series: <a href="https:&#x2F;&#x2F;www.shamusyoung.com&#x2F;twentysidedtale&#x2F;?p=2940" rel="nofollow">https:&#x2F;&#x2F;www.shamusyoung.com&#x2F;twentysidedtale&#x2F;?p=2940</a><p>Unfortunately it seems the author passed away a few months ago

&gt; &quot;It&#x27;s hard to classify what it is [...] Maybe it&#x27;s a &quot;demo&quot;?&quot;<p>Exactly, those are demos, and while I believe it&#x27;s slightly different there&#x27;s a whole culture around it that I&#x27;ve never been aware until recently called &quot;demoscene&quot;! I even have a small &quot;Demos&quot; section on my website with a bunch of those, not to the same level of quality though since for me it&#x27;d be a bit more like &quot;self-contained small experiments that resulted in something cool so I put it together as a demo&quot;:<p>- &quot;Zoom&quot;, hyperdrive-like effect: <a href="https:&#x2F;&#x2F;francisco.io&#x2F;demo&#x2F;zoom&#x2F;" rel="nofollow">https:&#x2F;&#x2F;francisco.io&#x2F;demo&#x2F;zoom&#x2F;</a><p>- &quot;Tree generation&quot;, specify a JSON&#x2F;HTML structure and it&#x27;ll generate a tree: <a href="https:&#x2F;&#x2F;francisco.io&#x2F;demo&#x2F;tree&#x2F;" rel="nofollow">https:&#x2F;&#x2F;francisco.io&#x2F;demo&#x2F;tree&#x2F;</a> (disc: it was inspired by a broken demo I saw from someone else)<p>- &quot;Stereo Depth&quot;, calculate depth of a couple of stereo images using JS: <a href="https:&#x2F;&#x2F;francisco.io&#x2F;demo&#x2F;depth&#x2F;" rel="nofollow">https:&#x2F;&#x2F;francisco.io&#x2F;demo&#x2F;depth&#x2F;</a><p>- &quot;Terminal player&quot;, specify a bunch of commands in plain text and they&#x27;ll be &quot;played&quot; like a video: <a href="https:&#x2F;&#x2F;francisco.io&#x2F;demo&#x2F;terminal&#x2F;" rel="nofollow">https:&#x2F;&#x2F;francisco.io&#x2F;demo&#x2F;terminal&#x2F;</a>

<i>&gt; ’Maybe it&#x27;s a &quot;demo&quot;?’</i><p>There’s a long-standing tradition of people creating realtime graphics software on personal computers that doesn’t offer any interactivity. They are indeed called demos and the community is called the demoscene. It goes back to the late 1980s and had a golden era in the mid-90s on Amiga and PC. (Pre-Internet, watching and making demos was one of the few socially and creatively oriented things you could do for free on a home computer.)<p>To be pedantic, this isn’t a full-blown demo. Small demos are called intros, and a category of them is the size-constrained intro (e.g. 1kB or 4kB). So this could be either a small intro or an effect as part of a bigger demo.<p>It’s worth looking up some of the small intros. People can squeeze entire GPU-raytraced universes with music into a few kilobytes.

&gt; I found it actually worked better if I omitted the x offset from the distance calculation (so just sqrt(y2 + z2)), otherwise objects near the edge of the field of view were weirdly distorted. But I wouldn&#x27;t suggest doing that in the general case.<p>I think this is because you should actually just be dividing by y, the perpendicular distance through the screen. Probably adding z to the mix, while wrong, doesn&#x27;t make it too weird because of the limited set of z values used.<p>If the result with just division by y looks distorted, then I would suggest fiddling with the value of k, which effectively controls how wide-angle versus telephoto things look.

Really cool . Reminds me of the VR collaboration project (Dance Tonite) by Google Data arts team and LCD Sound System <a href="https:&#x2F;&#x2F;tonite.dance&#x2F;" rel="nofollow">https:&#x2F;&#x2F;tonite.dance&#x2F;</a>

Reminds me very much of <i>Night Driver</i>, the arcade game from 1976:<p><a href="https:&#x2F;&#x2F;archive.org&#x2F;details&#x2F;arcade_nitedrvr" rel="nofollow">https:&#x2F;&#x2F;archive.org&#x2F;details&#x2F;arcade_nitedrvr</a>

I have many many childhood memories of long journeys up and down the country visiting my grandparents sat in the back of my parents car at night with scenes just like this etched in there. And I&#x27;m from UK too so was delighted they did this the &quot;right&quot; way round :)<p>Brilliant work, love this.<p>And the music reminds me of Kavinsky too with the obvious association with Drive.<p>Also, I know it&#x27;s not actually there, but my mind insists on filling in a &quot;not quite black&quot; sky over the road and the occasional tree or similar to the sides as shadows. Fascinating effect.

Im not sure the cars and lights need to be anymore than floating orbs, its quite a nice minimalist aesthetic with just the lights. I&#x27;m not sure it needs to be a game either, maybe the ability to steer the car would be good but any more than that might seem forced (and I&#x27;m not even sure it needs that). The only real problem I see is that cars pass through you from behind (the only time the floating orbs effect becomes an issue), but even that seems minor for what it is.

&gt; What game can we make where the premise is that you&#x27;re a passenger on the motorway at night time? It shouldn&#x27;t be a particularly taxing game, I think the main experience should still be that you&#x27;re just enjoying watching the lights, but it would be cool if there was some interactivity and some sort of goal.<p>If you wanted to make it interactive, maybe a Pokemon Snap like functionality where you try to capture photos of random environment features or creatures.

I love this.<p>It would be awesome to do this with a bladerunner theme. Like, sitting in a spinner going somewhere, with all the different cars, spinners and maybe buildings passing by.

&gt; It&#x27;s hard to classify what it is.<p>“Synthwave multimedia project” would be how I’d describe it.<p>It’s very good. Made me think of the Jeff Goldblum &#x2F; Michelle Pfeiffer film <i>Into the Night</i> (<a href="https:&#x2F;&#x2F;www.imdb.com&#x2F;title&#x2F;tt0089346&#x2F;" rel="nofollow">https:&#x2F;&#x2F;www.imdb.com&#x2F;title&#x2F;tt0089346&#x2F;</a>).

Very cool. Of course the music is retrowave.

It&#x27;s not just the driving on the left that gives away that this is not in the US, but also the fact that there are lights along the highway and reflectors dividing the lanes. Ha, safety precautions!<p>I hate US highways at night, they are so dark, sometimes I feel I might as well have my eyes closed.<p>Rant that no one asked for over.

&gt; The biggest flaw is that the cars are totally transparent,<p>This seems easily fixable, no? Just make cars opaque black and assign progressively decreasing z-index to each spawning light. (Unlikely anyone will leave page open long enough to reach min value, and you could just reset at that point.)

Related: tutorial for writing something similar with ShaderToy - <a href="https:&#x2F;&#x2F;youtube.com&#x2F;playlist?list=PLGmrMu-Iwbgs0H9va0DlopOGyYnlLmxhS" rel="nofollow">https:&#x2F;&#x2F;youtube.com&#x2F;playlist?list=PLGmrMu-Iwbgs0H9va0DlopOGy...</a>

Is it legal to overtake on the right in the US? It&#x27;s not in the country where I live (NL).

&gt; It&#x27;s hard to classify what it is. It&#x27;s not a video, because it&#x27;s generated dynamically. It&#x27;s not a game, because you just watch. It&#x27;s not a screensaver, because it&#x27;s not the 90s. Maybe it&#x27;s a &quot;demo&quot;?<p>It&#x27;s a simulation.

Beautiful, congrats! This reminds me the final shot of Playtime (not a spoiler! at 2:07: <a href="https:&#x2F;&#x2F;youtu.be&#x2F;anvhVINSFnE?t=127" rel="nofollow">https:&#x2F;&#x2F;youtu.be&#x2F;anvhVINSFnE?t=127</a> )

So realistic that it hogs the middle lane when it could move to the left ;)

Music version is amazing: <a href="https:&#x2F;&#x2F;incoherency.co.uk&#x2F;nightdrive&#x2F;" rel="nofollow">https:&#x2F;&#x2F;incoherency.co.uk&#x2F;nightdrive&#x2F;</a>

In a similar vein, check out the js1k 2013 winner entry, &quot;Strange crystals&quot; [0].<p>Also check out the author&#x27;s detailed explanations.<p>[0] <a href="https:&#x2F;&#x2F;js1k.com&#x2F;2013-spring&#x2F;demo&#x2F;1459" rel="nofollow">https:&#x2F;&#x2F;js1k.com&#x2F;2013-spring&#x2F;demo&#x2F;1459</a><p>[1] <a href="http:&#x2F;&#x2F;ehouais.net&#x2F;2015&#x2F;03&#x2F;js1k-2015-part-1-introduction" rel="nofollow">http:&#x2F;&#x2F;ehouais.net&#x2F;2015&#x2F;03&#x2F;js1k-2015-part-1-introduction</a>

This reminded me of Night Driver for Apple II:<p><a href="https:&#x2F;&#x2F;youtube.com&#x2F;watch?v=l0nkMGyfYO8" rel="nofollow">https:&#x2F;&#x2F;youtube.com&#x2F;watch?v=l0nkMGyfYO8</a>

Nice but I usually turn my lights on when I drive at night :-)

Well, that&#x27;s beautiful. I remember a procedurally generated night city skyline demo that was on HN years and years ago, this is a somewhat similar endeavor.

I miss seeing little projects like these that don&#x27;t serve a purpose, but just <i>look</i> neat. I love it! I hope to see more &quot;demos&quot;!

Very cool. One &#x27;flaw&#x27; that immediately strikes me as cool is that the cars are transparent — so, for instance, when a car passes you between you and the oncoming traffic, you see the taillights, but also the oncoming headlights&#x2F;streetlights are not obscured by the car. So it&#x27;s sort of disembodied headlights and taillights, which makes the effect even cooler... fun!

Representing cars as just two lights is so simple yet so effective. I&#x27;ve toyed with a slightly similar idea as well: <a href="https:&#x2F;&#x2F;ezhik.me&#x2F;beyond184&#x2F;" rel="nofollow">https:&#x2F;&#x2F;ezhik.me&#x2F;beyond184&#x2F;</a><p>There&#x27;s also a screensaver out there which generates an entire little city, with neon branding on buildings and all.

Thats’s awesome. Kind of reminds me of this vector-y 80s game I had as a little kid - the Tomy Turbo [1]. I’ve been trying to make something similar myself but keep pushing it aside. Anyways, nice work - it looks great!<p>[1] <a href="https:&#x2F;&#x2F;m.youtube.com&#x2F;watch?v=1aCeg-EbOAI" rel="nofollow">https:&#x2F;&#x2F;m.youtube.com&#x2F;watch?v=1aCeg-EbOAI</a>

In demo terms it&#x27;s an &quot;effect&quot;.

I just loved how the author explained writing code without using any specific code. That&#x27;s clever, lovely done!

Weirdly I had the idea to do the same thing, including doing it in js, a year or so ago. This is much nicer than what I&#x27;d pictured. Mine would&#x27;ve been set to Kamasi Washington&#x27;s Clair de Lune.<p><a href="https:&#x2F;&#x2F;youtu.be&#x2F;KqJJ-2cRR0M" rel="nofollow">https:&#x2F;&#x2F;youtu.be&#x2F;KqJJ-2cRR0M</a>

Love it. It gave me a bit of that early-internet &quot;wow, this is really cool and new&quot; feeling. Thanks.

Love this, including the music, but here&#x27;s an old favorite track of mine that would also fit: <a href="https:&#x2F;&#x2F;music.youtube.com&#x2F;watch?v=zkQaLv7mEcI&amp;feature=share" rel="nofollow">https:&#x2F;&#x2F;music.youtube.com&#x2F;watch?v=zkQaLv7mEcI&amp;feature=share</a>

Love it.<p>Might be a good thread to ask. A few years ago I found a couple of sites that were like shadertoy but for 2D canvas shit like this. One I think was codegolf.tk (which appears to have disappeared), and I can&#x27;t for the life of me remember what the other was.<p>Does anyone know of any such sites?

I love this. I&#x27;d love an idealized version where nobody ever passes on the right even more.

This gentleman made a great web game for the UK TV show, Countdown. Been using it for years...<p><a href="https:&#x2F;&#x2F;incoherency.co.uk&#x2F;countdown&#x2F;practice&#x2F;" rel="nofollow">https:&#x2F;&#x2F;incoherency.co.uk&#x2F;countdown&#x2F;practice&#x2F;</a>

I enjoyed reading this as much as I enjoyed watching the demo. Both the demo and the writing style are simple and calming, I didn&#x27;t even notice that the cars were on the wrong side of the road until I saw the TLD ;)

&gt; It&#x27;s not a screensaver, because it&#x27;s not the 90s<p>What&#x27;s funny is that screensavers may end up coming back into vogue if OLED displays continue to have burn-in issues. Ray-traced flying toasters may be in our future.

This is really nice. I&#x27;d actually love it as a screensaver&#x2F;background.

Very nice!<p>Not exactly the same thing, since it&#x27;s a high-paced action game, but I was always fond of the DOS game Skyroads, which has a similar aesthetic. (I believe someone has now made a web-based version called OpenRoads.)

It’s 11 o’clock at night and this is absolutely perfect. Bravo on the music version.<p><a href="https:&#x2F;&#x2F;incoherency.co.uk&#x2F;nightdrive&#x2F;" rel="nofollow">https:&#x2F;&#x2F;incoherency.co.uk&#x2F;nightdrive&#x2F;</a>

<p><pre><code> &gt; What game can we make where the premise is that you&#x27;re a &gt; passenger on the motorway at night time? </code></pre> The same game passengers on the motorway already play. Punchbuggy yellow!

Lay-by by Tennyson complements the simulation quite well<p><a href="https:&#x2F;&#x2F;invidious.flokinet.to&#x2F;watch?v=3FfOsXr9rvw" rel="nofollow">https:&#x2F;&#x2F;invidious.flokinet.to&#x2F;watch?v=3FfOsXr9rvw</a>

Relaxing except the cars are driving on the wrong side, at least for me.

See also this very natty shadertoy demo <a href="https:&#x2F;&#x2F;www.shadertoy.com&#x2F;view&#x2F;MdfBRX" rel="nofollow">https:&#x2F;&#x2F;www.shadertoy.com&#x2F;view&#x2F;MdfBRX</a>

I remember when I was very young I wrote something much simpler using PRINT and GOTO. Hand drawn formula car (drawn using &#x2F;\ [] and |) would scroll indefinitely in a simple loop.

It would be really neat to create a variation of this that simulates driving through mountain roads -- starry night sky, dark mountain silhouettes, the occasional cabin light...

I&#x27;d call this a &quot;demo&quot; for sure -- harkening back to the mid-90&#x27;s when people built things for fun &#x2F; just because they could &#x2F; to explore

Would be a nice &quot;game&quot; experience with VR googles

Very nice!<p>I thought this would be about the Atari game with paddles… lol

It might be nice to have something like this with very, very limited interactions to run in the background while programming or whatever.

It&#x27;s superb! Only needs city lights now. Think of driving up the hill next to a city. And then less cars. That would be soothing.

Yes, it&#x27;s a demo, welcome to the Demoscene™

Was lot of fun staring at it for a long time. However, every driver using turn signals when they change lanes is not realistic :)

I would love to see someone making a video of this and put it in stable diffusion to generate a even more synthwave experience.

&gt; if your browser runs JavaScript:<p>I don&#x27;t understand this remark. What browsers do people use that don&#x27;t have javascript?

Was that a helicopter I saw? Couldn&#x27;t find anything about it in the source or discussion... nice touch!

I feel this isn&#x27;t complete without mesmerizing shadow patterns from streetlights on dashboard.

Saw it for a min. Nice.<p>Then I bumped into the car in front of me which was changing lanes. Not nice.

This is wonderful, well done. The limitations you mention just add to the style.

Very very nice, but I don&#x27;t like that the cars are transparent

Please allow the lanes to be reversed, we drive on the right side

It would be great to have the car I am in have headlights:)

transform: scalex(-1);<p>It&#x27;s beautiful art. The code too. Great work.

The music should be Kraftwerk&#x27;s “Autobahn” :)

I don&#x27;t know why, but this is so cool.

This is real art! Much more than SD

Reminds me of the San Mateo bridge

i&#x27;m desperately mashing my keyboard hoping that some button would allow me to drive

&gt; Maybe it&#x27;s a &quot;demo&quot;?<p>Yep!

This is awesome, good job!

Excellent vibe. Good art.

what an amazing concept. Thank you for making this!

nice, had a flash back of LSD, sweet old days.

Fun, but backwards! Wish I could toggle right-hand drive

No headlights?

I love this.

I love it

Kudos !

Hugeeeeee vaperware vibes right now

its art

This is art. If a pile of bricks wrapped in paper, or a lump of decaying meat in a box is art, then this is art.

edit: nvm

&gt; It&#x27;s hard to classify what it is. It&#x27;s not a video, because it&#x27;s generated dynamically. It&#x27;s not a game, because you just watch. It&#x27;s not a screensaver, because it&#x27;s not the 90s. Maybe it&#x27;s a &quot;demo&quot;?<p>You know, even men are allowed to just make Art.

<a href="https:&#x2F;&#x2F;github.com&#x2F;jes&#x2F;nightdrive" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;jes&#x2F;nightdrive</a>

As German, the thing that annoys me after 5 seconds is that the driver is overtaken on the right side and does so himself ... Hate it

BTW, while we may think that driving is a universal thing, I instantly found it amazing how North American this is. From the integrated indicators, to cars passing on your right, to the road lights and even how the road undulates. Having said that, great project!<p>Edit: Well I got this entirely wrong and missed that this was meant to be lefthand traffic. (I caught a segment that looked more like there was an independent road passing an interstate crossing a city, rather than being opposite lanes.)