Tags: rca

32

sparkline

Amsterdam Brighton Amsterdam

I’m about to have a crazy few days that will see me bouncing between Brighton and Amsterdam.

It starts tomorrow. I’m flying to Amsterdam in the morning and speaking at this Icons event in the afternoon about digital preservation and long-term thinking.

Then, the next morning, I’ll be opening up the inaugural HTML Special which is a new addition the CSS Day conference. Each talk on Thursday will cover one HTML element. I am honoured to speaking about the A element. Here’s the talk description:

The world exploded into a whirling network of kinships, where everything pointed to everything else, everything explained everything else…

Enquire within upon everything.

I’ve been working all out to get this talk done and I finally wrapped it up today. Right now, I feel pretty happy with it, but I bet I’ll change that opinion in the next 48 hours. I’m pretty sure that this will be one of those talks that people will either love or hate, kind of like my 2008 dConstruct talk, The System Of The World.

After CSS Day, I’ll be heading back to Brighton on Saturday, June 18th to play a Salter Cane gig in The Greys pub. If you’re around, you should definitely come along—not only is it free, but there will be some excellent support courtesy of Jon London, and Lucas and King.

Then, the next morning, I’ll be speaking at DrupalCamp Brighton, opening up day two of the event. I won’t be able to stick around long afterwards though, because I need to skidaddle to the airport to go back to Amsterdam!

Google are having their Progressive Web App Dev Summit there on Monday on Tuesday. I’ll be moderating a panel on the second day, so I’ll need to pay close attention to all the talks. I’ll be grilling representatives from Google, Samsung, Opera, Microsoft, and Mozilla. Considering my recent rants about some very bad decisions on the part of Google’s Chrome team, it’s very brave of them to ask me to be there, much less moderate a panel in public.

You can still register for the event, by the way. Like the Salter Cane gig, it’s free. But if you can’t make it along, I’d still like to know what you think I should be asking the panelists about.

Got a burning question for browser/device makers? Write it down, post it somewhere on the web with a link back to this post, and then send me a web mention (there’s a form for you to paste in the URL at the bottom of this post).

One day in London

I don’t get up to London all that often—maybe once every few weeks; just long enough for the city’s skyline to have changed again. Yesterday was one of those days out in the big smoke.

I started with a visit to the Royal College of Art to see the work in progress exhibition that’s running until Sunday. Specifically, I wanted to see the project by Monika, who was one third of the immensely talented internship collaboration at Clearleft that produced notice.city. Her current project is called Watching the Watchers, all about undersea cables, surveillance, and audio—right up my alley. I think Ingrid, James, Dan, and Georgina would like it.

Checking out Monika’s work in progress at the RCA. Watching the watchers

After that, I entered a metal tube to be whisked across the city to the Hospital Club, where a room had been booked for a most enjoyable Clearleft event. Anna had organised a second of her roundtable gatherings. This time the theme was “going responsive.”

The idea is to gather people together for one afternoon to share experiences and challenges. Anna invited people from all sorts of organisations, from newspapers to e-commerce and everything in between. Some of them were people we already knew, but most of them had no connection to Clearleft at all.

Everything happened the Chatham House Rule so I can’t tell you the details of who said what, but I can tell you that it was very productive afternoon. Some of the companies represented were in the process of switching to responsive, some had already done it, and some were planning it, so it was a perfect mix.

We began with a variation on the lean coffee technique. Splitting into groups, everyone jotted down some topics that they wanted to discuss. We shared those, grouped them, and voted on which order we would discuss them. Each topic got 5 to 10 minutes of discussion. In my group, we discussed strategy, workflow, tools, and more. We could’ve easily talked for longer. Some outcomes (very badly summarised):

  • The vision and strategy for a responsive redesign needs to be communicated (and sold) up the chain to stakeholders as well as to the designers and developers in the trenches.
  • “Mobile-first” For The Win! Solve the harder problems first.
  • Multi-disciplinary teams For The Win! Works well with Agile too.
  • A pattern libraries is probably the best tool you can have. So pattern libraries For The Win too!

After a break, we switched over in to a sort of open space exercise. Anyone who has a burning question they want answered writes that question down on an oversize post-it and slaps it on the wall. Now we’ve got a room with questions written on different parts of the wall. If you want to take a stab at answering any of those questions, you write it down on a post it note and slap it next to the question. Everyone does this for a while, going from question to question and having lots of good discussion. Then, at the end, we go from question to question, with the person who originally posted the question taking ownership of summarising the answers.

Some of the questions were:

  • How to help people to stop thinking “desktop first”?
  • Should designers code? Should developers design? Or Both?
  • How do you start to deploy a responsive version of an existing site?
  • How do you do responsive ads?
  • What is the best tool to use to create responsive designs?
  • Would every project benefit from a design system? Is it always worth the investment?

You get the idea. The format worked really well; it was the first time any of us had tried it. We slightly over-ran the time we had allotted for the afternoon, but that’s mostly because there was so much meaty stuff to discuss.

Playback

With that productive afternoon done, I made my way to the Bricklayer’s Arms, where by lucky coincidence, a Pub Standards meet-up was happening. I went along for a pint and a chat while I waited for rush hour to ease off: I wanted to avoid the crush before I started making my way back to Brighton. See you next time, Londinium.

