Journal tags: slides

5

sparkline

Backup

I’m standing on a huge stage in a giant hangar-like room already filled with at least a thousand people. More are arriving. I’m due to start speaking in a few minutes. But there’s a problem with my laptop. It connects to the external screen, then disconnects, then connects, then disconnects. The technicians are on the stage with me, quickly swapping out adaptors and cables as they try to figure out a fix.

This is a pretty standard stress dream for me. Except this wasn’t a dream. This was happening for real at the giant We Are Developers World Congress in Berlin last week.

In the run-up to the event, the organisers had sent out emails about providing my slide deck ahead of time so it could go on a shared machine. I understand why this makes life easier for the people running the event, but it can be a red flag for speakers. It’s never quite the same as presenting from your own laptop with its familiar layout of the presentation display in Keynote.

Fortunately the organisers also said that I could present from my own laptop if I wanted to so that’s what I opted for.

One week before the talk in Berlin I was in Amsterdam for CSS Day. During a break between talks I was catching up with Michelle. We ended up swapping conference horror stories around technical issues (prompted by some of our fellow speakers having issues with Keynote on the brand new M1 laptops).

Michelle told me about a situation where she was supposed to be presenting from her own laptop, but because of last-minute technical issues, all the talks were being transferred to a single computer via USB sticks.

“But the fonts!” I said. “Yes”, Michelle responded. Even though she had put the fonts on the USB stick, things got muddled in the rush. If you open the Keynote file before installing the fonts, Keynote will perform font substitution and then it’s too late. This is exactly what happened with Michelle’s code examples, messing them up.

“You know”, I said, “I was thinking about having a back-up version of my talks that’s made entirely out of images—export every slide as an image, then make a new deck by importing all those images.”

“I’ve done that”, said Michelle. “But there isn’t a quick way to do it.”

I was still thinking about our conversation when I was on the Eurostar train back to England. I had plenty of time to kill with spotty internet connectivity. And that huge Berlin event was less than a week away.

I opened up the Keynote file of the Berlin presentation. I selected File, Export to, Images.

Then I created a new blank deck ready for the painstaking work that Michelle had warned me about. I figured I’d have to drag in each image individually. The presentation had 89 slides.

But I thought it was worth trying a shortcut first. I selected all of the images in Finder. Then I dragged them over to the far left column in Keynote, the one that shows the thumbnails of all the slides.

It worked!

Each image was now its own slide. I selected all 89 slides and applied my standard transition: a one second dissolve.

That was pretty much it. I now had a version of my talk that had no fonts whatsoever.

If you’re going to try this, it works best if don’t have too many transitions within slides. Like, let’s say you’ve got three words that you introduce—by clicking—one by one. You could have one slide with all three words, each one with its own build effect. But the other option is to have three slides: each one like the previous slide but with one more word added. If you use that second technique, then the exporting and importing will work smoothly.

Oh, and if you have lots and lots of notes, you’ll have to manually copy them over. My notes tend to be fairly minimal—a few prompts and the occasional time check (notes that say “5 minutes” or “10 minutes” so I can guage how my pacing is going).

Back to that stage in Berlin. The clock is ticking. My laptop is misbehaving.

One of the other speakers who will be on later in the day was hoping to test his laptop too. It’s Håkon. His presentation includes in-browser demos that won’t work on a shared machine. But he doesn’t get a chance to test his laptop just yet—my little emergency has taken precedent.

“Luckily”, I tell him, “I’ve got a backup of my presentation that’s just images to avoid any font issues.” He points out the irony: we spent years battling against the practice of text-as-images on the web and now here we are using that technique once again.

My laptop continues to misbehave. It connects, it disconnects, connects, disconnects. We’re going to have to run the presentation from the house machine. I’m handed a USB stick. I put my images-only version of the talk on there. I’m handed a clicker (I can’t use my own clicker with the house machine). I’m quickly ushered backstage while the MC announces my talk, a few minutes behind schedule.

It works. It feels a little strange not being able to look at my own laptop, but the on-stage monitors have the presentation display including my notes. The unfamiliar clicker feels awkward but hopefully nobody notices. I deliver my talk and it seems to go over well.

I think I’ll be making image-only versions of all my talks from now on. Hopefully I won’t ever need them, but just knowing that the backup is there is reassuring.

Mind you, if you’re the kind of person who likes to fiddle with your slides right up until the moment of presenting, then this technique won’t be very useful for you. But for me, not being able to fiddle with my slides after a certain point is a feature, not a bug.

Kinopio

