In case it isn’t obvious…

March 6th, 2012 · No Comments

Since 2010 I have been working with Google as a designer on next-generation Android. I made the decision to end okdeluxe as a commercial entity since the opportunity to join Google and Android was too good to pass. I’ve kept the site alive (and will keep doing so) since it has both sentimental value but also serves as a reference point from my past. I had a great time, had some incredibly talented collaborators and some superb clients. I never got around to write this message to say thanks to everyone that played a part in keeping the okdeluxe ship sailing. Thank you!

So, in case it isn’t obvious - okdeluxe is closed for business and there are no internships or open positions to apply for. Maybe some day I’ll revive this site as something fresh and interesting, I might even write regular blog posts about experiments and code again… or get around to finishing the documentation of all the projects on the site (ha!). Time will tell.

→ No CommentsTags: code driven graphics

Unsung Heroes of Tour de France pt. 2

July 12th, 2010 · 1 Comment

Now that Tour de France 2010 is well on it’s way I’ve tweaked the app to now show this years data. Since last post I’ve also added some little tweaks to indicate the profile of each stage - most of the stages are insignificant at this size but you can clearly see the Alps (visible in the crop below) and the Pyrenees.


Before entering the Alps, the top riders pretty much followed each other - except for the extraordinary rides of  Sylvain Chavanel who managed to get the yellow jersey twice in the first week. Full size screenshot here.


But, as many say, the race doesn’t start until we hit the mountains - and this year certainly wasn’t any different. After the insane stages this weekend the riders have now been scattered all over the graph. Full size screenshot here.


I still have a bunch of things I’d like to add in before releasing the app for you to play with, hopefully a few more evenings here and there should get it to a state of alpha release worthiness! Watch this space.

→ 1 CommentTags: experiments · open source · okdeluxe · processing · code driven graphics

Unsung Heroes of Tour de France

July 1st, 2010 · 1 Comment

Tour de France 2010 is about to start and I wanted to share a (work in progress) info visualisation project I’ve been working on (the data used below are the results from TDF 2009).In ‘le grande’ race, there’s a tendency to focus on the top riders, even sometimes only on the top 10-15 riders, and while this sure is what makes for a thrilling race (and good media coverage) I wanted to understand what is going on during the race for the rest of the 100’s of riders. Some struggle, others shine briefly during one or two stages while some decide to call it quits before getting to Paris.tdfviz_crop.jpgThe software I’ve built is to understand the race dynamics of the unsung heroes - all the riders who are NOT heavily covered by media, and who are, in a sense, only there to support the big names. That said, they still perform an outstanding athletic achievement worth exploring and visualising.Screenshot of app showing all riders (most cropped outside the scope of the window).tdfviz_app_all.jpgSample rendering of the top 25 riders (with larger spacing on y-axis to visually enhance the time differences).tdfviz_app_top25.jpgThe software grabs data from all stages and all riders and displays each rider as a line. The main focus is the time difference and the gaps that appear - and what I found fascinating is how this clearly shows when the race hits the mountains (where the lines explode downward as the time difference to the leaders grow) and in other places where a group of riders get away from the leader group and finishes the stage a fair bit ealier than the rest, thus advancing upwards on the graph.The time differences are massive, this shows all the riders vertically spread out by time difference (each yellow horisontal line is 5 minute increments).tdfviz_full_picture.jpgAll the data is being pulled from a Google Docs spreadsheet, manipulated by Processing and the exported as a PDF.This is work in progress, hopefully I can put some more energy into it as TDF 2010 progresses.

→ 1 CommentTags: experiments · open source · okdeluxe · processing · code driven graphics

Puckey Portrait Machine

May 18th, 2010 · 2 Comments

When I first started writing generative graphics code as a student, I spent hours trying to decipher existing work, I wanted to understand how certain mechanics were built, simple things like attractions, avoidance, movement along a curve, simple physics… etc. The list seems endless and I have from time to time found myself back in the mindset of my student days, trying to work out how existing code pieces are built to then add this particular technique to my toolset. In a way it’s similar to the way much design was taught in the old days, you study with a master of the field and in due time, you move on and create your own footprint.

This brings me to Delaunay (and of course, Voronoi - but I’ll get to that in more detail in another post).

Jonathan Puckey has been making amazing work with Jürg Lehni’s Illustrator plugin Scriptographer. In particular I have been (for a while now) fascinated with the Delaunay Portraits series. With a custom Scriptographer script, you can create simplified renderings of an underlying image.

So I built the ‘Puckey Portrait Machine’ in Processing.


I wanted to understand the dynamics of the Delaunay-Voronoi relationship and I wanted to learn to control it - there’s a certain beauty in exploring mathematics from a naive standpoint, poking at it, changing variables adding bits to see if it breaks. I still do this some times. But in this learning exercise I wanted to gain control and be specific.