100 word 096

It was another beautiful day in Sussex and the other Clearlefties made full use of it by going on a cross-country hike culminating with a well-earned beer’n’food stop in a pub.

I couldn’t join them though because I had band practice: three hours of hammering out Salter Cane songs. This time though, the hammering was a touch lighter. We’ve got a gig in The Greys pub coming up on Saturday, July 11th—come along!—and it’s not the most spacious of venues (to put it mildly) so we tried practicing a bit quieter than we normally would.

Still sounded great.

100 words 075

Today was a Salter Cane practice day. It was a good one. We tried throwing some old songs at our new drummer, Emily. They stuck surprisingly well. Anomie, Long Gone, John Hope …they all sounded pretty damn good. To be honest, Emily was probably playing them better than the rest of us.

It was an energetic band practice so by the time I got home, I was really tired. I kicked back and relaxed with the latest copy of Spaceflight magazine from the British Interplanetary Society.

Then I went outside and watched the International Space Station fly over my house.

100 words 061

I had band practice with Salter Cane today. It’s been ages since the last rehearsal. Our drummer, Emily, has been recovering from surgery on her foot, hence the hiatus.

I was sure that this practice would be a hard slog. Not only had we not played together for a long time, but we’re trying out a new rehearsal space too. Sure enough, there were plenty of technical difficulties that arose from trying to get things working in the new space. But I was pleasantly surprised by how the songs sounded. We were pretty tight. One might even say we rocked.

Overcast and Huffduffer

Marco Arment has released his podcast app Overcast for iOS—you can read his introduction to the app.

It plays nicely with Huffduffer. If you want to listen to any Huffduffer feed in Overcast, it’s a straightforward process.

Step 1

Overcast Add podcast
Launch the app and tap on “add a podcast”. Then tap on “Add URL” in the top right.

Step 2

Add URL Huffduffer URL
Enter the Huffduffer URL e.g. huffduffer.com/adactio.

Step 3

All Podcast episode
That’s it! You’re all set.

It’s pretty straightforward to subscribe to Huffduffer URLs in other iOS apps too. Matt has written up the process of using Huffduffer and Instacast. And there’s also a write-up of using Huffduffer and Downcast.

The Lost Lemonworld

When the always-excellent Radiolab podcast turned its attention to the subject of creativity and motivation in an episode called ‘Help?’, they spoke to Elizabeth Gilbert who reminisced about interviewing Tom Waits on this topic:

He was talking about how every song has a distinctive identity that it comes into the world with, and it needs to be taken in different ways. He said there are songs that you have to sneak up on like you’re hunting for a rare bird, and there are songs that come fully intact like a dream taken through a straw. There are songs that you find little bits of like pieces of gum you find underneath the desk, and you scrape them off and you put them together and you make something out of it.

And there are songs, he said, that need to be bullied. He said he’s been in the studio working on a song and the whole album is done and this one song won’t give itself over and — everyone’s gotten used to seeing him do things like this — he’ll march up and down the studio talking to the song, saying “The rest of the family is in the car! We’re all going on vacation! You coming along or not? You’ve got 10 minutes or else you’re getting left behind!”

Last year the New York Times ran a profile of The National, written while they were still recording the wonderful High Violet—my favourite album of last year. The piece circles around the ongoing problems the band were having trying to tame the song Lemonworld:

Since January they’d done it bright, done it drowsy, done it with violin parts overnighted from Australia by Padma Newsome, done it so many ways Bryce despaired, “It’s a riddle we can’t solve.”

This is exactly what we’ve been going through with Salter Cane. For about a year we had a song that had been defying us, stubbornly refusing to reach that breakthrough moment where it all seems to come together. We took a break from the song for a while and when we came back to it, we tried approaching it as a new piece. That seems to be working. It’s finally coming together.

In the end we realised that we trying to make the song into something bigger than it needed to be. Sometimes it’s okay for a song to be small and simple. That seems to be the case with Lemonworld:

Matt said afterward, “we tried so hard and it always seemed to fail as a rock song. It lost the charm of the ugly little demo. Now it’s the ugliest, worst-mixed, least-polished song on the record, and it took the longest to get there.”

I think that Lemonworld is a strong song. It even stands up to be being butchered by me on the bouzouki.

Lemonworld on Huffduffer

Responsive enhancement

I went along to the fifth Barcamp Brighton on the weekend. It was a truly excellent event, hosted in The Skiff, a great coworking space. Alas, a creeping cold meant that I couldn’t stick around for too long, but I made sure to give a presentation before I bailed.

I spoke about media queries. As you may have gathered from my recent entries, this is something I’ve been thinking about a lot lately.

I didn’t prepare any slides. If I had, they would have consisted of screenshots and CSS, so I figured why not just show the actual sites and CSS instead? It was a fairly rambling, chaotic presentation but it helped me to clarify some ideas. Prem asked if I would reprise the presentation at AsyncBrighton’s JavaScript meetup—on October 28th so that will give me a chance to marshall my thoughts.

In reiterating my point about fluid grids being a necessary prerequisite for responsive web design, I tried to take a long-zoom approach and went all the way back to John’s superb A Dao of Web Design article—now ten years old!

