My friend Max showed me Quasicrystals for the first time recently. If you’re interested the theory behind them, in the  this guy explains it really well. There have been a lot of different versions online, so it can be a bit of a challenge to make something different.  I’m using time delay to make it, so the faster the movement, the more colourful. I’ve got a couple of my favourites on my tumblr site, but I’d love to see what you can do too!

More webcam effects! This is a glitchy take on a method of diffusion called “Error diffusion.” To use, enable the webcam and point it at your face. Play with the sliders to alter the effect.

Progress is awesome. In computing it means more storage, faster transfer and processing. That opens up new possibilities, and it means that old limitations quickly cease to be an issue.

That’s the thing, though: limitations are interesting. The warm feelings people have for 8-bit imagery is partly nostalgia, but it’s also about the novel solutions that were required to portray things that were beyond the capability of computers to describe.

One such limitation is called ‘colour depth.’ Computers can only display a fixed number of colours – nowadays that number is in the millions but it’s not long since it was only two: black and white. In order to show pictures that were a little more expressive than that, computers used ‘dithering,’ a process of alternating between black and white to make patterns in shades of grey. It’s a fascinating problem that has had a number of brilliant solutions, none of which are of much interest now that computers can display enough colours to avoid it. I was interested in exploring that limitation and I hope you like the result. I’ve also posted some of my favourite results on my tumblr blog.

Since my last post I have delivered my first project at the ever-impressive Resn! It’s really refreshing to be working with so many talented people on interesting gigs. The project was the FedEx Enchanted Forest website, which was designed to accompany their television commercial currently airing in the USA. It was a lot of work but I’m really happy with the results, and I look forward to the future there!

This has been a while in the making because I work at Resn now! I’ve have joined their team as ‘interactive experience developer’, which is going to be a great challenge and a lot of fun. This post was borne out of a love for pixel isometric as practised by masters like quickhoney and eBoy. I’ve tinkered with pixel isometric for a long time and have always enjoyed the results, but find the actual process of making iso images to be a lot more tedious than it needs to be. Bret Victor makes the point that this tedium actually stifles vast amounts of experimentation, and that inspired to make a tool that can help with part of the process – the result is a lot of fun to play with.

In making the isocubes engine I discovered that it’s actually really hard to make jagged edges an pixellated images using canvas! It makes sense – because most people want to draw smooth lines most of the time, it’s sensible to make that easy. When you need those raw pixels to stay jagged, though, you have to re-create a lot of the functionality of a drawing canvas from scratch. For that reason, isocubes is a lot slower than could be achieved using straight polygon-drawing in Javascript. It’s another case where the artifacts of an older mode of production have to be re-created intentionally, like record scratches in an MP3 or the faded colours in an instagram photo.

What can you make with it? I’d love to see! Tag your images with #isocube and we can get a collection going!

 

I like making interactive things that people can use without any special plugins or downloads. I also like to push the boundary of what’s possible with input-output systems and complex graphics. Those two things can be difficult to reconcile on the web – because computers have been designed to run programs that are installed on them, most of these capabilities are locked away to be used on the local system rather than inside a browser. That’s where Flash has been useful over the years. Although it requires a plugin, a lot of people have that plugin and it enables a lot of interesting features.

Both sides of that bargain are changing now, though. On one side, Flash is adding new features like the full microphone input that came in version 10.1 and the accelerated 3D in version 11. That’s great because it increases the breadth of possibility on the web. On the other, the ubiquity of the platform is in decline, though, since Apple have said that Flash will absolutely not be permitted to run in the web browser for iPhone and iPad. To reach a wider audience it’ll be necessary to learn the technologies that are supported on the devices that audience is using.

Toward that end I have been looking in to WebGL. All of the up-to-date browsers except IE9 support it, and it looks like it will be the preferred way to deliver browser-based 3D to Android and iOS devices. I looked into WebGL in 2009 for a project and concluded at the time that it wasn’t ready for widespread use. It was awesome to see on a more recent survey of these technologies that not only is it ready for some applications, but there are some fantastic demos already showing off what it can do. The CSG.js library used above could be used to produce complex objects like buildings or furniture according to parameters. Once these objects are made, you could modify some of the more graphically impressive demos from three.js to display the resulting objects. It’s an exciting time to be developing for the web, and I’m looking forward to playing with more of it.

