Today: 30 July 2010
Today I was vegetarian all day, even at the BBQ.
Today I attended an Acquia webinar on Drupal 7. It was my first webinar. I almost got tricked into actually raising my hand instead of clicking the 'raise hand' button when asked to raise my hand.
Hookbox (via). For most web projects, I believe implementing any real-time comet features on a separate stack from the rest of the application makes sense—keep using Rails, Django or PHP for the bulk of the application logic, and offload any WebSocket or Comet requests to a separate stack built on top of something like Node.js, Twisted, EventMachine or Jetty. Hookbox is the best example of that philosophy I’ve yet seen—it’s a Comet server that makes WebHook requests back to your regular application stack to check if a user has permission to publish or subscribe to a given channel. “The key insight is that all application development with hookbox happens either in JavaScript or in the native language of the web application itself”.
canto.js: An Improved HTML5 Canvas API (via). Improved is an understatement: canto adds jQuery-style method chaining, the ability to multiple coordinates to e.g. lineTo at once, relative coordinate methods (regular Canvas does everything in terms of absolute coordinates), the ability to use degrees instead of radians, a rounded corner shortcut, a more convenient .revert() method and a simple parser that can understand SVG path expressions! The only catch: it uses getters and setters so won’t work in IE.
nodejitsu’s node-http-proxy (via). Exactly what I’ve been waiting for—a robust HTTP proxy library for Node that makes it trivial to proxy requests to a backend with custom proxy behaviour added in JavaScript. The example app adds an artificial delay to every request to simulate a slow connection, but other exciting potential use cases could include rate limiting, API key restriction, logging, load balancing, lint testing and more besides.
Today I stayed at home and ate 2 persons' share of dinner because I forgot how to cook for one.
Today I cycled to Suzy's for Carcassonne despite the pouring rain, and I didn't get drenched in the end after all.
Today I got back to Oxford from Plymouth and napped all afternoon from train fatigue.
Today I explored Plymouth with Peter, and decided it's just like Singapore.
the Small Person has just come in to tell me that Someone On The Internet is WRONG.
Today I lost my temper on the road again and put myself (on my bicycle) and other people (in cars) in danger. I should have POOR IMPULSE CONTROL tattooed on my forehead.

This beautiful Apple Airport Basestation was my 30th birthday present from my wife, quite possibly one of the best presents I’ve ever had. The gift of wireless. In those days it was 1mb broadband, but it was still exciting being able to work from anywhere in the house.
These days it’s been overtaken by N wireless devices, but it’s such a design classic that it has to be on display. It’s new home is the windowsill next to my desk at Webble Mill.
Today I went to Oxford Go Club with Pavel despite impending rain. I'm becoming more weatherproof these days.
A recent plea on twitter for an Illustrator script has been answered! I needed to export all my artboards as 32bit PNGs (24bit + 8 bit Alpha Channel), with the artboard name as the filename, but Illustrator doesn’t come with a built in method to do this. The closest it offers is the standard export, where it can save all artboards, but it always appends the document name to the start of the filename.
Big hurrays then for Dan Smith for creating exactly the script I needed! It’s already made a big difference to my workflow. If you’d like a copy too, Download Artboards-PNG.jsx. I placed mine in Illustrators Presets/en_gb/Scripts folder to make sure it’s always loaded.
Tagged: adobe, illustrator
A recent plea on twitter for an Illustrator script has been answered! I needed to export all my artboards as 24bit PNGs, with the artboard name as the filename, but Illustrator doesn’t come with a built in method to do this. The closest it offers is the standard export, where it can save all artboards, but it always appends the document name to the start of the filename.
Big hurrays then for Dan Smith for creating exactly the script I needed! It’s already made a big difference to my workflow. If you’d like a copy too, Download Artboards-PNG24.jsx. I placed mine in Illustrators Presets/en_gb/Scripts folder to make sure it’s always loaded.
Tagged: adobe, illustrator
Last night I presented a 5 minute microslot on CSS Filters – excluding older versions of IE from seeing your CSS, and feeding extra styles to specific versions of IE and mobile browsers. The slides (with presenter notes) are now available to download from the new Speaking section.
Jeremiah Grossman: I know who your name, where you work, and live. Appalling unfixed vulnerability in Safari 4 and 5 —if you have the “AutoFill web forms using info from my Address Book card” feature enabled (it’s on by default) malicious JavaScript on any site can steal your name, company, state and e-mail address—and would be able to get your phone number too if there wasn’t a bug involving strings that start with a number. The temporary fix is to disable that preference.
Today I went to Oxford Geek Night and thoroughly enjoyed it again.
What to do when PyPI goes down. My deployment scripts tend to rely on PyPI these days (they install dependencies in to a virtualenv) which makes me distinctly uncomfortable. Jacob explains how to use the PyPI mirrors that are starting to come online, but that won’t help if the PyPI listing links to an externally hosted file which starts to 404, as happened with the python-openid package quite recently (now fixed). The comments on the post discuss workarounds, including hosting your own PyPI mirror or bundling tar.gz files of your dependencies with your project.
Today I felt bad going to Oxford Go Club without Peter. Then I forgot that I would be cycling home alone and went the spooky way, scaring myself with thoughts of ghosts.
[UPDATE] Spatial Search in Apache Lucene and Solr. Spacial search is finally coming (back) to Solr—trunk now supports sorting and boosting by distance.
Easier custom Model Manager Chaining. A neat solution to the problem of wanting to write a custom QuerySet method (.published() for example) which is also available on that model’s objects manager, without having to write much boilerplate.
Three new features for reddit gold. Reddit’s experiments with a subscriber program are interesting to watch. 9,000 people signed up as subscribers without there being any benefit at all, and they’re now being rewarded with the ability to opt out of ads and access to computationally expensive features (like different ways of sorting their own user page) that wouldn’t scale for the entire user base.
Today I got carried away with online shopping and forgot to eat dinner, and even forgot to call Peter!
Today I met up with friends for brunch, and then went shopping, played guitar, played ukulele, played Go, napped and watched BBC Proms on iPlayer. It was a long day without Peter.
simplegeo’s python-oauth2. The Python OAuth library scene is frighteningly complicated at the moment. This seems to be the most actively maintained, and the readme includes working example code for talking to the Twitter API (including integration with Django auth).
Today Peter left Oxford for Plymouth. I felt more sad than I'd expected.
Today I went to the Oxford Go club again. I like everyone there and hope to become a regular.