The tool problem

I still feel that most designers haven’t yet fully embraced the web as its own medium, choosing instead to treat it along the same lines as print design. Or, as Mark put it his excellent talk on designing grid systems, designing from the canvas in rather than the content out.

Far too early in the design process, a tool such as Photoshop or Fireworks gets opened up and a new file is created with an arbitrary width (960 pixels being the current width du jour). That process lends itself well to creating paintings of websites but it’s not a great first step in creating a living, breathing website. Experiments like Liz’s Evening Edition not withstanding, what I wrote back in 2006 still holds true:

CSS hasn’t revolutionised web design. The reason lies not with the technology (which is revolutionary), but with the designers using it. Most designers have simply swapped the old technology (tables and font tags) for the new technology, without fully exploring what’s so completely new.

My point is that responsive web design isn’t something that can be tacked on to the end of an existing workflow. It requires a different mindset, one that considers the medium from the outset. If you’re currently thinking in proportions rather than pixels, the transition to responsive web design will be relatively painless. But if you’re stuck in the world of converting PSDs into web pages, you’re going to have a tough time.

I’ve written about the problems with our tools before and Stan has crafted the definitive call to arms for A Real Web Design Application so I’ll spare you another rant.

A new approach

At Barcamp Brighton, I encapsulated my thinking by saying:

Instead of thinking in terms of pixel perfection, we should be thinking of proportion perfection.

Then I showed a bunch of sites I’ve worked on that are using media queries to adapt to different screen sizes: Huffduffer, Salter Cane, St. Paul’s School and UX London.

All of those sites are built in a similar way. First, CSS is used to create the optimal layout e.g. three columns floated alongside one another. Then media queries are used to over-ride those float and width declarations so that the content is linearised.

That’s all well and good but, as someone correctly pointed out during the presentation, what about small-screen devices that don’t support media queries?

That’s an excellent question. The answer requires another shift in perspective. Instead of thinking of the widescreen version as the starting point, why not consider the small screen layout first?

In a way, this is an extension of Luke’s Mobile First exercise — thinking of the mobile experience before building the desktop site.

In his presentation at Over The Air, Bryan Rieger advocated this approach for media queries. As he correctly points out—and this is something echoed by PPK—what we’re talking about here is essentially progressive enhancement.

Instead of just using progressive enhancement to throw in some rounded corners, opacity or gradients, we can apply the same thinking to layout: start with the most basic CSS—colours, fonts, etc.—and then apply floats and widths according to the capabilites of the browser …as determined by media queries.

That’s what I did for the Science Hack Day website and now I’ve decided to take the same approach with adactio.com.

At this point, you might be wondering if I’m going to mention the elephant in the room. You know: the elephant …from Microsoft …elephant versions 8 and lower.

My first thought was to use conditional comments. All browsers get the same stylesheet but elephantine browsers get an extra one which contains the same float and width declarations that are contained in the media queries. But that violates the DRY principle: any time I make a layout change, I would have to remember to make the changes in two different stylesheets. Prem suggested placing an @import rule within the media query to pull in the same stylesheet that IE is getting via conditional comments …but alas, @import rules need to come first in a CSS document.

So, for now, users of Internet Explorer visiting adactio.com will just get the linearised content. I may decide to violate the DRY principle and use conditional comments at a later date.

Revisiting adactio.com

Over the years, I’ve resisted the temptation to do a complete redesign of my site. Instead, I’ve added different designs as options that can be selected from any page on the site. After all, isn’t the whole point of CSS that it’s separated from the structure? Changing the visual appearance shouldn’t necessitate changing the markup; that’s the lesson of the CSS Zen Garden.

So I’ve stubbornly refused to update my markup for almost ten years. But now, what with having written a book on HTML5 and all, I figured I could make a few changes.

The doctype has been updated. Elements that had previously been given IDs are now identified with ARIA landmark roles instead (and referenced in the CSS with attribute selectors). These days, I rarely use IDs for anything other than making document fragments addressable, so it was interesting to see how my past self did things differently.

My past self was also trying to be far too clever with the separation of concerns in the CSS. I was using three different stylesheets for each theme: one for colour, one for typography, and one for layout. In retrospect, this was a bad idea for two reasons:

  1. I’m increasing the number of HTTP requests.
  2. While it might be obvious that font-family declarations belong in the typography stylesheet and background-color declarations belong in the colour stylesheet, it’s not nearly so simple to figure out where margins and paddings should go. Is that layout? Is it typography?

It turns out that a more holistic approach to CSS is far, far easier to work with. It felt good to finally merge those separate CSS files into one.

Oh, there was one more good point raised at the Barcamp Brighton presentation… I had being going on about how assumptions can be dangerous—assuming that the user is visiting your site from a desktop machine, assuming that a large monitor size equates to a large viewport size, assuming that a large browser window means that large bandwidth is available, and so on. Somebody pointed out that, in applying my media queries using pixels, I was making assumptions about equating pixel width to viewable area. An excellent point! For that reason, all the media queries used in the different themes on adactio.com are triggered with ems rather than pixels.

For the record, here are some useful em widths that can be used as trigger points:

  • 40em =~ 640px
  • 50em =~ 800px
  • 64em =~ 1024px

Default

