Archive: November, 2010

28

sparkline
                    5th                     10th                     15th                     20th                     25th                     30th
12am    
4am
8am    
12pm            
4pm                
8pm          

Tuesday, November 30th, 2010

Romance has lived too long upon this river

A glanceable indication of the current Thames tide, from James Bridle.

Monday, November 29th, 2010

Hack me with science: a look back at Science Hack Day SF · YDN Blog

An absolutely fantastic write-up of Science Hack Day San Francisco ...as seen through the lens of Stephen Johnson's Where Good Ideas Come From.

The Personal Disquiet of Mark Boulton

A beautiful new responsive design from Mark.

4thamendmentwear

Metallic ink-printed undershirts and underwear. For Americans who wish to assert their rights without saying a word.

iOS Fonts

A handy list of installed fonts on the iPhone and iPad.

Google Prediction API - Google Code

An interesting, if necessarily somewhat complicated-looking, API from Google: analyse your user's past behaviour to predict future outcomes.

Microformat Shiv

Handy! A JavaScript API for accessing microformats in a document, based on Mozilla's implementation for extensions.

Saturday, November 27th, 2010

Adfont Calendar 2010 | A free font every day from Fontdeck

It's a type drawer that's also an advent calendar. Responsive too. Check it every day between December 1st and 24th.

Tuesday, November 23rd, 2010

20 Things I Learned About Browsers and the Web

A delightful online book that makes excellent use of HTML5's history API.

Mashup Breakdown - Girl Talk

A visual representation of each track on the new Girl Talk album.

eVOLVINGoCTOPUS.com » Science Hack Day

A write-up of the "Wearable DNA" hack from Science Hack Day SF.

Sunday, November 21st, 2010

Pattern praise

Two months ago, I called Twitter out on their insistence that developers use OAuth when authorising with Twitter while they themselves continued to use the password anti-pattern when they wanted to peek into third-party address books.

I’m happy to report that Twitter have since fixed this. If you go to the Find Friends portion of the “Who To Follow” section, you’ll now be greeted with links that lead to correct authentication with LinkedIn, Gmail, Yahoo and Hotmail.

Thanks, Twitteroonies!

Meanwhile, Flickr recently launched their own “Who to Follow” functionality. There is nary a password request in sight: they’ve implemented correct authentication right out of the gate for Yahoo, Gmail, Hotmail and Facebook.

Thanks, Flickroonies!

See? I’m not always bitching’n’moaning.

Long Live the Web: Scientific American

An inspiring State Of The Web address by Tim Berners-Lee. He can't resist pitching linked data at the end, but it's mostly a stirring call to arms.

Friday, November 19th, 2010

Mayo Nissen » City Tickets

I really like this idea for connecting cities to the papernet.

Spacelift

My sojourn up the western seaboard of the United States has come to an end. It began in San Diego with the final An Event Apart of the year, which was superb as always. From there, I travelled up to San Francisco for Cindy and Matt’s wedding celebration, followed by a few days in Seattle. The whole trip was rounded out back in California at the wonderfully titled Institute For The Future in Palo Alto. For that was the location of Science Hack Day San Francisco.

It was an amazing event. Ariel did a fantastic job—she put so much effort into making sure that everything was just right. I suspected it was going to be a lot of fun, but once again, I was blown away by the levels of ingenuity, enthusiasm and sheer brilliance on display.

In just 24 hours, the ingenious science hackers had created particle wind chime which converts particle collisions into music that Brian Eno would be proud of, grassroots aerial mapping with balloons which produced astonishing results (including an iPad app), as well as robots and LEDs a-plenty. The list of hacks is on the wiki.

Science Hack Day San Francisco Science Hack Day San Francisco Science Hack Day San Francisco Science Hack Day San Francisco

My own hack was modest in scope. Initially, I wanted to build a visualisation based on Matt’s brilliant idea, but I found it far too daunting to try to find data in a usable format and come up with a way of drawing a customisable geocentric starmap of our corner of the galaxy. So I put that idea on the back burner and decided to build something around my favourite piece of not-yet-existing technology: the .

The idea

Spacelift compares the cost efficiency of getting payloads into geosynchronous orbit using a space elevator compared to traditional rocketry. Basically, it’s a table. But I’ve tried to make it a pretty table with a bit of data visualisation to show at a glance how much more efficient a space elevator would be.

The payloads I’ve chosen are spacecraft. Beginning with the modest Voyager 1, it gets more and more ambitious with craft like an X-Wing or the Millennium Falcon before getting crazy with the USS Enterprise and the Battlestar Galactica.

