Back in 2004, when I was starting to experiment with OpenGL, I had the idea of creating meshes from scratch. This will come in handy for intros, since this way I won’t be needing to include the meshes’ data with the executable!, I thought.

I would create a simple base pyramidal mesh, and subdivide it until I got something with more vertices and faces, but properly connected (not just a bunch of random points). So I when I had a couple of free days, I came up with a very rough way of creating and subdividing meshes. It was very raw, but I loved that I had done it myself!

At the end, I didn’t use it for any intro at all, but I used the trick in a demo instead, called codecolors (source code, if you’re feeling adventurous). Although it’s hard to notice, since everything was generously blurred (I had recently learned how to get a cheap motion blur effect and was really eager to use it in every single frame!).

Fast forward to 2012. I am learning (tinkering with?) three.js and I wanted to find out how to manipulate vertex data dynamically. I somehow remembered this experiment and where I left it (Next step is playing with the vertices!), and I decided to continue it.

Once I got the basics working, I thought it would be neat to have some way of interacting with the scene–so I added dat.gui, which are the controls on top right. Then I also wanted to save the images, as I once I added controls for altering the look I started getting great imagery! So I added FileSaver.js and canvas-toBlob.js, since browser support for downloading images is still a bit incomplete (so to speak).

And finally I thought: hey, storing images is ok, but what if I want to modify an existing configuration?. So I added support for storing the current configuration via some simple location hash serialising. I am not sure if it’s the best way but it seems to work well enough for now!

Oh, and since I just love text effects, I added a silly text-manipulation thingie to dynamically alter the innerText of the page contents. Just because!

It’s fun to play with all the settings and seeing what happens. I have found myself mesmerised just by looking at the end result. Some images seem really organic; others look very fractal/spaceish to me. (Don’t forget to make it wobbly! –looks like someone is having a discussion inside the pyramid!).

I’m very happy with the end result, and even more about the development process. I can vividly recall the many hours I spent in 2004 dealing with arrays and memory allocation for such a simple task as this one. Quite unproductive, to be honest! But Javascript + WebGL totally ROCK! Also, after so many years of trying to explain what the demoscene and realtime is about, it’s great to be able to demonstrate it in realtime. Yay!

I’ll write about the new “Simple yet Frequently Asked Questions” about three.js that I encountered while doing this experiment… but that will be tomorrow, if you don’t mind!

Have fun! :)

The demoscene is generally considered to be a mostly European phenomenon, so manifestations in other continents are always treated with a certain amount of awe and respect. This is exacerbated by the fact that the first thing we think of when reading Utah is not exactly technology, but Mormons instead.

So without further ado, here’s the jewel, in glorious pseudo-HD:

Its timestamp dates the demo around 1995, so bear with the guys who did this and the technology and knowledge they could have possibly have access to–this was way before we had proper Internet!

I haven’t been able to locate more productions from this two-people group, so that makes this demo their first and last production. But it seems one of the programmers is still doing software related stuff, and mentions the demo in his company page. Nice!

So if you want to run the demo, you can download it from here.
I had to disable the Sound Blaster emulation in DOSBox to get proper sound–it’s as easy as changing

to

in your ~/.dosbox/dosbox-0.74.conf, and save it before executing DOSBox!

It then works fine with GUS. Also, some effects are a tad too fast with many cycles, so something around 10000 should do the trick.

I hadn’t noticed some of the details when I watched it at the party, such as the cube edges morphing into some kind of connected curves after a while, and it’s generally cool to appreciate shades of green anyway. Besides, phosphorescent green is retro, trendy, and I love it!

Here’s the video of the demo live at the party place:

A laptop computer was in charge of playing the audio, computing the visuals and sending them to the laser projector. Initially they were going to generate the audio in real time with a software synth as well, but they ran out of –guess what?– time!

The audio was sent from such computer to the main audio mixer (which was like 30 metres away!) using an Ethernet network cable and a nifty connector he had soldered with a couple spare parts he had around –trust me, this guy is the real McGyver!

Hardware geeks, here’s your pr0n:

or in Marcan’s words:

two galvanometer based servomotors with closed-loop position control [...] The engines (+drivers) come from a kit, the rest is pretty much homebrew (a heavily modified USB 5.1 sound card used as DAC, and the laser itself which is a DealExtreme pointer with its driver replaced by one designed by me). Software is 100% homebrew