Adactio — default (1440) Adactio — default (1024) Adactio — default (800) Adactio — default (640) Adactio — default (480)

Tate Modern

Adactio — tatemodern (1440) Adactio — tatemodern (1024) Adactio — tatemodern (800) Adactio — tatemodern (640) Adactio — tatemodern (480)

Seaside

Adactio — seaside (1440) Adactio — seaside (1024) Adactio — seaside (800) Adactio — seaside (640) Adactio — seaside (480)

Zeldman

Adactio — zeldman (1440) Adactio — zeldman (1024) Adactio — zeldman (800) Adactio — zeldman (640) Adactio — zeldman (480)

Adactizilla

Adactio — adactizilla (1440) Adactio — adactizilla (1024) Adactio — adactizilla (800) Adactio — adactizilla (640) Adactio — adactizilla (480)

Sci-fi

Adactio — sci-fi (1440) Adactio — sci-fi (1024) Adactio — sci-fi (800) Adactio — sci-fi (640) Adactio — sci-fi (480)

Renaissance

Adactio — renaissance (1440) Adactio — renaissance (1024) Adactio — renaissance (800) Adactio — renaissance (640) Adactio — renaissance (480)

Hirnlego

Adactio — hirnlego (1440) Adactio — hirnlego (1024) Adactio — hirnlego (800) Adactio — hirnlego (640) Adactio — hirnlego (480)

Delivering Sorrow

Hot on the heels of the work for St. Paul’s School, I’ve been tweaking the media queries for the Salter Cane website. I was switching the site over to using HTML5 structural elements anyway, so I figured I’d meddle with the CSS while I was at it.

Once again, the fact that the site was already using percentages made the process very straightforward. Depending on the viewport width, the layout changes from three columns to two columns to one column.

Salter Cane (1440) Salter Cane (1024) Salter Cane (760) Salter Cane (480)

And once again, I didn’t remove any content for small screen devices. The natural language navigation at the top of the page—now correctly ensconced in a nav element—really comes into its own in the linearised layout, allowing for quick access to different sections of the document.

The timing of all this optimisation is fortuitous. The second Salter Cane album has just been released: it’s called Sorrow.

It already has some fans. Shaun said:

The Truth Is Nothing sounds like Leonard Cohen, Johnny Cash and Arcade Fire had a musical transporter accident. can’t stop listening to it.

Lachlan is equally enthusiastic. If you like what you hear, you can buy the physical album from CD Baby or buy the digital album from iTunes. It will be available on Spotify and Amazon soon.

All the songs are licensed under a Creative Commons attribution license which means that they are . I’m looking forward to seeing where they end up.

You can listen to the whole album on the Salter Cane site using a Flash MP3 player. The documentation for Audio Player reads:

To insert a player on the page, place an HTML element and give it a unique ID. This element will be replaced with a player. If the browser doesn’t support Audio Player, the element will not be replaced so use it to show alternative content (maybe a message telling the user to download Flash).

The example code looks like this:

<p id="audioplayer_1">Alternative content</p>
<script type="text/javascript">
AudioPlayer.embed("audioplayer_1", {soundFile: "file.mp3"});
</script>

But rather than using a P element, I used the HTML5 audio element:

<audio id="audioplayer_1" src="file.mp3" controls="controls" preload="none">
</audio>  
<script>  
AudioPlayer.embed("audioplayer_1", {soundFile: "file.mp3"});  
</script>

That way, browsers with Flash installed get the plugin while other devices—like, say, the iPhone, iPod and iPad—get the native audio player.

Audio

Whatever device you’re using, enjoy listening to Sorrow by Salter Cane.

2010-06-25

On Friday, June 25th, three things will happen:

  1. Clearleft will spend the day having some lomography fun around Brighton with Lomokev.
  2. Salter Cane will play a rocking concert with Caramel Jack upstairs at The Prince Albert pub on Trafalgar Street.
  3. HTML5 For Web Designers will begin shipping—the book written by me, edited by Mandy, designed by Jason and published by Zeldman.

HTML5 For Web Designers

June

by Camper Van Beethoven—one of my all-time favourite albums—features the song June wherein David Lowery asks:

Are you weary of the lengthening days?
Do you secretly wish for November’s rain?

Not in the least, David, not in the least. In fact, I’m really looking forward to June, both for its lengthening days and its avalanche of geeky goodness. To whit:

Web Directions @media comes to London from June 8th to 11th. It is pretty much guaranteed to be awesome.

I’ll be fanning the flames once again for the Hot Topics panel. I’ll also be running a workshop on getting Semantic with microformats and HTML5. I love the fact that there are two workshops on HTML5 and yet there’s absolutely no overlap between the two—I’ll leave you to decide whether that’s a testament to the breadth of the HTML5 spec or an indication of just how much is encompassed by the word ‘HTML5’.

The price for the conference goes up on May 15th so you’d better get in there and grab a ticket now if you haven’t already. And just between you and me, if you use the promo code KEITH then you can get a whole hundred squid off the asking price.

If you’re already in London for @media Web Directions, consider sticking around that weekend for the BarCamp. Nothing has been announced other than the dates but .

