Complete and utter demo failure

Last Friday was a bit unreal. I find myself on stage at HalfStack talking about WebBluetooth. A couple hundred people look at me and listen to me. When it’s time to show some really cool demos, I explain that this is experimental technology and may not work. No, I explain, it will probably not work. And that was not a lie. In fact, before I started the talk I knew there was a very large chance the demos would not work. And indeed, none of the demos worked. Complete and utter demo failure.

Three years ago, when I started doing these kind of talks, I promised myself I would never bring myself in such a situation. I would never do a live demo or do live coding. I’ve seen one too many speakers burn their fingers.

Live coding and demos can be extremely risky. It is so easy for a good talk to go completely off the rails when the live coding turns into a hunt for a typo. Or when a demo fails because it includes an npm install which takes at least 10 minutes over slow WiFi. Lots of these failures happen because of lack of preparation or lack of experience. It is never fun for the audience to see a failed demo. The audience isn’t taking pleasure in seeing you fail. It wants you to succeed. Often they payed good money to see your talk, so everything you want to show should be well prepared and rehearsed. That is something that you owe the audience. But we are dealing with technology here. And when you start playing with experimental features or hardware, all bets are off.

But if everything goes well, it can be glorious. Even though it is now a few years old, every single time I see the border-radius talk by Lea Verou I am still blown away. She makes live coding look effortless.

About a year and a half ago I did a talk about building web apps for televisions at PhoneGap Day EU. And I did a live demo…. well, at least that is what it looked like. It was just a screen capture I did beforehand and I just acted. I faked it and nobody noticed it.

And that is the sensible thing to do. As a speaker you are not on stage to show off your live coding skills. A live demo just for the sake of doing a live demo is a really bad idea. It’s all about the message that you want to get across. And whether or not that demo was really truly live, does not matter most of the time. Often a screen capture or a movie has the same impact as a live demo would have. But a failed demo may undermine every single thing that you mentioned in your talk.

Somewhere this year I started looking at WebBluetooth and I just love the potential of this specification. It is just a natural extension of Progressive Web Apps by giving web developers the ability to interact with devices in the physical world.

And of course when you give a talk about WebBluetooth, you don’t just want to talk about the boring theoretical stuff. Sure, you need to explain what Bluetooth is, and how the API works, but what you really want to do, is show how it works. So during the talk I show the audience my live heartbeat. I change the colour of a lightbulb, drive around a LEGO car and fly a drone. All from the browser, written in JavaScript, using the WebBluetooth API. And every single time this has such an enormous impact. Just ending the talk with a movie is of course really safe, but also feels like a let down. For this subject a live demo is appropriate.

Back to HalfStack

Before my talk there is a break and I start setting every up. I have this big suitcase full of gadgets and I start unpacking it. The day before at the hotel I made sure every device was charged and did a quick run through of all the demos. Everything was in working order. When I finish unpacking I put on my heartbeat monitor and try to connect to it from the browser. And it does not work…

I try again. And again. I try a different device. I try the lightbulb. I try the car. It doesn’t work. 5 minutes to go.

People are standing really close to the table. Many people. All holding their phones using WiFi. Using the same frequency as Bluetooth. Radio interference is a real thing and perhaps that is causing these issues. But it is not the first time I gave this talk and I didn’t have any issue with interference during the last conference, so why am I having problems now?

I restart the browser. Maybe it’s a browser issue. I try again. Nothing. And I try again. 1 minute to go. People are sitting down. Then suddenly I have a connection with the heartbeat monitor. It works! My heartbeat is 161. The talks starts and the first demo is a success. I make a joke. People laugh.

Photo by Dominik Kundel

The talk really went well. I make jokes and get a good response from the audience. But then it’s time for the main demos. And I explain that this is all experimental technology. And it may not work, I say. I make a point of saying that it probably will not work. I jokingly say I am absolutely terrified. Again laughter. Usually that is just acting. But that day it was not. I really was terrified.

The first demo is connecting to a lightbulb and changing the colour. I load the demo page, I click the button to connect and it starts searching for devices…. And it doesn’t find anything. I hold the lightbulb closer. Still nothing. I try the LEGO car. Nothing. The drone… Nothing. Restarting the browser… still nothing. At this point I still think it is WiFi interference.

All the while I try to make some jokes. When the lightbulb suddenly changes colour – not something I did myself – I got some reprieve by talking a bit about security and I got a nice hug on stage from Jani Eväkallio and suddenly it’s over. We do questions and I sit down. Complete and utter demo failure.

And I feel… quite happy. Okay, I’m disappointed that the demos did not work. I knew that this was a possibility beforehand and I was at peace with it.

Of course during the next talk I try to figure out what went wrong. All my gadgets are still on stage. So I try connecting again. Still nothing. Then suddenly Chrome crashes hard. I start Chrome up again and try again. And of course I get an immediate connection to the lightbulb. It changes colour. Then I try the LEGO car. It connects. I press forward. It moves. Jonathan Fielding who is now up on stage is startled and I quickly disconnect.

Something in the browser apparently got stuck and causing it to not find any Bluetooth devices anymore. But why didn’t a restart help? And the heart rate monitor did work for a while. So yeah. Experimental technology.

Even though the API is available in the current version of Chrome without flag, doesn’t mean the implementation is stable. That is something I found out during the development of the demos. For example, sometimes characteristics get garbage collected even though you are listing for events on it. But not being able to find any Bluetooth devices at all? That was new.

So was this talk a failure? I don’t think so. The talk was still useful. I don’t think it undermined the message of that talk. The whole purpose of the talk is to show off experimental technology and I think everybody in the audience understood on some level that there are always risks that technology will fail and mess everything up. The whole point was not to show that this is production ready. It was to show a glimpse of where the web was heading.

Of course that same talk with working demos would’ve been so much better. And I did some demos during the breaks, but of course that has far less impact. It should have worked the first time. Everybody has a bad day once in a while. At least now I know to I have to restart the browser before every single talk. Even better, just restart the whole computer and start fresh. The only regret I have is that I didn’t restart the computer right there on stage. Should’ve. Could’ve. Would’ve.

And knowing what when wrong was really important, because the day after HalfStack I had to quickly fly to Amsterdam to give the same talk again at GDG DevFest NL. Do the same demos again in front of couple of hundred people. But this time I was not nervous at all. I joked about the failure the day before and raised the stakes even further and of course the demos went absolutely perfect!