Cennydd asked for recommendations on Twitter a little while back:

Can anyone recommend an outlining app for macOS? I’m falling out with OmniOutliner. Not Notion, please.

This was my response:

The only outlining tool that makes sense for my brain is https://kinopio.club/

It’s more like a virtual crazy wall than a virtual Dewey decimal system.

I’ve written before about how I prepare a conference talk. The first step involves a sheet of A3 paper:

I used to do this mind-mapping step by opening a text file and dumping my thoughts into it. I told myself that they were in no particular order, but because a text file reads left to right and top to bottom, they are in an order, whether I intended it or not. By using a big sheet of paper, I can genuinely get things down in a disconnected way (and later, I can literally start drawing connections).

Kinopio is like a digital version of that A3 sheet of paper. It doesn’t force any kind of hierarchy on your raw ingredients. You can clump things together, join them up, break them apart, or just dump everything down in one go. That very much suits my approach to preparing something like a talk (or a book). The act of organising all the parts into a single narrative timeline is an important challenge, but it’s one that I like to defer to later. The first task is braindumping.

When I was preparing my talk for An Event Apart Online, I used Kinopio.club to get stuff out of my head. Here’s the initial brain dump. Here are the final slides. You can kind of see the general gist of the slidedeck in the initial brain dump, but I really like that I didn’t have to put anything into a sequential outline.

In some ways, Kinopio is like an anti-outlining tool. It’s scrappy and messy—which is exactly why it works so well for the early part of the process. If I use a tool that feels too high-fidelity too early on, I get a kind of impedence mismatch between the state of the project and the polish of the artifact.

I like that Kinopio feels quite personal. Unlike Google Docs or other more polished tools, the documents you make with this aren’t really for sharing. Still, I thought I’d share my scribblings anyway.

Code print

You know what I like? Print stylesheets!

I mean, I’m not a huge fan of trying to get the damn things to work consistently—thanks, browsers—but I love the fact that they exist (athough I’ve come across a worrying number of web developers who weren’t aware of their existence). Print stylesheets are one more example of the assumption-puncturing nature of the web: don’t assume that everyone will be reading your content on a screen. News articles, blog posts, recipes, lyrics …there are many situations where a well-considered print stylesheet can make all the difference to the overall experience.

You know what I don’t like? QR codes!

It’s not because they’re ugly, or because they’ve been over-used by the advertising industry in completely inapropriate ways. No, I don’t like QR codes because they aren’t an open standard. Still, I must grudgingly admit that they’re a convenient way of providing a shortcut to a URL (albeit a completely opaque one—you never know if it’s actually going to take you to the URL it promises or to a Rick Astley video). And now that the parsing of QR codes is built into iOS without the need for any additional application, the barrier to usage is lower than ever.

So much as I might grit my teeth, QR codes and print stylesheets make for good bedfellows.

I picked up a handy tip from a Smashing Magazine article about print stylesheets a few years back. You can the combination of a @media print and generated content to provide a QR code for the URL of the page being printed out. Google’s Chart API provides a really handy shortcut for generating QR codes:

https://chart.googleapis.com/chart?cht=qr&chs=150x150&chl=http://example.com

Except that there’s no telling how long that will continue to work. Google being Google, they’ve deprecated the simple image chart API in favour of the over-engineered JavaScript alternative. So just as I recently had to migrate all my maps over to Leaflet when Google changed their Maps API from under the feet of developers, the clock is ticking on when I’ll have to find an alternative to the Image Charts API.

For now, I’ve got the QR code generation happening on The Session for individual discussions, events, recordings, sessions, and tunes. For the tunes, there’s also a separate URL for each setting of a tune, specifically for printing out. I’ve added a QR code there too.

Experimenting with print stylesheets and QR codes.

I’ve been thinking about another potential use for QR codes. I’m preparing a new talk for An Event Apart Seattle. The talk is going to be quite practical—for a change—and I’m going to be encouraging people to visit some URLs. It might be fun to include the biggest possible QR code on a slide.

I’d better generate the images before Google shuts down that API.

Reboot slides

The first day of Reboot 9 in Copenhagen is at an end. It’s been quite an inspiring day: lots of good talks but, more importantly, lots of great conversations with smart interesting people. This is my second year here so today has been a nice mix of meeting up with old friends and getting to meet new people.

This year’s theme is “human”, a typically philosophical subject for this blue-sky conference. Getting into the spirit of things, I gave a presentation called soul. It wasn’t quite as pretenscious as last year’s talk but it was certainly a rambling, haphazard affair. I really just wanted to tie in a bunch of ideas that I’ve been thinking about lately: lifestreams, portable social networks, online activity as gaming… but mostly it was a recruitment drive for Hack Day.