A week later, on June 19th, is when the geekery really hits the fan: Science Hack Day at The Guardian offices in London! If you haven’t already done so, add your name to the list of potential attendees. Trust me: you won’t want to miss this.

Needless to say, I’ll be updating both here and on the wiki as the event comes together. And it is coming together very nicely: we have a great venue, we have plenty of bandwidth, and we have lots of interested geeks, hackers and programmers. The only thing I need to make sure I can get covered is the hackfuel: food and drink.

The total cost for food and drink will probably be somewhere between £2,000 and £3,000 but I’m hoping to spread that cost amongst a bunch of sponsors. I think £500 should be a nice sweet spot for sponsorship.

If you work for someone—or know of someone—that wants to support a fine event such as Science Hack Day and would consider £500 a small price to pay for the resulting , please get in touch and let me know.

dCapsule

As is now traditional, there will be a BarCamp in Brighton straight after dConstruct. This year it’s happening at a new venue, the Old Music Library in the middle of town—right across from the Brighton Dome, venue for dConstruct. The first batch of tickets went on sale yesterday but there’ll be more to come (if you don’t fancy playing web booking roulette, a sure-fire way of getting a ticket is to contribute to sponsoring the event).

If you’re coming to Brighton for dConstruct, I highly recommend staying for the weekend and sleeping over at BarCamp.

If you’re not coming to Brighton for dConstruct, why not? Haven’t you seen the line-up? It’s going to be fantastic.

Here’s one way to get a ticket; add something to the dConstruct time capsule:

Take a look around you. What do you see that you would like to preserve for the future? Take a picture of it, upload that picture to Flickr and tag it with dconstructcapsule.

The ticket you could win is no ordinary ticket. It’s a VIP ticket that will get you into dConstruct itself, two nights in a luxury hotel in the centre of Brighton, and a place at the speakers’ dinner the evening before the conference.

Even without the competition aspect, I think this is a pretty nifty project. People have already posted some great items:

Minidisk Player
This used to be cool. I think it still is.

Red Ring of Death
The infamous red ring of death. A symbol of recreation in the naughties and a beacon of utter despair.

Howarth S2 oboe
…though my oboe is a product of centuries of instrument making techniques and technology rather than something new, it’s certainly something (along with the skills that made it) that I believe needs preserving for the future as an example of beautiful design and craft.

time capsule banana
Clever future-people! Please clone this fruit—it’s a design classic (iconic styling, great usability), it’s nutritious, and it’s tastier than the bland efficiency-gruel you slurp down the rest of the space-week.

Now it’s your turn. What would you add to the dConstruct time capsule.

PaperCamp

I’m up in London for . I arrive late to find Aaron Straup Cope in full flow. I saw Aaron at XTech two years ago talking about the idea of . Here we are today having a whole event devoted to it. His talk today sets the scene nicely, packed full of ideas.

Tom Taylor has an awesome analogue mashup. He bought a cheap little till printer, the small dinky kind that is used for printing off shop receipts. As he put it, If A4 is a blog, this is Twitter. He has hooked it up to an arduino board which connects to his computer which is connected to the internet. That’s the hardware side of the things. The software side of things is pretty simple. Every day at 8:00am, a programme pulls in data from various places: appointments from his calendar, the movements of his fellow travellers on Dopplr, and (of course). This gets output to a queue and a few seconds later, that gets output—via the arduino board—to the till printer. Tom now has a small slip of paper with all the little reminders he might need for the day. It is, as I said, awesome. I want one.

Till printer + arduino + laptop

Alexandra Deschamps-Sonsino is talking about making stuff with paper. But enough talk. Let’s actually make stuff. We are all seated around a table covered with paper, pens, scissors, tape, stanley knives and other tools. We have fifteen minutes to make either a piece of furniture, a building or an object we love. I don’t know what to build so I look up at the ceiling and start trying to build a scale model of it. It was fun.

Chris Heathcote loves guidebooks. Venice for Pleasure is the ur-guidebook, beautifully written. Wallpaper do guide books for people who live a clichéd designer lifestyle and take taxis everywhere. In Japan they have the concept of mooks: magazine books. They aren’t replaced every month; a new one comes out every month but you can buy the previous mooks too. Guidebooks are getting smaller which is a good thing. Chris tends to rip things out of his guidebooks—they tend to be for one-time use. He does the same with maps. Like Aaron said, you don’t want to be the tourist with the big map. Moleskine make notebooks with maps and tracing paper. And of course now, thanks to the papernet, you can make your own foldable maps, turkish or otherwise.

Nick O’Leary is talking about graphs. He wants to represent them with paper rather than simply on paper. He came up with some code that generates an image including lines showing where to fold and cut. Print it out, cut it and fold it and voila!, 3D graphs. He holds up an example. It’s beautiful. He wants to make a pop-up book of statistics. Absolutely bloody brilliant! This is data porn and paper porn rolled into one. Aaron asks if Nick has thought about applying this idea to creating topographical maps which, let’s face it, would be really, really handy for somewhere like San Francisco.

Nick's creation

We break for lunch and a bunch of us gravitate towards a bar called Camino, the only place in the vicinity that shares its name with a web browser. Some of the people I know, some I don’t. The conversation turns to code and hacking. I start to mention one of my favourite hacks at HackDay, Above London. Turns out that the person sitting next to me is Paul Mison, one of the Above London hackers and also creator of the machine tag browser that I blogged about.