I recently created a new Ninja character for WooThemes, but this time, the post about the work is on the WooThemes Blog!
Drew Strojny from The Theme Foundry (who I knew from his lovely Traction theme) recently asked me if I’d like to create a new WordPress theme for him. The offer-I-couldn’t-refuse was complete creative freedom, and the opportunity to make the design process visible. That doesn’t mean ‘open’ in the sense of ‘everything being up for discussion with the internets’ (that way madness lies), but documenting the steps as we go.
Everyone has a different workflow, and my workflow isn’t necessarily the right approach for anyone else and vice versa. However, I still love hearing others explain their thought process – the ‘Design Eye’ panels at SXSW spring immediately to mind as being good examples.
So on this blog, and on my dribbble account, I’ll be recording what happens as it goes along. Who knows, it might be fun! It’s the certainly the first time I’ve ever done a project in this way.
Before I go any further, I have to know the constraints. Even on jobs with creative freedom, there are still constraints. On this project there are 2 main ones: budget (which is usually the case) and saleability. It can’t be so esoteric a theme that no only my mum wants to buy it!
The next stage was to come up with an idea. Drew wanted it be something that I would excited about, that I really felt motivated to do. My original thought was something along an 18th century nautical theme, inspired in no small part by my love for the Kraken Rum packaging:

I discussed this with Drew, but the conclusion was that this was too esoteric, limiting the potential audience somewhat, which was fine. So I went away and sketched a more contemporary idea that had been brewing:

It involves a shelf (very subtle white/grey shades, not wood) with a series of ‘cards’ on it. The content is put into these cards and their size is dependent on the browser window. Content could be identified as different types of ‘cards’ (article, photo, video etc.) and each of these would have a slightly different layout.
There would be a fixed top nav and footer, and these would allow for different colour scheme options – a very modern grey/yellow but the background yellow and text colour could be interchangeable for any colour scheme.
As the content would resize to fit the height, scrolling would be horizontal. We’re always told to avoid horizontal scrolling, but I love a challenge! I’m keen to see if I can make it work, especially with what will be a fluid, responsive design.
This a theme that could multiple purposes:
Basically sites with a lot of visual information, rather than text-heavy content. Stay tuned for more developments!
Tagged: shelf
Laughing out loud at a comment by @natbat in some HTML I'm looking through.
Multi-node: Concurrent NodeJS HTTP Server. Kris Zyp’s library for spawning multiple Node child processes (one per core is suggested) for concurrent request handling, taking advantage of Node’s child_process module. This alleviates the need to run multiple Node instances behind an nginx load balancer in order to take advantage of multiple cores.
Today I stayed in and watched TED videos with Peter, it was our last quiet evening in before he leaves for Plymouth on Saturday.