So, for example, while you could get a TIE-fighter into the Clarke belt using a single , two , or three , it would cost considerably more than using a space elevator, where you’re basically just paying for the electricity.

If you click on the dollar amount for each transport mechanism, you’ll see the price calculated as a tower of pennies. Using a , for example, will cost you a tower of pennies 22 times larger than a space elevator, assuming a space elevator is at least 38,000 kilometres tall/long. Using a space elevator, on the other hand, requires spending a tower of pennies about the same height as itself. I don’t even bother trying to visualise the relative height differences for getting anything bigger than the Tantive IV into orbit as it would require close to infinite scrolling.

I’m fairly confident of the cost-per-kilogram values for the rockets while the is necessarily fuzzy, given that the mechanism doesn’t exist yet. But by far the trickiest info to track down was the mass of fictional spacecraft. There’s plenty of information on dimensions, speed and armaments, but very little on weight. Mathias saved the day with some diligent research that uncovered the motherlode.

Having such smart, helpful people around made the whole exercise a joy. It was quite a pleasure to walk over to a group of hackers, ask Is anyone here a rocket scientist? and have at least one person raise their hand. The constant presence of Cosmos playing on a loop just added to the atmosphere of exploration and fun.

Implementation

I’ve put the code on GitHub, ‘cause that’s what a real hacker would do. It’s my first GitHub repository. Be gentle with me.

There’s CSS3 and HTML5 a-plenty. I deliberately don’t use the IE shim to enable styling of HTML5 structural elements in lesser versions of Internet Explorer; there wouldn’t be much point delivering RGBa, opacity and text-shadow styles to a browser that can’t handle ‘em.

The background colour changes depending on the payload. I’m using a variation of the MD5 colour encoding popularised by Dopplr and documented by Brian in his excellent new book, Designing With Data.

I’m using League Gothic by The League Of Movable Type for the type—ya gotta have a condensed font for data visualisations, right?

There’s also a google-o-meter image from the Google chart API.

Needless to say, the layout is responsive and adapts to different viewing environments …including print.

Spacelift, printed

Using CSS transforms, each page of table of price comparisons becomes a handy page to print out and stick on the office wall to remind yourself why the human race needs a space elevator.

Wednesday, November 17th, 2010

Addressing accessibility | Fix the Web

It'll be interesting to see how this service works out: people can report accessibility problems with any website, and other people can volunteer to help fix the issues.

Monday, November 15th, 2010

Experimenting with responsive design in Iterations - (37signals)

37 Signals document their experiments with responsive web design. Looking good.

Draggables

Watch this space. Glenn has a really interesting idea (and implementation) for exchanging structured data between browser windows using drag'n'drop.

Thursday, November 11th, 2010

All Programs Considered by Bill McKibben | The New York Review of Books

A great piece on the golden age of radio ...which is right now.

Wednesday, November 10th, 2010

HTML5 Forms Validation in Firefox 4 - Mounir Lamouri's Blog

A quick run-through of some of the new HTML5 form features coming in Firefox 4.

Tuesday, November 9th, 2010

The 1140px CSS Grid System/Framework · Fluid down to mobile

A fluid grid that linearises at smaller viewport widths.

Monday, November 8th, 2010

Friday, November 5th, 2010

Drafty

A litte while back, Khoi—who, by the way, has a a book on grid principles for the web coming out soon—asked for some suggestions on Twitter:

Question for bloggers: what tools/methods do you use to manage your queue of future posts and ideas for future posts?

I responded with:

The submit button.

I wasn’t being facetious. I think keeping drafts can be counterproductive. The problem is that, once something is a draft rather than a blog post, it’s likely to stay a draft and never become a blog post. And the longer something stays in draft, the less likely it is to ever see the light of day. Or, as I posted to Twitter as The First Law of Blogodynamics:

A blog post in draft tends to stay in draft.

I have the functionality for draft posts in my DIY blogging software, but I’ve only used it once or twice. But maybe that’s just me. I still don’t really consider this a blog. I find the label “journal” to be more appropriate. And having a draft journal entry just doesn’t seem right.

So I write, and I hit submit. I can always go back and edit it afterwards.

Tuesday, November 2nd, 2010

HTML5 Conformance Test Results

All the tests and all the results, all in one place.

Yet Another Placeholder Generator

Look what Norm! built: it's another placeholder image service, but this is one that you can install and run on your own machine.

Monday, November 1st, 2010

Once Upon a Title

Pervy little stories made entirely from children's book titles.

Split Postage

A nifty idea to help you people save on postage by clubbing together to make a single Amazon purchase.