After lunch, Sascha Pohflepp talks about Export to World. This looks familiar. Ah yes, I remember this being presented as the dinner entertainment during Reboot last year. He’s been taking objects out of Second Life and modelling them in the real world.

Now everyone gathers around a laptop for a demo from Durrell Bishop and Tom Hulbert from Luckybite. They have a printed book based on their music collection. Each page of the book contains an image—usually an album cover—and a barcode. If you scan the barcode from a page in the book, the corresponding music will play on your computer (or your phone). The book is the UI. The wireless barcode reader is where the magic happens. If these guys can make a cheap version of this reader, it will fantastic …for all us. Right now the only expensive bit is the reading head but the price could come down as low as a dollar or two. Sign me up!

James Wheare now gives a quick demo. He’s making a daily physical lifestream. Overnight, it pulls in blog entries, Flickr pictures and twitter messages from his friends and in the morning, he prints out a foldable A4 page. He can fold this down into a little booklet to take with him when he leaves the house.

Lifestream booklet

Karsten Schmidt begins by talking about print on demand. He shows beautiful computer-generated algorithm-driven book covers from Faber Finds. He then shows the most gorgeous unique identifiers I’ve ever seen. These are printed on to postcards for the end of year show at the London College of Fashion—one per student. These cards are machine readable at interactive tables. But what about generating machine-readable identifiers without using a machine? Right now you still need a computer and a printer. What if you could use origami instead? If you think about it, that’s what’s going on with Edward James Olmos’s unicorn in Bladerunner. Take a piece of paper, configure it in a certain way; now it contains a machine-readable message.

At this stage, my mind is well and truly blown and we aren’t even finished yet. Sawa Tanaka is now going to show some of her work. Here’s a book called Spot Nocturnal Animals which is all white in the daylight but once it gets dark, you can shine a UV light on the paper to expose animal tracks and information. The Egg Book uses thermochromic ink. When you warm it up—Sawa blows on the page at this point—baby birds are revealed. Here’s the missing piece of the papernet puzzle: edibility. Sawa has made edible prints on rice paper: English breakfast, fish’n’chips, soba …this is making me hungry. She has also created a beautiful box of pictures of Hiroshima with pictures from 1945 burnt onto pictures from 2007. Every one of her projects is wonderful.

Sawa Tanaka

Next up is Beeker Northam who speaks about photographing paper. She doesn’t like throwing away books. She photographs her books. There’s something about photographing them that’s different to scanning them. She’d like to have some kind of web-based way for people to share those bits of books that have had an emotional impact on them but she hasn’t found it yet. There are book sharing sites out there but they all take a library-based approach.

I’m up next. I feel bad because, not only do I not have a demo or prototype to show, I don’t even have any slides. All I have is an idea. And ideas are a dime a dozen. It’s following through that counts. But still …I’m using PaperCamp as a real-world LazyWeb; running an idea up the flagpole; opening the kimono; attempting a landing on the Hudson.

I had this idea a while back of doing a location-based audio service. I heard about a site that offered user-generated audio guides for museums. Download the MP3, stick it on your iPod, go to the museum and press play. I thought it would be good to do the same thing for any kind of location. For example, I could walk around Brighton recording my thoughts about the architecture or talking about the best restaurants, and then I could upload that audio file and geotag it so that somebody else can later retrace my steps and hear my words. The problem I’ve found with this idea is the lack of good recording devices. We have ubiquitous listening devices—iPods—but the ubiquitous devices we talk into—mobile phones—aren’t the right fit for this, I fear.

So the idea of location-based shared audio languished on the back burner. Then I saw Aaron speaking at XTech about the papernet and I begin to think that words on paper might be a better medium than words in headphones. Paper is compact, durable and portable. Then Moleskine came out with their city guides and that’s when I joined the dots: what I want is a guide book that grows over time. It could work something like Book Crossing, with people passing the notebooks along to the next person visiting a place. To begin with, the notebooks are sparse, containing only maps but then they get filled with notes, stories, tips and recommendations.

It strikes me that the internet is superb for communication and collaboration over distance: Wikipedia, Flickr, blogs …physical distance collapses completely. Meanwhile, the physical world has an emotional immediacy and tactile feel that can’t be captured online. I’d like to bridge those worlds using guidebooks as the glue: physical objects in the real world that benefit from the collaborative environment of the internet. I’m not sure if Moleskine city guides are necessarily the best vessels. That would limit the potential places to just those cities that have guidebooks. A print-on-demand book containing maps from OpenStreetMap, photos from Flickr places and text from Wikipedia could make for an equally good starting point as long as the physical dimensions are notebook-like.

That’s my idea. I can foresee some serendipitous side-effects growing out of this infrastructure—games and treasure hunts, perhaps—but I can also imagine some challenges—like co-ordinating the physical shipping of the books from person to person (maybe drop-off points are a better idea). Then there’s the fact that all this information that’s being accumulated is stuck in a physical object that isn’t machine-readable without some scanning and OCR—it seems a shame that the information can’t easily flow back from the real world onto the internet.