I made it a point to try and hit Puckey’s style and aesthetic as close as I could to ensure I was harnessing the mathematics correctly (and not just blindly creating some random, accidental experiment). So far the software has two main drawing modes.

Manual Drawing


In this mode, you manually place each point with the mouse, this adds the control needed to get to the aesthetics that Jonathan Puckey has in his work, and this was my initial aim.

Following this, I wanted to experiment with more automated renderings, so I wrote a mode to automatically fill the screen with points. This saves a lot of mouse clicking, but complete takes away the ability to control the output. As expected a series of random points on a screen are distributed fairly evenly which results in a muddy and not too interesting result.

Automated Drawing


I wanted to have the ability to add more detail to certain places of the geometry while keeping the overall randomly generated state mesh. This would allow me to add detail to iconic parts of the face, like eyes and lips.

Adding Detail


All of these can of course be exported out as Illustrator vector files and printed in huge formats and in such, they very much relate to the original software piece by Puckney.

→ 2 CommentsTags: experiments · processing · code driven graphics

Book: Form and Code

April 13th, 2010 · No Comments

In the fall 2010 the ‘Form and Code’ book will be published, the list of contributors are pretty impressive and my collaborate project with Enrico Bravi and Paolo Palma, the ORTHO-TYPE typography software, is featured in it. Exciting.

See the full list of contributors on the book website.


→ No CommentsTags: publications · experiments · online · processing · code driven graphics

Interface Design patent issued (US).

April 13th, 2010 · Comments Off

Patent processes are long-winded - and so this post relates to some rather old work I did while employed by IDEO. A couple of weeks ago, T-Mobile USA was issued U.S. patent No. 7,685,530 titled ‘Preferred contact group centric interface’ where I am listed as co-inventor. A similar patent was issued in the UK last year but this one apparently took more time to be issued.


Here’s the abstract:

“A preferred contact group centric interface for a communication device can be used to facilitate communications by a user. The user interface can be arranged to activate from a user’s “home page” on the display, from an idle screen that is accessed after a timeout period expires, or any other appropriate mechanism that activates the preferred contact group centric experience. A user selects the preferred contact group from among an array of the user’s contacts. Once the contact group is configured, a minimal number of navigation/selection features is necessary to activate any number of communication modes available to the contacts. The contact group is configured such that simple and quick navigation between the contact members is achieved. The contact group can be presented in 2D and 3D arrangements, in any number of list or geometric configurations.”

And here is the link to the full patent on the US Patent and Trademark office website. Usually Google Patents have a nicer version (where the images are inserted and you the horrible layout of the USPTO website can be avoided) but it doesn’t seem to be up yet. However, here is the UK patent on Google Patents.

Comments OffTags: IDEO · awards

tangled part III

March 30th, 2010 · No Comments

I’ve spent a bit more time with the tangled experiment. I made the switch from Processing’s built-in DXF exporter to using Nervous System’s Obj Exporter - The FBX library is good but when importing the Processing-generated geometry into Modo, each triangle is a separate entity which makes it difficult to perform any Modo-specific tasks on the form as a whole. The Obj library solves this problem.


I’ve also started adding a bit of volume to the ribbons which comes out nicely when rendered in Modo using an HDR map as lighting. I’m really trying to limit the amount of tweaks I do in Modo but I wanted to push for a ‘plastique fantastique’ look for this so soft edges and HDR was an obvious choice. Here’s the latest iteration of renderings.



→ No CommentsTags: experiments · processing · code driven graphics

tangled part II

March 25th, 2010 · No Comments

Following the experiments in the previous blog post, here’s another round of renderings made using Processing to generate the shape and Modo to render the final images.




→ No CommentsTags: experiments · processing · code driven graphics


March 25th, 2010 · No Comments

This evening I found some time to experiment a bit with some Processing bits that’s been collecting dust in my sketchbook for ages: Spherical ribbons, DXF exports and rendering models in Luxology Modo. Oh my.

First I simply let the ribbons flow around the sphere with long tails….


The output seemed a bit sterile and boring so I added some noise to ribbons heads and allowed them to pause mid-flight (before forming the sphere).

(screengrab from Modo)


And here’s the rendering…


Look, it’s the flying spaghetti monster!

It’s tempting to spend too much time tweaking lights / materials / camera settings in Modo with too little focus on the code generating the shapes - oh well, it was an evening well spent getting my head around linking beginShape(TRIANGLE_STRIP) with Modo’s wonderful rendering engine

→ No CommentsTags: experiments · processing · code driven graphics

Breadcrumbs and KML

March 3rd, 2010 · Comments Off

I’ve been dabbling with GPS ideas lately … hopefully I’ll have time to push one of the ideas into a real project soon. For now, here’s a screengrab of Google Earth showing my trails as I was out testing some GPS logging code last night. Using Google Earth and the KML data format is proving to be quite useful for quick debugging of captured data. Read more about the format here.


Comments OffTags: location based · experiments · okdeluxe