You can download the slides of “soul” as a PDF (with notes).

I was in the first speaking slot and I was very happy to get it over and done with. I had been slightly panicking over this talk and only really got it together during an extended stay at Stansted airport on the way to Denmark. Thanks for the two hour delay, Easy Jet.

Even with the main talk done, I had one more task to accomplish. I foolishly agreed to do a micro-presentation—we can’t call them Pecha-Kucha, donchyaknow—of 15 slides with exactly 20 seconds per slide. I finished the slides for that shortly beforehand and then started psyching myself up for it by hyperventilating and increasing my heart-rate.

I think it paid off. I had an absolute blast, people seemed to enjoy it and Andy asked if I had been possessed by the spirit of Simon Willison.

Oh, and the subject of the rat-a-tat talk was Hypertext: a quick list of tips for improving your links with rel, rev and various microformats. Help ourself to a PDF of the slides.

Update: Here’s a video of my micro-presentation. I was even more incoherent than I feared.

Sliding away

A few people have asked me lately if I could send them the slides from presentations I’ve given. I’m more than happy to pass on the slides but I feel I have to add a big caveat: they don’t make much sense out of context. With that said, here are some PDFs exported from Keynote (and despite Joe’s feelings on the matter, all of these presentations are licensed under a Creative Commons attribution license):

I’ve found myself developing a certain style in my presentation slides. I avoid bullet points like the plague. Often the most effective slides are the ones with a single word or image.

Something else that you don’t get from the PDFs is the arrow of the time. I like to gradually layer up my slides rather than presenting everything at once. I like the way that Keynote allows me to introduce words as I’m introducing ideas. I only ever use one transition: dissolve. I find it has a soothing feel to it.

I’ve also found myself using typography to communicate. The position, relative size and colour of the words can really help to explain a concept. Combined with the disolve effect, that’s pretty much all I need. I’ll throw in the occasional image where necessary (usually gleaned from the advanced search on Flickr where I can specify Creative Commons licensed content) but mostly I stick to the same formula: large greyscale tightly-kerned bold Helvetica Neue.

I’ve been doing quite a bit of speaking lately and there’s a fair bit still to come. Whenever I’m asked to speak on a subject that I’ve spoken about in the past, I’m perched on the horns of a dilemma. Should I create an entirely new presentation or should I recycle old material?

I don’t like the idea of giving the same presentation more than once. At the same time, if I know from experience that I can make a point clearly, shouldn’t I go ahead and do that even if it means repeating something from an earlier presentation?

Usually, I compromise. I recycle some tried and tested parts of previous presentations but add something new. It all depends on the circumstances: if I’m being paid well to deliver a presentation, then I feel obligated to come up with something entirely original… though I’ll still end up recycling a good slide or two if I know they’ll work well. But it’s important to remember that the payment for speaking is not just for the 45 or 60 minutes that you’re on stage: it’s for all the preparation time too.

Next week, I’ll be in San Francisco for @media America. The subject of my talk is Bulletproof Ajax—a topic on which I’ve presented many times before. This conference is being run on a fairly tight budget so I don’t feel obliged to come up with an entirely original talk. At the same time, I don’t want to repeat verbatim a talk I’ve given in the past. In this age of podcasts—and I try actively to transcribe as many as I can—I don’t want any audience member to think “Hey, this sounds kinda familiar.” But without the financial renumeration required for an entirely new talk, what’s a speaker to do?

In the end, as always, the final result is compromise. Some of the material I’ll be presenting in San Francisco will be new but some of it will be road-tested. I’m fairly confident that hardly anybody in the audience will have seen me present this stuff before but I still can’t help feel a pang of guilt.

But, y’know, the real reason why I’m out there talking about Ajax or microformats or whatever, is because I want the message to reach as many people as possible. Sometimes that means that I have to repeat myself. I feel bad about that. But even in this connected age, a certain amount of redunancy is probably inevitable.

Anyway, I’ve more or less got my slides ready for @media America. I’ve still got a few days to agonise over them so maybe they will change drastically before the day of the presentation dawns. Right now, I should probably prepare for my trip from England to California. An eleven our flight in the economy class belly of a United Airlines flight awaits. Tomorrow I’ll get the hellbus to Heathrow where I can try asking “I can has bulkhead or exit rowz?” After that, the only decision I’ll have to make is choosing between “I can has chicken” or “I can has beef.”

Do not want!