I’m done pitching my idea and ask what people think. Aaron says he wants to help me build this. Yay! He also says that my worries about getting the information from book to internet shouldn’t be too much of a cause for concern. I agree: it’s certainly not a show-stopper. Alex likes the idea of the time-sensitive nature of recording thoughts about a place; the places that you visited when you were in a relationship, for example, will be coloured by how you felt in that relationship. I hadn’t thought about that, but yes, these notebooks could be vessels for messages from your past self to your present or future self. Denise reckons that this might not even be a technological undertaking at all: she mentions a notebook of sketches that was simply passed from designer to designer, filling up over time. I think that’s largely true but there’s also great potential in the social aspect of sharing the books: I’m going to want notebooks that have previously been used by people I know or whose opinion I trust. But yes, fundamentally all I’m proposing is a web-based admin system for co-ordinating the sharing.

With that, I’m done. I hand the floor over to Matt Ward who closes the event with his thoughts about everything he’s seen today. Keywords are augmentation, materiality and craft-bioinformatic-origami-unicorns.

The other Matt finishes by thanking us all for coming and turning a drunken conversation in the pub into something that will keep him thinking for all of 2009. Hear, hear! Thank you, Mr. Jones, for organising this inspiring gathering.

Beauty at BarCamp Brighton

As soon as dConstruct was over, it was time for the next wonderful gathering of geeks: BarCamp Brighton 3.

I didn’t manage to make it to the event for the kick-off, having spent the previous evening celebrating at the after-party and after-after-party that my talk was really over and done with. That meant that I missed some of the early speaking slots but I still managed to see some great talks (including Nat’s excellent IE6 bug-squashing quiz) and spend a pleasant evening playing CSS Specificity Snap and Semantopoly.

Despite the fact that the venue boasted eight separate locales for giving talks, speaking slots were at a premium, which is a testament to the enthusiasm of the attendees. I managed to grab a spot towards the end of the day two. My presentation was very hastily prepared—in fact, I was preparing it while giving continuous partial attention to Rebecca and Jessica’s excellent presentations.

I gave a short talk called The Most Beautiful Woman in the World, an appellation once applied to Hedy Lamarr. I figured that my fellow geeks would enjoy the story of her oft-overlooked contribution to technology.

Hardware

While I had to travel quite for to attend the geek Summer camp that is South by Southwest, the next geek event I went to was a lot closer to home. BarCamp Brighton 2 was the perfect way to come down after SXSW without going cold turkey on passionate geekery.

My hat is off to everyone who helped put the event together and to the University of Sussex for agreeing to host such an unusual gathering. This was the fifth Barcamp I’ve attended and, as usual, it was simply fantastic. There were some excellent talks ranging from primatology to data visualisation. I did my bit by contributing to a panel discussion on portable social networks with Aral, Tom, Colin, Christian and Aleks, who covered the implications of social network portability for virtual worlds.

There was also plenty of hands-on hacking to be done thanks to a heavy arduino presence. I sat in on one session, managed to get an LED to blink and I was hooked. I now have my own little arduino kit, a bread board and a lucky bag of LEDs. Alas, know next to nothing about basic electronics so I’m really going to have to brush up on this stuff. It will certainly be a long time before I’ll be performing the kind of arduino/wiimote hacking that Nigel Crawley was doing.

There was more arduino/wiimote hacking to be seen at the Flash Brighton meetup a few days later. We were treated to a behind-the-scenes look at the exhibit by Rachel Beth Egenhoefer that’s currently running in the Lighthouse gallery in Brighton—in the same building that houses the Clearleft HQ. The show runs until April 5th. Be sure to check it out if you want to see the knitting equivalent of Guitar Hero.

BarCamp ends

We’re down to the last couple of talks at BarCamp London 3. I’m feeling remarkably awake considering how late I was playing Werewolf—it must be the presentations that are keeping me on my toes.

After a fun geek quiz in the style of QI, I participated in mass critique of the forthcoming BBC homepage redesign. The good news: all the functionality provided by JavaScript is still available using traditional full page refreshes. The bad news: it’s still fixed width—the number of pixels is different but the design decision is the same. It was very, very brave to show a redesign to this tough crowd but the ensuing discussion was enjoyable and thought-provoking.

Right now, Ian is giving a talk on data portability and that’s provoking even more discussion and debate.

It’s been fun but it’s time for me to make the long journey back to Brighton. I’ve had a great time. It was, like all the other BarCamps I’ve attended, very inspiring. Many thanks to BBC Backstage and to all the Google people who opened up their workplace to us and shared their facilities as well as their delicious and plentiful food.

BarCamp continues

When the talks wrapped up on the first day of BarCamp London 3, the evening events began. Our hosts, Google, sure know how to grease the gears of geek socialising; we were served a wide variety of good beer and wine, we were fed a thanksgiving turkey dinner, we were happy, happy geeks.

It wasn’t long before the happiness was replaced with fear, suspicion and paranoia. Yes, I mean Werewolf. I played in two games and moderated another two. Werewolf moderation brings out the asshole in me, but it usually makes for a good game experience.

The mauling was interrupted at midnight to enjoy extra treats from Google: waffles, crépes and a chocolate fountain. I thought the food at BarCamp Brighton couldn’t be topped but BarCamp London 3 has really raised the bar. This morning, after a good night’s sleep (I was glad I brought an inflatable mattress), breakfast included omelettes cooked to order and freshly squeezed orange juice.