(Source: …dos servomotores tipo galvanómetro con control de posición de bucle cerrado… Los motores (+drivers) son de un kit, lo demás es más o menos casero (tarjeta de sonido USB 5.1 muy modificada utilizada como DAC, el láser en sí es un puntero de DealExtreme con el driver reemplazado por uno de diseño propio). El software es 100% casero.)

On the raster to vector algorithm he’s using:

I rendered the metaballs and fire effects in a bitmap and then converted them into vectorial with a superlame algorithm I came up with

(Source: Los efectos de metaballs y fuego de la demo anterior los calculaba en bitmap y luego los pasaba a vector con un algoritmo supercutre que me inventé)

He’s made another test with a different input video (feeding the projector with libavcodec, haha) and the result is pretty nice too.

This is the original video:

All in all, awesome work.

I’m looking forward to their next inventions, and actually we can already have a peek at what marcan’s working on at the moment: the PS3 Linux netbooter, python bindings to chip families I’ve never heard of, and other incredibly esoterical stuff… if it’s odd and/or arcane, it’s surely there!

Since it’s a bit silly to upload the videos anywhere (because they already are somewhere in the internets) and it’s not very practical for watchers anyway, I decided to look for the videos in YouTube and create a playlist. That way I can share it with you, and delete the videos from my hard drive and thus make room in it! Yay! \o/

For the curious and impatient, these are the videos, wilds, demos, etc. in the playlist:

1. Visual Approach to the Aesthetics of Techno by Neuro:Concept
2. HBC-0008: How to use Blender by HBC
3. Craft by LFT
4. Julie by Nuance
5. Memorize your future by Neuro:Concept
6. Making of Shizzle by Team PokeMe
7. Comic Bakery by Press Play On Tape
8. Realtime Demo Wannabe by Maxon
9. Shizzle by Team PokeMe
10. Second Reality 64 by Smash Designs
11. Youscope by TVT

I know it’s an strange mix, but the idea was to show some classics, oddities and very cool things so that people at Euskal would get amazed and inspired for doing nice things for the Wild and Animation compos, whose entries are generally a bit “bland”.

~

The Ministerio de Medio Ambiente y Medio Rural y Marino (Spain’s equivalent to DEFRA) doesn’t get it: the new version of its own cartographic and satellite maps viewer (SIGPAC) will use Silverlight.

Yet another failed opportunity to jump onto the Open Standards wagon. Who’s got the commission for this work?

~

JpegMeta: Javascript library for reading JPEG metadata (includes GPS and EXIF data) from JPEG’s, client-side, using HTML5′s new File API.

~

Fake Plastic Cubes: Gasman surprises us again with some more realtime Javascript goodness. This time it’s a 9K Javascript demo|intro featuring 3D and sound synthesis (!!)

The actual demo has its contents packed in an image using the recently released PNG compression trick, so you can’t use the good old “View page source” to have a peek at the intricacies of his mad creation. However he’s also published the uncompressed code. Plus there’s the accompanying and illustrative blog post.

Exciting times ahead!

~

The Unlibrary –an interesting concept in-between shared office space, a library and a coffee shop. I like the idea, although it looks a tad too claustrophobic for my taste. I personally would remove the computers and replace those big bulky tables with something more cafe-style which invites to more intimate laptop-screen sharing and acquaintance-making. Otherwise it looks like we’re in a uni lab!

Anke Holst is one of the founders of the project — and her front page images look like they’ve been made with Harmony!

~

Most common words unique to 1-star and 5-stars App Store Reviews. It’s not directly applicable to the Android market, because iOS prompts users to rate apps on uninstall (probably the worst moment to ask for a review in the life-cycle of an application), but certainly the behaviour is quite similar.

In our experience, free apps get more reviews, and by pure statistics, more negative reviews too. Paid apps might get fewer reviews, but they are probably going to get nicer, more positive reviews. Unless they’re decidedly bad and people feel robbed.

~

By the way, here’s the new Licensing scheme for Android. The old copy-protection scheme will be deprecated.

~

Foley sound effects –you’ve heard them but you don’t know it yet! Example:

Frozen romaine lettuce makes great bone or head injury noises #