I recently signed up to an online course called “Model Thinking” by the University of Michigan and it is amazing. It’s all about making use of analytical models to understand things that happen in the world. They set the tone at the start with a neat quote from George E. P. Box: “Essentially, all models are wrong, but some are useful.”

As a programmer, making models is my stock-in-trade. I built the model of a picture that gets cut up and pasted together weirdly in Kaleidoscoper, and I made a simplified model of a musical instrument in an app at work. In both cases, the models exist to bring about some outcome – Kaleidoscoper makes the image so you can see the image or share it on Facebook, the instrument model exists so you can play it like an instrument and show off to your friends. What I hadn’t realized, though, is that these models can be used for predictive or explanatory purposes – and that in order to have this predictive power, the models don’t have to be perfect. I can learn something about real instruments by creating these simple models – I could compare the reported enjoyment of playing an instrument with the number of notes it can play in order to find out whether people want more notes or a simpler instrument. I could measure the difference in complexity between the real instrument and the simulation to see if people want to play something that’s realistic or something that lets them produce music easily. For any given question I’d probably want to use a different model to answer it, but that’s fine – it just means that I don’t have to make one model that answers every question, which would be extremely difficult anyway.

Among the many models that the course talks about is John Conway’s Game of Life. You can’t get very far in computing without encountering a discussion of Life, but I had never gotten around to implementing the algorithm to actually play with it first-hand.  I implemented it this today, and have been captivated by the results despite (or maybe because of) how ludicrously simple the rules are. I love the churning, explosive quality of the wavefronts that open up, and the way that even after a region has been all but cleared, a structure can sweep through it leaving a fresh and seemingly random patch of debris in its wake. The patterns are extremely evocative of early video games and Japanese top-down space shooters in particular. Wikipedia goes into some of the patterns that can emerge from the system at some length, and this kind of Cellular Automaton still an area of active research in computer science and other fields worldwide. Not bad for something with only three rules!

The algorithm does a fantastic job of illustrating two things:
1. Seemingly complex systems can often be controlled by surprisingly simple rules, and

2. There is a world of difference between being aware of something and experiencing it first-hand – computer programs included. There is definitely merit in implementing things you have seen before because you never know what you will learn by getting that much closer. I’m definitely going to continue implementing ‘standard’ algorithms like this to understand them better.