Just as it was with their first album “Alpinisims” , the School of Seven Bells second album ‘Disconnect from Desire’ is in heavy rotation at the moment. It’s another one of those albums that even when I’m not playing it, it’s still playing in my head. Especially the closing number “The Wait”, which is nearing 25 plays in just a couple of days.
There’s already a few contenders for favourite album of the year, but this is the top of the list.
Today I brought Pavel to the Oxford Go club meeting, but it was cancelled due to TED Late Nights using the same venue. Would've loved to gate crash.
Today I had a panic clean-up of my flat after discovering some 50 maggots under the sofa.
Today I bought a cheap £25 bike so I won't have to carry my brompton up and down the stairs whenever I go out.
DNode: Asynchronous Remote Method Invocation for Node.js and the Browser. Mind-bendingly clever. DNode lets you expose a JavaScript function so that it can be called from another machine using a simple JSON-based network protocol. That’s relatively straight-forward... but DNode is designed for asynchronous environments, and so also lets you pass callback functions which will be translated in to references and used to make remote method invocations back to your original client. And to top it off, there’s a browser client library so you can perform the same trick over a WebSocket between a browser and a server.
Diffable: only download the deltas. JavaScript library for detecting and serving diffs to JavaScript rather than downloading large scripts every time a few lines of code are changed. “Using Diffable has reduced page load times in Google Maps by more than 1200 milliseconds (~25%). Note that this benefit only affects users that have an older version of the script in cache. For Google Maps that’s 20-25% of users.”
MapOSMatic. Clever service built on top of OpenStreetMap, which renders double sided city maps with a map and grid on one size and an A-Z street name index on the other. Runs on top of Mapnik, PostGIS and Cairo, with a few thousand additional lines of Python and Django.
Emmenthal = Valley of the River Emme = Emmerdale. Not such a fancy cheese now, are we, my rubber friend?
getlatlon.com commit dae961a.... I’ve finally added an OpenStreetMap tab to getlatlon.com—here’s the diff, it turns out adding a custom OpenStreetMap layer to an existing Google Maps application only takes a few lines of boilerplate code.
I’ve finally been through the entire site, and kicked out any legacy stuff (some of which went back to 2003!) and implemented the new responsive design. Originally, I’d intended to change the layout in the various sections, but in the end I’ve used the same one. After trying the other options, it just felt right.
One of things I’ve changed is a new Goodies section. With the exception of the Hill House font (download link now works!), everything is new, including brand new desktop and iphone(4)/mobile wallpapers.

