Show HN: Minimal 3D creative coding tool – control 8×8×8 dots with JavaScript

Repeatedly click the dots for a tutorial, click and drag to rotate, and – after writing a function of your own – hit &quot;enter&quot; to generate a shareable URL!<p>The source code can be found here: <a href="https:&#x2F;&#x2F;github.com&#x2F;doersino&#x2F;tixyz" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;doersino&#x2F;tixyz</a><p>Let me be clear: This thing is wholly derivative, merely adding a third dimension to Martin Kleppe&#x27;s excellent creative code golfing tool tixy [0] (which you should definitely check out if you find yourself liking this 3D variant of it) by mashing it up with David DeSandro&#x27;s equally-excellent 3D library Zdog [1]. Those two deserve any and all credit.<p>[0]: <a href="https:&#x2F;&#x2F;tixy.land" rel="nofollow">https:&#x2F;&#x2F;tixy.land</a> and previously discussed at <a href="https:&#x2F;&#x2F;news.ycombinator.com&#x2F;item?id=24974534" rel="nofollow">https:&#x2F;&#x2F;news.ycombinator.com&#x2F;item?id=24974534</a><p>[1]: <a href="https:&#x2F;&#x2F;zzz.dog" rel="nofollow">https:&#x2F;&#x2F;zzz.dog</a> and <a href="https:&#x2F;&#x2F;news.ycombinator.com&#x2F;item?id=20036169" rel="nofollow">https:&#x2F;&#x2F;news.ycombinator.com&#x2F;item?id=20036169</a>

My best:<p><pre><code> tan(i*t&#x2F;999)*(~~(t*24%7)==i%7) </code></pre> <a href="https:&#x2F;&#x2F;doersino.github.io&#x2F;tixyz&#x2F;?code=tan%28i*t%2F999%29*%28%7E%7E%28t*24%257%29%3D%3Di%257%29" rel="nofollow">https:&#x2F;&#x2F;doersino.github.io&#x2F;tixyz&#x2F;?code=tan%28i*t%2F999%29*%2...</a><p>Play with the frame rate (&quot;24&quot;) for some interesting effects.<p>Edit: One more:<p><a href="https:&#x2F;&#x2F;doersino.github.io&#x2F;tixyz&#x2F;?code=sin%28i*t%2F999%29*%28%7E%7E%28t*24%259%29%3D%3Di%259%29" rel="nofollow">https:&#x2F;&#x2F;doersino.github.io&#x2F;tixyz&#x2F;?code=sin%28i*t%2F999%29*%2...</a>

This is so cool! Great job.<p>sin(i+t) : <a href="https:&#x2F;&#x2F;doersino.github.io&#x2F;tixyz&#x2F;?code=sin(i%2Bt)" rel="nofollow">https:&#x2F;&#x2F;doersino.github.io&#x2F;tixyz&#x2F;?code=sin(i%2Bt)</a><p>If you stop that one rotating with the mouse, it&#x27;s some kind of brain-damaging illusion. Or thousands of illusions, most of which do something weird to your eyes–it looks very different from different angles. Hmm that is such a great way of generating (2D) optical illusions!

I think this would might better with a slight perspective transformation, at least for some effects - sometimes the 3d is hard to appreciate.<p>Also once you drag manually there is no way to put it back into auto-rotate mode. It would be great if there was a bit of momentum when you drag - it should carry on at the speed you dragged it.

Inspired by tixy.land, I recently made a simple game engine with 16x16 animated “pixels”. We used it as an in-class activity during the last week of the semester.<p><a href="https:&#x2F;&#x2F;github.com&#x2F;AZHenley&#x2F;wiggleface" rel="nofollow">https:&#x2F;&#x2F;github.com&#x2F;AZHenley&#x2F;wiggleface</a>

Did you fix the bug in the tixy.land code where one could inject as much code as wanted via location.hash?<p>Here is the post from when I discovered it:<p><a href="https:&#x2F;&#x2F;news.ycombinator.com&#x2F;item?id=24980221" rel="nofollow">https:&#x2F;&#x2F;news.ycombinator.com&#x2F;item?id=24980221</a><p>Edit: no, that still works, here is an example:<p><a href="https:&#x2F;&#x2F;doersino.github.io&#x2F;tixyz&#x2F;?code=eval(%27%2F*%27%2Bparent.location.hash)#*&#x2F;Math.abs(x+y+z-t)%2-1" rel="nofollow">https:&#x2F;&#x2F;doersino.github.io&#x2F;tixyz&#x2F;?code=eval(%27%2F*%27%2Bpar...</a>

Old ambulance light: <a href="https:&#x2F;&#x2F;doersino.github.io&#x2F;tixyz&#x2F;?code=%28Math.random%28%29%29-Math.sin%28t*6%29-.5" rel="nofollow">https:&#x2F;&#x2F;doersino.github.io&#x2F;tixyz&#x2F;?code=%28Math.random%28%29%...</a><p>Edit: i just figured out that t is a float, I thought it was the seconds as an int.<p>Edit 2: if anyone reads this, try to make a barbershop type thing.

I love this project.<p>but also, if you are sensitive to flashing lights, this web page has 512 of them.

I&#x27;ve wanted to build a LED cube [1] for a while, but just haven&#x27;t had the time to get to it yet. This is basically a virtual version of the same thing, very cool. And significantly simpler to experiment with before committing to several days of soldering.<p>[1] <a href="https:&#x2F;&#x2F;www.instructables.com&#x2F;Led-Cube-8x8x8&#x2F;" rel="nofollow">https:&#x2F;&#x2F;www.instructables.com&#x2F;Led-Cube-8x8x8&#x2F;</a>

ha, awesome! I love how minimal the whole approach is<p>I call this, &quot;Sweeping Vertigo&quot; <a href="https:&#x2F;&#x2F;doersino.github.io&#x2F;tixyz&#x2F;?code=tan%28i%2Bt%29*random%28%29%2F%2812.5-t%29" rel="nofollow">https:&#x2F;&#x2F;doersino.github.io&#x2F;tixyz&#x2F;?code=tan%28i%2Bt%29*random...</a>

Jelly: Math.random(1)<p><a href="https:&#x2F;&#x2F;doersino.github.io&#x2F;tixyz&#x2F;?code=Math.random(1)" rel="nofollow">https:&#x2F;&#x2F;doersino.github.io&#x2F;tixyz&#x2F;?code=Math.random(1)</a>

There can be a real-life 2D version of this: it probably can be integrated to an Arduino project using a LED 8x8 Red Dot Matrix Display (piece code MAX7219).