[UPDATE: I have replaced the first app that ran Conway’s Life with a  more general version that supports different rules. Conway’s version is based on three rules:

1. If I am off and three neighbours are on, I will turn on (Born 3)

2. If I am on and two neighbours are on, I will stay on (Stay 2)

3. If I am on and three heighbours are on, I will stay on (Stay 3)

Conway’s life can be described as Born 3, Stay 2, 3 or (B3S23). Try running B0, or B0 S8

Way back in the days of Flash player 10, I started looking into the different technologies available for drawing extruded shapes. At the time, the Flash player could only handle unshaded scenes of about 3,000 polygons before falling over, because it was running entirely on the CPU. Because that wasn’t going to be satisfactory, I concluded that the best available alternative to Flash was Unity3D. Version 11 of Flash has added hardware-accelerated 3D, though, so I wanted to look at whether it’s practical to use it again. Unfortunately, Stage3D – and the things built on it like Away3D 4 – are still pretty new so there are a lot of features still missing that you’d normally expect to be standard. One of those things is ‘complex polygon tessellation’ . Since everything in a 3D engine has to be made out of triangles, it’s necessary to break up more complex objects into triangles before they can be drawn properly. It’s a pretty ubiquitous problem with some well-known solutions, so it’s only a matter of time before someone converts one of those solutions to Flash. In the meantime, though, I want to build complex extrusions!
The code above is using Away3D 4. I’m using the ‘LinearExtrude’ class for the height component of the object, and standard Plane primitives for the caps. The caps have a bitmap texture with transparency on them, which I have generated at the same time as the height component. A bitmap cap has the advantage of having a significantly lower polygon count than a tessellated extrusion cap, particularly for more complex objects, but has the disadvantage that the engine can’t do the same object culling with the cap triangles – because some of the faces are transparent, it has to draw everything that might be behind one of these planes in order to make sure that an object isn’t being incorrectly missed out.  Another downside is the resolution of the cap texture – you can see when an object is too close or when the angle is too oblique that the polygon cap is slightly blurry and doesn’t quite match up with the height component. It’s not perfect, but it’s working well enough to keep going with.

I’m really pleased with how Housifier’s behaviour is working out. It’s tremendously satisfying to see the parts that will obviously fit together to make a working object. Something I read recently made me think that I won’t want to include such a prominent view of the pieces at all. After reading James Bridle’s post on the fact that book publishers are promoting the wrong things, I realized I was promoting the wrong things, too. It’s nice for end users to know that the engineering logic exists, and they may even feel clever for being able to make sense of the pattern. Ultimately, though, they’re more invested in what it’ll be like to have a shelf in their house, what they could put in it and what it’ll look like on their desk. I made a quick model of a bedroom scene to place a shelf in. It definitely proves the point.

Even without filling up the scene with much detail, the mock-up makes the point of the system clear. You can imagine what it’d be like to have it in your hands as a final product. Imagine if you could resize the shelf while it’s on a desk, and put the junk on the table into the cubbyholes. You could even place the simulated shelf in a picture of your real room to see how it fit in with your décor. The prospect of being able to make an app like that is thrilling, but also means starting again with the interface!

Usage: Move the mouse around in the flash window to rotate around the model as it assembles. 

Glitch is pretty cool, both as a musical and a visual aesthetic. I think it formed as a response to so much of our experience being mediated by digital technology. Without noticing, we’ve become extremely familiar with the idiosyncrasies of digital delivery, and developed a sensitivity to what happens when it goes wrong. Anyone who has Windows should try listening to “Welcome to Windows” to see if it makes them feel funny when it gets to the alert sounds.

People like James Bridle and the people at BERG write a lot about post-digital media. Internet artists like Pixelfucks and Quickhoney (both moderately NSFW) cover the discussion visually, too. They like to go into the fact that now that we can do anything with bits and bytes, we can focus on what we want to do, rather than being restricted to what computers and pixels are good at. One of the things that I really like exploring is the impact of some of those old limitations of the digital form, particularly when those previously hard-and-fast limitations become more of a rough guideline, as the transition from 2D pixels to 3D volume pixels (voxels) suggests in a game like Voxatron. Something about pattern diffusion and the textured-but-clean surfaces they produce are extremely appealing. I’ve spent a lot of time in front of this latest experiment and find it very entertaining.

Are there any features of the old digital limitations that you have a fondness for? Has there been any adequate re-examination of what made those features interesting? I loved all the complex dither patterns on the black-and-white mac classic in the 80s and the lurid vibrance of palette-cycle animations in the early 90s.

The first day it was publicly announced it was linked on Reddit, and it ended up getting 1,600 visitors who collectively viewed  twenty-eight thousand pages.   By the end of the night, though, the system that had been used to manage it  had been overcome by a malicious script and the flow of the experience had been destroyed.  Over the next weekend my friend Aidan and I rebuilt a tighter  system using a database. It meant that we could limit the speed that people posted at, but that meant we could also tell who posted them. From there we decided that we could also let people vote on which posts they liked.

While the site lost the initial momentum from the exploit, the improved system captured people’s attention. In the four months it has been online, it has had 3,600 visits, but shown 55,000 pages and the average visitor stays on the site for five minutes. By comparison the average visit on a website is seven seconds – it’s hard to overstate how distracted the average internet user is.

The data that I needed to collect to make the system work also makes for intriguing analysis. With individual ratings you can see which posts are the most popular and which are the most contentious. You can compare the score distribution of all the posts with the subset containing a specific keywords. At present the corpus of data is relatively small so it’s hard to determine clear trends. I’m hoping to expand the system to other places to see how they vary. It’s going to be interesting!