As well as the culinary goodness, there are plenty of toys to keep us amused: guitar hero, Wii and a Segway. With our entertainment needs satisfied, we know return to the matrix of presentations with renewed vigour.

BarCamp begins

BarCamp London 3 is in full swing. I’ve put together a schedule of the talks. It’s marked up in hCalendar so everyone here can subscribe to it, stick it on their laptops, phones, iPods, or whatever, and then get updates as and when I edit the HTML.

The Google offices have been taken over for a grab-bag of great presentations. I sat in on Norm!’s Law, an introduction to storytelling, an overview of OpenSocial from a very jetlagged David Recorden and a treatise on website psychology from Gavin Bell. Then it was my turn.

I enjoyed talking about The Transmission of Tradition. I didn’t use many slides and they were just reminders for myself. I mostly just nattered on and punctuated my tale with the occasional tune or two. I really enjoyed it and the people who were gracious enough to listen to me seemed to enjoy it too.

And now I should get back to listening to and participating in the other talks. I ought to be heckling Norm! right now.

Return to London town

No sooner am I back from one London geekfest than I find myself getting ready to head back up for another. is about to kick off, hosted by Google this time. If it’s even remotely as good as the previous two London BarCamps, it’s going to be great.

A BarCamp offers a nice opportunity to for me to break out of my usual subject matter. Instead of talking about Ajax, web standards, or microformats, I’m planning to take some of the material from my talk at the local £5 App event and condense it down into a study of how technology has altered the transmission of Irish traditional music. I’m hoping that this could be a good starting point for a discussion of ideas such as the public domain, copyright and the emergence of a reputation economy. Failing that, I’ll probably bring my bouzouki with me so I could just play some tunes.

Mostly I’m excited to see what other people have got in store. I’m constantly amazed by the quality of presentations I’ve seen at BarCamps. I feel kind of guilty that this will be my third London BarCamp—after all, it shouldn’t be the same faces every time—but, oh, I do love them so! I can always earn my keep by moderating a game of Werewolf or ten.

Brighton daze

It’s been quite a few days here in Brighton. dConstruct passed by in something of a haze. I was so busy running around trying to make sure everything went smoothly that I didn’t pay all that much attention to the presentations. I should have just relaxed and enjoyed myself; everything went fine. But of course, anything could have gone wrong at any moment and that’s what kept me wound up.

I didn’t have a speaking slot this year so I had nothing to worry about. But I did introduce some of the speakers and I found that almost as stressful. I’ve come to the realisation that the amount of speaking time doesn’t matter that much; it’s the situation of standing on stage in front of an audience of peers that’s scary.

Of all the stages to stand upon, the Brighton Dome has got to be one of the best. It really is quite an amazing venue.

The day went off with nary a hitch and most people seemed to enjoy themselves. Some of the presentations divided opinion. The same talks that underwhelmed some people had others enraptured. I kind of like that. We tried to put together a mixed bag and I’d rather that a talk was loved or hated rather than being judged just average.

As I said, I didn’t have much chance to pay attention to the presentations though I made a point of catching Denise and George chatting on the sofa. I loved it. It was the perfect format for the middle of the day and the content was fascinating. I can understand if it wasn’t everyone’s bag (if your big company has sent you to a conference with an order to “go learn stuff” then you’d be sorely disappointed) but I thought it was wonderfully relaxed and entertaining. Or maybe I just enjoyed the F-bombs and C-grenades.

Cameron was as smooth, dependable and awesome as always. Tom excelled himself. Heck, all the speakers were on top form. Matt is giving himself a hard time but just check out his presentation: it’s a beautiful study in apophenia.

Once the conference was done (and the after party… and the after-after party) it was time for BarCamp Brighton. I got a little sidetracked by the Brighton Food and Drink Festival on the way but when I showed up I found the BarCamp spirit in full swing.

The venue was great, the food was superb and the presentations were fantastic. The plan was to just have ethernet internet access but Dave worked some of his Pier to Pier magic to provide rock-solid WiFi. In short, the whole thing was wonderful. Matthew talked about Cornish politics, John told us how to make the perfect cup of tea, Mikel showed off the OpenStreetMap data for Brighton, Paul taught a magic trick and I talked with Tantek about portable social networks.

I missed the talk by Jon Linklater-Johnson but I caught with him afterwards to see his CSS specificity cards. He made a memory game out of matching the specificity of selectors. How cool is that?

Hats off to Glenn and the whole Madgex for a job well done. I was feeling pretty exhausted after dConstruct but BarCamp completely revitalised me. And yes, there was Werewolf a-plenty (I’ll never believe Natalie again).

With the out-of-towners coming to dConstruct and BarCamp, I wanted to make sure that everyone enjoyed their time in Brighton. I think everyone did. The weather was great, there was lots to do and there was a great buzz in the air.

I’m lucky enough to get to travel to quite a few geek gatherings in far-flung places. I really enjoy that. But for the past few days, Brighton has been the epicentre of geekdom. Welcoming my peers to my adopted hometown is a particular thrill. Brighton—if you’ll forgive the cliché—rocks.