Another new goodie is a little labour of love: The Icon Reference Chart. Fed up of checking various sources to get the information I needed, I started compiling it all together in one table. I’ll add to and improve this chart over time.
Tagged: hicksdesign, updates
Today was my birthday. I received many delightful presents and Peter made me a Monkey Jump cake.
Every content management system needs its query builder—an application which creates customizable lists of content elements and present them in a similarly customisable way. Customization will be typically through an admin interface on the website, and the query builder can be as basic as a text box for SQL or as complex as a many-layered GUI across multiple webpages. Drupal, for its part, has Views. D5 has Views 1, D6 has Views 2, and it looks like the forthcoming Drupal 7 will have Views 3.
However, as the criteria for list-building get more and more complex, there will come a point where custom code will produce the exited result far more quickly and efficiently than Views. The problem for the developer is: while simple lists are obviously candidates for Views; and riotously tangled layouts are obviously candidates for your own modules and SQL; how do you cope with the middle ground? How can you tell from the outset that a particular problem will land you in a Views-only cul-de-sac?
Well, I contend that the individual developer needn't worry, so long as he's clued up about developing with, not outside, Views. I reckon that the middle ground can almost always be bridged by Views augmented with custom code; unless you're completely convinced from the start that, say, the logic of what you want is not representable in a query builder, you can start with Views and tweak with customisations later.
But to be sure you can extricate yourself from any small to medium tiger traps that "Views+your spec" might drop you in, it's wise to know in advance the full range of tools at your disposal. Here are five of what I consider the most important tricks for building a complex Drupal view.
If you've started building your listing page with Views, but the spec has ended up getting more complicated, try each of the five solutions above in turn. When the problem at hand suddenly gets a whole lot more complicated, escalate your solution's complexity by moving another step down the list!
There's obviously a lot more to developing with Views than a single blogpost could ever really summarize without turning into an extended essay. But there's a lot more documentation out there—although of a pretty sprawling and hard-to-navigate sort—and the tips above should hopefully give you pointers both for where to start your extending of Views, and also what to google for when you get stuck. Have fun and good luck!
The next Oxford Geek Night is on Wednesday 21 July, in less than two weeks' time. I for one am really looking forward to it.
We managed out of sheer luck and cheek to bagsy a fantastic speaker for OGN18, the ever-Interesting Russell Davies. Russell was the organizer of the 2007 and 2008 Interesting conferences, and is involved in lots of fantastic projects, including Speechification and Newspaper Club. He's also a writer for Wired, a speaker at many conferences including Lift 2010, and what one might frivolously call a futorologist or pundit. He's going to talk about his experiences turning internets into print, and what he's learned from doing it as part of projects like the Newspaper Club.
Along with our keynote speaker we've got half a dozen of the absolute best of local microslot volunteers. There's talks on topics as far ranging as "designing backwards", linked data, graphing 19th-century social networks, genomics, CSS and Rotacoo's Spotify #fridaymix tape. A few new faces and a few established (and deservedly so) local faces. As always we'll be putting video up on the site afterwards, so there'll be a permanent record of our high-quality speakers.
Finally, we hope to have space for the Pitches - our sixty-second open mic slots that anyone can volunteer for, even on the night - and a book raffle. All told it should be a great excuse to saunter over to the Jericho Tavern in the July sun / sudden downpour (delete as applicable.) Hope to see all the other Oxford geeks there.
How we deploy new features. GitHub are experimenting with using Redis for configuration management. I’ve been thinking about this recently too—managing feature flags feels like an ideal use-case for Redis, since it lets you read multiple values on every page access without adding a bunch of extra read traffic on your regular database.
Today Peter treated me to a fabulous gourmet dinner at The Fishes to celebrate his new job and my upcoming birthday.
One of Textpattern’s drawbacks has always been that page templates are saved in the database. Editing them means using the textarea in the TXP admin interface, but I’m sure most people would prefer to use their favourite text editor.
Here’s a workaround that works in TXP 4.2.0 (I haven’t tried other versions).
<txp:php>echo parse(file_get_contents(txpath.'/pages/template.php'));</txp:php>
From there on in, you can edit the php file. There may be a performance hit doing this, but all TXP tags work. Much easier!
Tagged: textpattern, tips
Today I had been thinking about my past again. I do that whenever I make new friends, as if I want them to feel sorry for me and give me a pat on my back for having turned out fine. Is this what they call self pity?
With the iPad and iPhone 4, there are as many, if not more, different size icons to create for iOS than there are for desktop apps. While there are plenty of templates and reference sheets for Photoshop users (see Cocoia) I prefer to use Illustrator CS5 to create mine. So I’ve made my own template, and it’s available here if you find it useful too!

The top layer of the file contains labels and a mask to add the rounded corners of the icon. Don’t forget to hide these before you export.
Something that Apple doesn’t include in it’s documentation are the various corner radius dimensions for all the icon sizes. This information has been compiled thanks to investigations of Sarah Parmenter and Tim Van Damme.
It’s best to create the artwork with 90° corners and let the OS round them off, but there is a mask layer to help you check how it would look. The mask also uses the appropriate colour for the context – white for the app store, black for the home screen and light grey for the spotlight results.
Also the icon that iOS uses for spotlight results on the iPad is trimmed by 1px around the edge. So while the artwork still needs to be supplied as 50px, the visible area is only 48px, and the guides reflect that, while the rounded corner mask stays at 50px.
The icons are all set out on their own artboard, so when you’re ready to export check the ‘Use Artboards’ option to get each icon as an individual file:

While I’ve worked hard to make sure this template is as accurate as possible, I can’t guarantee it’s completely error-free. Let me know if you find any bugs, and I’ll update it!
If you’re using CS4 or below, this template may well work for you, but hasn’t been tested and may explode leaving terrible stains. I target CS5 because of it’s the first version that has pixel snapping that actually works!
Tagged: adobe, icons, illustrator, resources
Today I ate biscuit, cake and fruit for breakfast, lunch, tea and dinner.
S.Korea ends Microsoft’s online shopping monopoly. The crazy rules mandating Active X based encryption for government and e-commerce sites have finally been dropped, after the Korea Communications Commission found them “unfit for a new Internet environment involving smartphones”.