Christian Heilmann

Author Archive

“Setting disruptors to stun” – keynote video and transcript now available.

Friday, April 19th, 2013

“Setting disruptors to stun” was the keynote at HTML5 Devcon in San Francisco in April 2013. In it, I am explaining why we can not directly compare native and web apps and that the technical differences are not really the main issue. The main problem is that native apps follow a very old principle of “built-in obsolescence” which means that they are built to break and be replaced with a newer version so you can sell more. The talk then shows how Firefox OS disrupts that idea with the dynamic app discovery and by going to where new audiences are.

Transcript

Thanks for coming again. Thanks for being in the grand ballroom. With this chandelier I would’ve expected people to dress up a bit more nicely, but we’re geeks so I guess that didn’t work out. Today I was asked to give an inspiring speech about things and stuff, and I think that’s a very good start for a day. I wanted to do something very, very technical, but then it’s a keynote so you don’t do that, so don’t expect that from me. We can talk technical in any way you want to later.

I want to talk about how the web used to be this massive disruptor to a terrible market and how it changed over the years, and how in the last few years, especially last year here, a lot of people started scaring us into thinking the web was not there any more and it’s a new thing that we have to do right now and we are all going to lose our job and be homeless in two months because we don’t support the newest coolest iPad. It’s like this children’s book that you can buy now, which is called, “You can’t be an astronaut, it’s just not realistic.” This is really cool to give to your kids, like, “Here you go.”

Back in the days when I started on the web it was like this. We had wired connections and we all had keyboards to surf on. We all had to keep the mouse up, otherwise it would fall off the keyboard. This is what the web was about. It was just beautiful and in nice colors, and every kid had the hat sideways. It was just this wonderfully cool thing.

In reality, it was a really cool thing. I worked as a radio journalist back then, and I saw the Internet as there for everybody to start publishing and for everybody to be found worldwide and to communicate with people worldwide. To me this was a totally new thing. Before that we had these BBS’s where you had to know the telephone number to call to connect and get data from another server worldwide.

Then with the Internet, we connected with modems that sounded a bit like Skrillex but really wasn’t. It was just connectivity. You stood there and like, “This almost looks like an image, just give it another five minutes and it’ll be fine.” You had connections where you loaded something and then you disconnected it because you paid per minute, and then you went through the cache to find all the images you’ve been downloading because while you where loading it was too slow.

All these were really cool things, but it was a geek thing. The main market basically saw us like that. They saw it like the Ubuntu launch party there. Basically these are the geek guys that just do that and it’s never going to catch on and nobody cares. Old-school programmers like mainframe programmers or people that use Java and things like that, people who have beards and suspenders and are real men, told us that the web will never be anything. “That’s just a toy. You use that angle bracket stuff that’s never coding.”

Nowadays it’s a bit different. The web is mainstream and we’re all these cool hipsters. Everybody uses the web for something. Most of the time horrible things, like following Justin Bieber on Twitter and things like that, but everybody uses it and we’re seen as these magical creatures that can build websites and nobody knows what we are doing.

The reason why that blossomed so much in those few years is that it’s built on a principle that anybody can be on the web just with an HTTP connection and something that shows HTML. It doesn’t matter where you are, it doesn’t matter what your ability is, what your language is, what your connectivity is. Everybody is invited. That was the Olympic Games, the opening, and that’s when Tim Berners-Lee typed this in and said the web that he invented, or with other people, is for everyone.

We keep forgetting that, just how powerful the web is for people who don’t have a voice in mainstream media, who cannot get a school education but they can go to an internet café and look at a Udacity course or look at a Khan Academy course if they wanted too. They can look at Wikipedia. I went to the library to do my homework. I didn’t have Wikipedia. I know teachers have actually put wrong things in Wikipedia articles to see how many students will actually bring that in their essays, which is a really cool way of using the web as well.

Everybody on the web is a consumer and a creator. We keep forgetting that because we are getting into that consumption thing. People get excited, “I can watch Game of Thrones streaming on my Internet.” You’re like, “How is that better than TV? You can start and stop it, that’s just like a VCR.” A streaming video, a streaming TV channel would allow the audience to remix it and to do things with it and to vote on different endings and make it different.

This is what we do in Mozilla with the Webmaker project where we invite kids and journalists and people who are just afraid of computers and not use to the web for anything to start playing with them and start creating. Seeing how empowered they feel when they start creating is just gorgeous, because for a lot of people it’s a totally new job that they couldn’t have had before. So good times we’ll have.

We have these browsers that get better and better and better. We had a few browsers that finally died and then we had a few browsers that actually agreed on everything. HTML 5 means first and foremost that all browsers run the HTML the same way. That was a big, big thing. We see this as a given now, but actually that white space in Internet Explorer between LI items means you couldn’t style them. That was just a very annoying thing. You had to delete all kinds of things in there.

The browsers got better and better and we’re like, “Yes, we got it made, we got these cool HTML 5 APIs, we can do something.” Then change happened. What’s the main difference between Bill Clinton’s inauguration and Obama’s inauguration, except for the size of the flag and the color of the president, is everybody has this phone and takes pictures. Really blurry ones, really bad ones but everybody wants to take a picture and put it up online and be the first one to put it online because the 600 other people in that room don’t do the same thing, they don’t have the same idea.

I love it when you are at concerts and people hold their iPads up and film the band. You’re like, “Yeah, that sound quality is going to be amazing.” I had it the other day at Dropkick Murphys. I’m like, “Dude, last time you wouldn’t have survived and your iPod wouldn’t have,” but fair enough.

The web came around and the mobile phones came around, the smartphone came around. All hail the hypnophone; everybody has one, everybody needs one. It’s a great thing. You can talk to your friends who are on the other side of the planet, so you don’t have to talk to people next to you because they’re smelly and they spit and stuff. You have your virtual friends, so you don’t need to have real connections with other people, but you can complain online that you don’t have any friends. It’s a very on-the-go market and sometimes you even have connectivity and video with AT&T.

It started well. This is Steve Jobs, the visionary, the really, really good man, a really, really interesting guy. He released the iPhone … well, he had a few people helping him. He released the smartphone and iPhone and the first thing he said, “To be really disruptive and re-invent the phone, we have to actually have no SDK. It’s the web, it’s a web-based phone. You have Safari, you have the power of Safari and HTML 5 in your hand. You can build everything on the web with the phone, you can build great applications that can talk to the telephone, can talk to the map application.” That’s what he said.

Then the big backlash came from the developers and internally. Why did that happen? Well first of all, the mobile web was this mixed thing that nobody knew what’s going on there. We had this thing in the middle, and we had web developers on one side and native developers on the other, and both of them wanted to do it.

The native app developer is different to a web developer in many, many ways. They are actually used to a different environment. As a web developer I’ve got not SDK. I use VI, I use sublime text, I use that and we argue for a month who’s got the better text editor. We don’t wait for actually downloading an SDK for it as well.

The mobile space is a competitive and very closed market. The success of companies is very much based off how many patents they have and what they can actually protect from another. Like, “Oh, you can’t touch the screen of my phone because that’s my right.” Developers coming from that environment, for them the web seems scary. Like, “Everything is free and you can look at my code?” “How can I protect my java script code?” is a question I get every single time. Put it on a memory stick; leave it in your desk.

Fragmentation is the next big horror. “Oh my God, people have different phones and basically different sizes, and I have to support all of them. If only we had one government issued phone for everybody that has a fixed static thing.” For web developers it was, “Yeah, so? This is cool, I can write things for different platforms.” So fragmentation is being this horror word for everybody.

Shouldn’t we cherish flexibility much more? Shouldn’t we say, “Hey, if everybody cannot afford the newest iPhone, they have an old one, why not give them something for an iPhone 4? I mean these are just people with so much hardship in their lives, they only have an iPhone 4, so we should give them something.”

If you think about it, these tablets and smartphones are actually very flexible. Because you see as soon as you tilt them, they get longer. Because nothing at an angle could be as high as the other one, as long as it’s longer. Every display of those … I guess if you have the phone and hold it, it just automatically happens slowly so you don’t realize it. So tilting the phone makes it longer, and this is something you care about in your designs as well.

I wondered what the whole backlash was about. Why do developers get so riled up about not having an SDK and actually bringing the web on the phone? I did some research and I found this wonderful website called, “The Story of Stuff,” which explains about consumption and how America with 1% of the world population creates 20% of the waste and all these kind of interesting things. It’s a great thing to learn on the web. It’s in Flash but it’s not evil, so it’s really nice.

I learned about an old, old idea from Victor Lebow in The Journal of Retailing 1955. Actually what they said, and he was one of the advisors of President Eisenhower back then as well, “To make American companies be successful and make sure that we have money and jobs for the next few years our enormously productive economy demands that we make consumption our way of life, that we convert the buying and use of goods into rituals, that we seek our spiritual satisfaction, our ego satisfaction in consumption. We need things consumed, burned up, replaced and discarded at an ever-accelerating rate.” That was in 1955, it’s called, “The Principle of Obsolescence” and I’m happy I managed to pronounce that word.

Now as evil minds thing alike, there was this person that a year before even took that further. The build in obsolescence means that products are built to break after a year or two so you buy a new one. You realize that with every brand out there. I remember when I could kick a car door and there wasn’t a dent except my foot. Nowadays you have to replace everything and there are fifteen sensors in there to actually realize, “Hey…” parking sensors and all kinds of things.

Clifford Brooke Stevens actually took that further – and you can see that he is a very content and happy person – because he came up with the idea of the planned and built-in obsolescence. You don’t even need to make things break, you just have to make them look old and look outdated. You have to instill in the buyer the desire to own something a little newer, a little better, a little sooner than is necessary.

Every advertising is about this. Everything we see on telly is like, “This now has rounded corners.” Okay. How many people really feel like “Oh now I need this”. I was at Mobile World Congress and they showed all these hardware providers who went there and I went to every stand and asked, “What do you have?” “We got a new phone.” “What does it do?” “It’s bigger.” “Okay, is it faster too?” “Oh yeah, it’s faster too.” “What else does it do?” “It’s bigger and nicer and…” It’s no change. It’s just like a constant change in there that has to happen.

Perceived obsolescence is the next. Planned style obsolescence occurs when marketers change the styling of products so consumers will purchase products more frequently. The style changes are designed to make the owners of the old model feel out of date. You feel embarrassed pulling your first generation iPhone out in the coffee shop in San Francisco. This is because of this. We’ve been trained to think that things have to be outdated quickly and they’ve got to get new, new, new, new.

These shoes are 12 years old. Doc Martens in England. Now that Doc Martens has been sold to a company somewhere in the East, Doc Martens break within a year now as well. These ones don’t yet. So I will be very unhappy when they break.

It’s just amazing how we got into that. Other people thought it already as well. This was the ‘50s and everybody’s, “Oh my God, we’ve got to do this.” Then in the ‘60s some cynical mind basically said the systemic attempt of business to make us wasteful, debt ridden and permanently discontented individuals. To a degree, that’s right. People really, really rack up their credit card bills to get a new smartphone that they don’t need because they actually have a good smartphone already, but they want to be the new cool ones to have to swag and be awesome about it.

In essence, this is not our struggle. This is Apple’s and Google’s struggle and Samsung’s struggle and hardware makers’ struggle. We cannot compete with that. We cannot go and say, “Look, websites, you can edit it, you can change it, you can change the interface of a website. It will be maintainable for five years in the future.” No, no, no this thing has to break tomorrow. What can you give me that makes people buy a new phone because they want to have the next version of that game? This happens.

Web development and native development cannot be compared one to one. We always do these HTML 5 showcases where we show that HTML 5 could be like native apps. Then we make it work across all the browsers and across all the platforms like we should in HTML 5, and it turns out not to be as performing and as good as the native app. If you really want to prove that it does the same, do it on one platform, one browser and one configuration. This is not HTML 5, this is just making a native app in some environment that should not be native.

Fragmentation to us is a given. I never knew what browser you use. Hopefully Firefox, otherwise you have a bad time. I didn’t know what connection you have. I don’t know what resolution you have. I don’t know if you’re drunk. I don’t know if you can read English. I don’t know if you’re sober but you can’t read English. I don’t know anything about you and I love that. I love to write defensive code that actually says, “Can you do this?” “Yes.” “Okay, do this.”

@supports was put in Firefox Nightly yesterday, so basically you can have modernizer in CSS itself and in JavaScript. That’s kind of the stuff we need. All of these things [different hardware on screen] should get something. They should not get the same. They should get something that people can stomach.

To me it’s this golden playground. It’s a bit like Temple Run. You’ve got this street full of gold and there’s all kinds stumbling blocks and stuff, and we actually have to fix these stumbling blocks. It’s a bit like the 101. You go down to the Silicon Valley, you see how many millions of dollars are spent on different companies and you’ve got all these potholes at the same time.

The mobile web is there for us to make a good living with, but we just try to go for that big gold gem in the sky all the time. We want to be that $30 million seventeen-year-old kid that got bought by some company because this is the future. This is the same … I don’t want to say a strong word. This is the same lie that we have with this built-in obsolescence.

Yes, there will be one guy who’s actually starting to Facebook, there will be one guy who gets $1 billion for his company, but this is not maintainable. Not all of you can be that guy, and not all of you probably want to be that guy because they don’t have free time in their life anymore and a lot of pressure on them.

Who here plays an instrument or sings in a band? Why? You can never be as good and as successful and fast and rich as Justin Bieber. You don’t need to play your instrument, you need a producer. You need a nice dance move, you need some swag, and that’s about it. Why do you bother with this? You cannot be Justin Bieber. He’s much younger than you, he’s much faster than you, he’s much better than you.

Why do you do it? Because you like it. It’s fun to do. A musician is a person that takes thousand of dollars of gear 100 miles away to play $100 gig, because we love it. Because we want to do things and we don’t want that mainstream mediocrity that means that if you do the Justin Bieber thing and you’re successful for half a year you’re going to be in rehab two years later. So let’s play the long game a bit and think about what you’re going to do in 10 years with that, rather than, “Oh, money, money, money, more, more, bigger, bigger, bigger.”

We need lateral thinking. Which line of this one is longer? The upper, downer? Are they the same? No, they’re not. So why did all of you think that this is the same length? Because you’ve seen that thing before, it’s an old trick. It’s an old trap. It’s a clever trap. It’s obvious that they should different lengths, but it actually isn’t. You’re like, “I’ve seen that, you’re not going to get me again with this.”

This is how we build things right now. We learn hacks in browsers and then we internalize them and say, “The web will always be shit at that so I cannot do that in the future. I will do it like this for the next 15 years and, ‘The web just can’t do it, I’m sorry.’” Let’s think about it. Let’s measure things. Don’t get too excited about measuring like this. Lots of people get JS perf and these kinds of things, but it’s just like you can measure things but you have to measure them in context. Don’t fall into the too-clever trap. Don’t see the thing for the first time and you remember it didn’t work last time and say, “It’s not going to work again.”

What do we do now, instead of thinking about why we come and use the web? We build many, many, many, many awesome solutions. We build so many awesome solutions it’s incredible. We’ve got this Bootstrap. You don’t need to learn any HTML, just use Bootstrap and start from that if you’re not a professional. Grunt, Ember, Backbone, jQuery, Sencha, Hammer.js, Emmett, Compass, SASS, LESS, Zepto, blah blah blah, all these cool things that are coming out.

All of these things are great. They really are good. They are tools for power users that need to actually make their day-to-day job easier. They’re great. We just make new ones every month, that’s the problem with it, but we actually want to be more professional about it so we tell people, “These are the things you have to use, otherwise you are not really a web developer.” When I hear people say you need to know command line to be a web developer I’m like, “No, sorry, this is not the same. The command line is not on the web. You build things that are visual, you build interfaces, you build things that people need.”

We’ve got many, many awesome demos. This was going around a few months ago, a few weeks ago, a very, very remembrable URL fff.cmicmcn.com which showed all kinds of playful things and HTML 5 canvas demos and stuff. All of the things we’ve done in Flash four years ago and we now use in HTML 5 and we say, “This is awesome.” I think what we are having right now is an overflow of awesome.

I’m getting tired of seeing awesome, awesome, awesome, awesome. What I want to see is, “We’ve got this really terrible content management system. We have a room booking system, here’s how we fix it with HTML. Here’s how we made people happy across five different platforms.”

We don’t have to impress each other. We have to impress the mainstream. So stop building tools for each other and making the other tool do one thing less than the other one does. They’re all open source. Fork them, do things with them. Don’t build your own again.

I get excited about people building things. I’ve just been at POSCON in South Carolina, and all the developers you meet there are actually in small companies or freelancers. You show them something, I did a CCS 3 talk and two weeks later you get an email, “Oh, thanks for your talk, here is how I implemented it into my product.” I’m like, “Yes, this is exactly what I want to do.” Please build these things. Give it out to the main market. Don’t be excited that everybody is clever on stage and then be depressed that you’re not on stage and you build your own system so you get on stage. That’s a bit of loop we do at the moment.

The other day I had a guy in my gym in London ask me, “Hey you’ve got a computer, so you know about the Internet?” I’m like, “That’s obviously an interesting fallacy.” He’s like, “Oh, I want to get a new job. I want to learn about the Internet stuff. People say it’s really good to be a web developer and it’s a really good job to know that.” So I found this old laptop in my house that I cleaned up and I just put Ubuntu on it and a text editor and an HTML 5 book, and that’s what I gave him. I didn’t tell him, “Use Grunt, use Ember, start with Bootstrap.” That’s how I learned it, that’s how I got incredibly excited realizing that if I put a different color in there it looks different. Wow.

We can do that nowadays. The web needs no massive tools for production, for power users. Tools are great. For starters, don’t overload them with things that they can’t rely on in the future. All of these things are not built in the browser, so they might get outdated. They might get replaced. Don’t teach people things that are for just for the next two months.

How do we disrupt? How do we change that whole market? How do we get back to that idea that from the very beginning we said software is on the web and content is on the web, and it’s distributed worldwide without having to send floppy discs and CDs to each other? How do we go back to that?

The first thing is to stop being scared. Last year we had a few interesting things on stage here where people said, “Maybe the web is over. Maybe the web is going away.” We’ve got to keep the lights going. We’ve got to keep the lights going! I mean who of you as a web developer has problems paying their electricity bill? I didn’t know it was that high in San Francisco. My brother’s a fire man, he can’t find a job at the moment or a better job. He hates his job. But when he doesn’t do his job, people burn. When we don’t do our job things are five pixels off.

Don’t be worried about the future of the web. The web survived Flash. The web survived Java. The web survived Java Server Faces. The web survived any kinds of things out there because it’s a distribution model. It’s not technology. It’s not a certain stack of technology.

Will the web be the same in seven years? Hell, no. It will not be the same next month. That’s the power of the web. It keeps mutating. It keeps getting better. You cannot compare it with systems that are actually, “This is version one of the web, this is version two of the web.” No. This is worldwide changing constantly every second, and that’s the cool thing about it.

Chill out. Breathe. You’re going to have a job in five years, ten year’s time easily if you bet on the web right now. It may not be the same job, you have to be up on your feet and learn new things, but that’s what makes it interesting. I always hated a job that I got a pamphlet and like, “This is what you are going to be doing the next twelve years. No change, don’t worry about it.”

On the web, different story. New challenges every single day. I think we should stop copying. A lot of people, “Oh, there’s a native app that everybody uses right now, so let’s copy that in HTML 5. Let’s copy that in our technologies.” No, it’s a different idea. First of all you’ve got your obsolescence thing. Not every native app has everything in there in the beginning because they want to roll it out. If your app has all the features at the beginning you’re not going to have good time. You want to roll it out month by month by month. Trying to keep up with that is not possible.

Try to actually see the power of the web and the benefits of the web, of web technologies over native technologies. The biggest one is flexibility. If your app is not flexible you are doing it wrong. The thing should actually tell the user, “Okay, this works, this works, this works. I have a problem with that so I don’t give you that functionality.” Or just don’t show the functionality. Don’t promise things that you can’t fulfill. It’s an if statement, it’s not that hard to do.

If you copy, then kick ass. Sencha did this Fastbook and showed that the whole HTML 5 and stuff from Facebook was actually a misnomer and actually based on wrong assumptions. They did a good thing there and they showed basically that you can do a fast app on an iPhone in HTML 5, who should have known, like the ex-CEO of the company wanted it to be. That’s great. If you do these kinds of things then we should stop saying, “Yeah, but it only works in IOS and it only works in that.” Yeah, that’s what we cared about it in this moment.

We are fixing it together with them right now, and Flexbox is now in Firefox partly because Sencha Fastbook wanted to have it. We actually had a real, real good reason and demo to actually see what the problem was.

The other way to disrupt is to go where others don’t go. The problem is they’ll be like, “if you want to make money now only go for the iPhone market in America. That’s where people spend money.” This earth is this round blue thing and there’s these people, people everywhere and they want to do things on the web as well. Why not tap into a market that is not there for others? Why not tap into a market where the people that are actually driven by obsolescence cannot go, because the market can’t afford it, because the market can’t do it?

That is what we are doing with Firefox OS. I’m not here to make a pitch. I’ll just say what it is right now, because it is 90% of my life at the moment and I get incredibly excited about. We went to the Mobile World Congress, which is the most evil sales show on this planet. I spent two days just reporting incidents of booth babes to blogs in America that talk about inequality at conferences.

We rocked that thing. We were in every headline. Everybody released new phones, everybody released new things, and Firefox as an open source company, as a non-for profit organization giving out a free operating system was the main headline. Why? Because we got 18 mobile partners to partner with us and four hardware partners to bring out phones that are internet connected, that are web connected with smartphone functionality to markets that cannot get iPhones and that cannot get Android phones and can’t afford them.

Emerging markets like South America, like Eastern Europe, we have a lot of partners that go out to them. These aren’t partners that sell the thing with us, these are partners that actually code the thing with us. Instead of just having salespeople around them, we’re just like, “Okay you want to be part of this? Show us your engineers.” This is what where doing with that.

What Firefox OS does is replace old feature phones. We don’t replace the Androids, we don’t replace the IOS’s because we can’t compete on that market. We don’t have the marketing budget, we don’t have actually the hardware, we don’t have the people that want to actually partner with us because they’re like, “We’re just stinky free open hippies, that’s not right to work with.”

One of the main differentiators for us here in Firefox OS is first of all that everything is HTML 5 on that phone. Nothing in here is Java or Cocoa or Objective C. This is all HTML 5 and it’s on Github. You can go play with it. Of course for the mainstream market this means, “Oh, who cares?” What people care about is actually making it easier for them to find apps and to play with apps.

What is easy? Finding things on the internet. Maybe a search functionality, maybe something like playing with it. If you go on Firefox OS and hopefully my connector is working here, and I have a mouse somewhere, there you go. This is the emulator that was just put into Firefox as an add-on. Once you put it in there and it starts … Why does it do that to me when I go on stage? There you go. You can start the emulator. This is what it looks like. You got the error console, you can play with it, and this is the operating system itself.

If I go to a market right now and I want to have an app about my favorite band, I want to know something about a band, what do I do? I click through music apps, then I got 6000 of them, all of them reviewed by probably paid reviewers. I don’t know the name of those things. I don’t know what to do. That’s why we have to pay posters. That’s why we have to pay advertising, to get our name of our app into people’s heads. This is software, this is indexable software, why do we need this?

In Firefox OS, if you go here, you search for example Nine Inch Nails. Let’s do a good band. You get the background already changed into Nine Inch Nails and you get … oh we have nine here, wonderful. There’s a space in there, that was the problem. Let’s use U2 as another demo.

U2. I’ve got my background here. It changed into U2. I’ve got YouTube for videos, I’ve got Grooveshark for music, I’ve got SoundCloud for music, Wikipedia for written information. I can buy tickets on Songkick. It realized that I was entering a band and gave me your applications, anybody’s applications that are submitted in the market or are on the web. These are not the apps that are in my phone, these are apps on the web.

I can now click on this one for example, Grooveshark, and start listening to a U2 song if I really don’t like my life. Once I had a good experience with that app, I can go back and do a long click on the app and install it. A long click will then install it on the operating system. It will operate it like a bookmark like it does in IOS. It actually will install it with app cache, with everything going offline and giving you access to the hardware in ways that IOS doesn’t give you.

We made app discovery and app try before you buy as simple as actually surfing the web. If you have a mobile website and you want to sell an app, your mobile website is your advertisement for the app because we can index that for you and you can actually show up and do search results. This is bringing search technology to the app world, which is very interesting to me. I think it’s just, for you, a good idea to spruce up your mobile HTML versions that you have right now of your pages. You can play with that yourself.

Somewhere I’ve got my presentation again. There you go. I found that hard to explain to people at times. Once they started playing with it they entered a movie title and then they realized, “There’s movie apps, there’s Flixster, I can watch these movies.” You go from the use case to the app and from the app to the use case, which is what we do with closed markets right now.

The other thing we do is we enable hardware access. You’ve got all these API’s to access the hardware directly from JavaScript. The vibration API, which was called Vibrator API, I made too many stupid jokes, geo-location was one of the first things that we did years and years ago and then it went out to all the browsers. All of these APIs are not inside a SDK, these are standardized API proposals that other browsers can implement as well. Geo-location is across all browsers, the battery API is across all browsers. Network information, speed connectivity APIs have been used for others as well, indexedDB has been used by others.

You get full access to the hardware. That was always the problem in the iPhone, basically you got promise to access the hardware but you couldn’t get to it. You just had to build a native app going through PhoneGap or something like that. The other thing we did, of course we cannot allow any app to access every piece of the hardware, because you could make a puzzle game that calls 1-900 numbers in the background and racks up lots and lots of money. We actually have to review some apps in terms of security, how much access to the hardware you want.

We also came up with a system called Web Activities, which was much like Web Intents in Chrome, but it’s actually active. What it does, it allows you to use other apps to do something on your behalf. If you want to do a telephone call you have to have an app that is listed in the marketplace and reviewed by Firefox or by Mozilla. If you want to just do a telephone call from a web app that you host on your own server, you can use the telephony pick API here, so you’ve got the pick action. Nope. Okay, again.

You need a photo. If you want to have a photo you just call a pick action. You don’t care where the photo comes from. You don’t want to know if it’s from the gallery, from the wallpaper or if it’s from the camera. That’s what you do. You do a pick action, the user then chooses which ones he wants to actually use. Give you a photo; you get the photo back.

Same with the telephone call, you give the telephone action a call … telephone number. It switches to the dialer app. The user has to initiate the call. You don’t do it on their behalf. It’s up to them to actually make that call. Once they hang up you go back to your app automatically and you get the duration of the call and the telephone number that was called.

The difference to the pseudo-protocols and things that we had on IOS is that you get a feedback loop. You bring something to a native app and then you get the data back. That is cool because I don’t want to use your phone app all the time. I have a phone app that works fine on my phone. Why can’t I just use that? The Web Activities allow you actually to … any websites and any web app, to actually tie into other native apps of the operating system.

That works across Android and that works across Firefox OS as well. I love that because I don’t want to be in control for that. I don’t want to have your Flickr or Twitter or whatever credentials. These are yours, don’t give me them. It’s your way to share it on Twitter. It’s yours to actually take away. I don’t want my app to be responsible for things happening on your Twitter stream.

That is right now happening because we identify on behalf of the user the whole time. Web Activities allow any HTML 5 app to go into native apps and do their thing and get the data back. It’s much more important to me then actually accessing it myself and getting their information.

It works well with others. If you put Firefox on your Android all of these things, well not all of the APIs but the Web Activities, for example, work as well. So you can do that. Firefox for Android supports down to Froyo, so you don’t need the newest coolest Android to actually get HTML 5 support, sensible HTML 5 support.

Opera does the same thing now. Opera is also a browser you can install on Android to go back to an old version of android, rather than having Chrome only on the newest one.

Another big thing that we just released is that you shouldn’t make people think about the web but just come halfway. At the game conference that was just here in San Francisco we’ve announced ASM.js, which is also … there’s a meetup at 6:00 in our office today on the Eventbrite I think. What that one is, it actually allows you to convert C++ games or C++ code into JavaScript code.

If you’re a C++ company and you want to do something on the web but you really don’t want to re-educate all of your developers onto JavaScript because C++ guys looking at JavaScript makes them covered in hives and stuff, you can use that. One thing that we announce is the Unreal 3D engine, now running in JavaScript and Canvas and web GL in the browsers. You don’t need Flash to run 3D games.

Electronic Arts was one of our partners to actually bring out the 3D gaming onto the web and just convert their apps, convert their games, not write them from scratch because that’s not going to happen. We want to have the fidelity of 3D gaming on the web but we don’t want people to have to write from scratch, so we wrote a converter.

Same as the PDF displayer in the browser – it is also done through the same engine. Instead of having a plug-in that gets hacked every two months we just ran the PDF in JavaScript and the original thing was a C++ library. If you’ve got cool C++ stuff right now you can convert it to JavaScript rather than learning JavaScript, which to me is a handshake back to the 1980s where we can work together. The web will not replace you. We want your stuff. That’s what we do.

What can you do? How can you be part of that? The first thing that I have not seen yet and I want to see much more is context aware applications. Everybody has … okay this is a responsive design, it’s smaller on the phone and shows five buttons and it’s bigger on the other one. It doesn’t change the context. It doesn’t give you a way to actually work with it.

Imagine a company that actually has a guy walking around going to meetings. The interface on the phone could be start it there, find my location, stop the meeting there. When he goes back into his office and starts the desktop, he opens the same app, the same HTML app, and it actually shows him, “Okay, here’s what you did today. Please put the notes in there. Please put the photos in there. Upload the other stuff.” We do different things that we do on a phone than we do on a desktop.

We shouldn’t just make everything dumber because the mobile phone is the clever thing. We should give you a context aware app. What do you want to do on a desktop? What do you want to do on a mobile? What do you want to do on a tablet? Give you the best experience on all of these. HTML 5 is the only technology that allows you to do that because a native app cannot do this. You have to install three different apps on three different platforms.

That’s just not clever to me. That just doesn’t make any sense, that I have Temple Run on my tablet and my mobile phone, they’re out of sync and I have to do the same challenges on both of them? That’s just terrible for a small problem but it’s just not nice.

Go small. Go offline. If you can cut out a few k’s cut out a few k’s. If you can make the thing work offline that people can enter things while they’re actually waiting for it to load, great, that’s what we want. We want this experience to be as smooth as possible because we are impatient when we are on the phone.

We don’t really care about reloading a page three times on our desktop but on the phone it’s like, “This is broken, this is broken.” I love it in maps when people like, “We can’t find the map.” “Well it’s going to space for you, be a bit more grateful.” When I’m here, one pound, fifty per megabyte Internet roaming. If you have this 20 MB animated gif landing page, I hate you.

Fix the first generation mobile web. This was the login system at the airport in Barcelona, how it looked on my Android. Well that’s fun. Especially when you go through a second step it asked you for your passport number to get fifteen minutes of Internet access. Sure, I found somebody else’s passport so it’s all good.

That shouldn’t happen anymore. This is just silly. This is just … a viewport meta tag should be enough to fix that kind of crap. Make sure you realize … we’ve got wonderful things like VW and VH now in CSS as well, it can make typography resize according to the size of the screen. We can make the flexibility that Flash had years ago in web technologies easily nowadays.

Trust and help the platforms. You’re complaining that something doesn’t work in Firefox. Go to Bugzilla, complain, be annoying, put screenshots there. Put test cases there. Tell people what is wrong. Don’t go on Twitter and say, “Oh, Firefox does this wrong; I hope somebody from Firefox reads this and does my work for me.”

Same with Chrome, same with Opera, same with Internet Explorer, all of these things are available to you to complain where people are working on them. Not where we get applause from other people when we complain about them. Help us make the web better by using what browsers put in. I told you about @supports. Look at that tonight. Don’t animate anything in JavaScript. We cannot hardware accelerate your JavaScript animations. We can hardware accelerate anything in CSS because that’s our engine, but when you simulate what the browsers do natively we cannot help you make the web faster. Then it’s no help complaining that browsers are slow. You made that. You took over the browser’s job, so you make it fast.

Let us do what we need to do. Use translate instead of top and left. Use CSS animation. Use CSS transitions instead of JavaScript animate. We can make the thing better. Every six weeks there’s a new browser out. These things change constantly, please use that stuff. Give us feedback, what is necessary, what is unnecessary, what you like, what you don’t like. Jump right in, it’s fun. Yes it’s messy, but hey, this is fun.

Nothing stops you from actually helping the web of the future by helping the people who build the platform of the web. You can be massively successful tomorrow with a great native app. Good luck. Have fun with it. In half a year’s time it is going to be obsolete because the next one has to come. If you want to do that, if you want to play on the web, play by its wonderful, open rules and be successful by sharing and actually playing with things that come in there.

Every week I find something new in browsers and it gets me terribly excited. It’s a sad life. If I had some of the things that I had in the past … that I didn’t in the past, I would be on a beach now or something because I wouldn’t have to work anymore. Every browser is a developer platform. Every browser is a conversion tool. Reader Mode in browsers allows you to actually fix a lot of sites and actually read them nicely rather than have to click through two thousand ads. With that, I am out of time. I thank you very much.

The vanilla web diet – keynote at Anglebrackets in Las Vegas

Tuesday, April 9th, 2013

I am currently in Las Vegas for the Anglebrackets conference and after suffering a American country music festival in my hotel I got up this morning to deliver the keynote, talking about using web standards and approaching web development in a simpler fashion. Here is the abstract.

Web development as it is right now suffers from an obesity problem. When computers and connections were slow we had to be frugal with our resources and optimised for the user, and not for us as developers. Our amazing machines and fast connections now allow us to not worry too much about page weight and dependencies. Or so we think. The move of our end users from desktop machines to mobile environments mean that a lot of what our products need is not available and – without being able to test those scenarios – we deliver a terrible experience. In this talk Chris Heilmann of Mozilla is going to show how using HTML5 and plain JavaScript together with CSS can help us build fast, beautiful experiences for the desktop and the mobile web and the next generation of platforms around the corner.

The slides are available online and the screencast is on YouTube

Setting disruptors to stun – keynote at HTML5 Devcon in San Francisco

Tuesday, April 2nd, 2013

Update: Video and Transcript are now available

I just got off stage at the HTML5 Developer conference in San Francisco, California. The massive ballroom was packed with folk and my task was to set the mood for the day and be inspiring. Turns out it seems it worked well.

The abstract I submitted was this:

When the web came around it shook the foundation of IT at that time. World wide distribution independent of platform and environment? People allowed to write code without having a degree, a beard or suspenders? Unthinkable! Now we are the mainstream and the pendulum swings the other way – we are the disruption target and we lose our users to closed, specialised environments. Or do we? There is nothing stopping you from dazzling audiences with web technologies – all you need to do is to get back some of the excitement we felt when we fought the machine. In this keynote Chris Heilmann will show how you can get your web mojo back and reach a market of millions of new users that will be available to you this year. All you need to do is to give your web apps more love and stop trying to copy what you cannot deliver.

Here are the materials of the talk – and I will release the notes in a cleaner fashion later.

The slides are on the web and a screencast on YouTube. This is a raw screencast recorded on stage, so the sound quality is not the best. There was a video recording and you should soon be able to see that online.

Here are the links I talk about:

CSS3 – know your arsenal – a show and tell at Posscon

Friday, March 29th, 2013

In the afternoon of the second day of Posscon I was asked to give a talk on the benefits of CSS3. Instead of having a presentation I put together an interactive slide deck with direct Q&A. Here is the recording of the session.

The slides are posted here and you can see a
screencast of the session on YouTube

In the session I covered the benefits and pitfalls of using CSS and showed how newer features like advanced selectors, pseudo selectors, transforms, transitions and animations can make it easier for you to create beautiful web products with much less code than before.

“Is open still enough?” – Keynote at Posscon 2013 at Columbia, SC

Thursday, March 28th, 2013

I just delivered the Keynote at Posscon in Columbia, South Carolina talking about the history of Mozilla, open source now and how Firefox OS is ready to disrupt a very closed market.

Abstract


In the open source world we know why we put our time and efforts into the larger goals we try to achieve. We successfully showed that the barriers and lock-ins of the past don’t hold up in the test of time and got even the enemies of old to release their code.
This made us lax and we can be seen as hard to talk to and deal with. We seem to have quite a strong lack of empathy for people who don’t “get” open and our behaviour can lead to a lot of opportunities to go wasted.
Times change and the new mobile computing world and closed app markets give end users an incredibly alluring world of simplicity – a world that is built on lock-in, afford-ability and making the user the product. A world that the open alternatives to date can not match when it comes to simplicity and shininess.
Mozilla, amongst others, is battling this change by offering a truly open alternative called Firefox OS. In this keynote Chris Heilmann will show how open can still win the minds and hearts of the main market and what we as an open source community can do to avoid the future to be behind shiny and yet sturdy bars and locks.

Slides and screencast


The slides are available online and the Screencast of the talk is on YouTube.

Notes


Today I am here to talk about the success of open source. At a massive open source conference. Bit of a no-brainer, isn’t it? So I want to take this opportunity to share my views of how open source changed the IT world, how the foundation I work for had a massive impact and what challenges lie ahead for the world of open source.

Specifically I will talk about the world I know about and care deeply for – the web and how its use changed media as we know it.

I work for Mozilla, a large player in the open world space with the flagship product being Firefox, the web browser. Mozilla emerged from the ashes of Netscape, with its Navigator and Communicator products and the messy fight with Microsoft. When the dust settled after Netscape was defeated a few of the Netscape folk realised that the web needs something that is open, free and a way to promote standards above closed software and technology. Thus Firefox was born. In its very core the values of Mozilla are to keep the web open, available to everybody and that consuming the web is on the terms of the end user. Not the terms of a corporate agenda, not the monetisation of a product, not the need to build products that age very fast so that you need to buy the next one.

Firefox brought the web to people who didn’t have it. Without it I am very sure we wouldn’t have had Wikipedia, we wouldn’t have had the social web revolution, and we wouldn’t have had all the open source goodness we have on the web with great products like WordPress, Drupal and others taking on traditionally very commercial markets.

This is not because of Firefox the product. It is because of Firefox the idea. The browser that is dictated by the needs and wants of the users. The browser that doesn’t shy away from making unpopular decisions in the eyes of developers when the security and privacy of end users is at stake (remember WebSockets?).

From the very beginning Open Source was the main success factor of Mozilla and Firefox. First of all you can’t destroy what is open and distributed. You can not buy it out, you can not block it. Open Source projects die when end users don’t care about them or developers don’t keep them up to date or don’t hand them over to other people who care in time.

And here is the amazing thing. A lot of years went past and by now, open source is very much the standard when people start web projects. Other browsers are open source, libraries, frameworks, whole operating systems are.

One of the things we have to give a lot of credit for this is ironically enough not open source although it builds on an open source infrastructure: GitHub.

GitHub made version control easy, it made pull requests and commenting social and it had a friendly interface – something incredibly important but sadly enough far too often forgotten.

Traditionally a lot of companies, users and developers flocked to more closed environments as they were simpler. We got to admit that we expect a lot from new developers and the open source crowd is not that known for being the most embracing and welcoming when you don’t play by the rules – rules that in a lot of cases don’t even get explained.

With Github it became easy, and it makes sense for people to release their products there. They get the benefits of version control, and have a direct channel to end users. There is no long process to become part of a project. You fork it, you fix it, you send a pull request.

This is great and it makes me very happy to see that people care to release their products open source. However, I start to see a bit of an annoying trend concerning this: it is fashionable to release things open source.

Companies have a hard time hiring new developers. It costs a lot of money to get an engineer through the door and finding them is not easy. That’s why it makes sense to go where the developers are. And GitHub is that place right now.
This leads to a lot of strange products being released as open source without really being it. I found two main happenstances here that I refer to as Ta-Dah sourcing and pasture sourcing.

Ta-Dah source is when a company releases an open source version of a commercial product after releasing it commercially. All the new features and design decisions are done by the company and the source is then released a few weeks later. This is fair enough, but it smacks of using the open source community to fix your problems rather than making them part of the design process and have a say in the direction of the product. It also means that derivatives of your product will always be a version behind and get rude awakenings when you change something very vital to the original product.

Pasture sourcing is when a company or an individual throws a product over the fence to the open source crowd to maintain it for them as they lost interest in it, or it doesn’t really fit their company goals any longer. This way of releasing open source has a bitter aftertaste. It feels as if the company is doing the open source community a favour by releasing code, but it actually just means that you throw out damaged goods or something that is not fashionable any longer. You don’t really act out of altruism or to go open source, all you do is to feel smug about “not letting a product die” by making other people do the maintenance work for you.

Both of these approaches assume that communities around your products happen magically and don’t need any supervision. That is never the case. Open source developers donating their time and effort are not worker drones to do free work for you. You should give them the respect, guidance and feedback they deserve.

Of course not all companies do that wrong. I want to give a quick shout-out to Adobe here. Yes, Adobe the evil corporation that brought us Flash and Dreamweaver and Photoshop and Illustrator. Adobe saw the sign of the times and that open is better than closed. That’s why their new HTML5 tools are built very much with feedback from the community and their web-based editing tool, Edge Code is released in parallel as an open source project called Adobe Brackets.

Adobe Brackets is a great example how a very closed and highly commercial company can go open when the right people have the audacity and stamina to plow through meetings and give lots of internal presentations. Not only is the code of Brackets available – they also have a great way to triage new bugs and invite new developers to come in. Easy to fix bugs are being flagged as that to get people into the project with a quick win, and not by being overwhelmed with tons and tons of documentation. The project planning is openly visible, and pull requests from the outside take precedence over internal ones. Thanks, Adobe for being a good role model.

There is however a big change happening that is quite a throwback in the terms of open source. Many, many new users start on the web with a mobile device and when you look at that market, the word open is mud.

The mobile market is a highly competitive one and it seems the most money is made by suing each other over patents. It is also an incredibly weird market where the people who shout the loudest are not the ones who make the most money.

It is a market where people closely guard their products and try to keep their cards close to their chest. The massive scare-word is fragmentation, which we who work in the open would call choice.

In a highly competitive market the main issue you have is that you want to have an ongoing presence. You don’t want to build a product and then not see any of it any longer. The concept of in-built obsolescence is very, very common. You got to make sure people want new, bigger, better, faster more. And you need to build the shiniest product.

This didn’t go down well with Mozilla. We are here to keep the web open and free and leave it the choice of the user what to use to go online. We also wanted the web technologies to be the platform of choice because of their open nature and them being built on agreed standards.

It all started that way – in the 1997 keynote Steve Jobs talked about reinventing the phone with the iPhone. He also very much pointed out that HTML5 and the Safari browser (which is built on the open source WebKit engine) is the platform your apps run on. “No SDK” was the message. That changed, and my educated guess is that in-built obsolescence is the reason.

Nowadays all the apps that want to really perform and get access to the interesting hardware in the phone need to be written in Objective C and be distributed through the marketplace as apps. HTML5 apps are of course possible but they get a slice of the pie, not the full one.

Android is better as it is open source. Well, to a degree. It suffers from the same issue that HTML5 apps are limited in their access. Even worse, older Android versions have a stock browser that is lacking in very necessary HTML5 support features, which is why Chrome, another Google product is now on newer Androids.

Newer Androids being the main point here – the goodness of HTML5 is not given to older phones and tablets not capable of supporting the latest Android. Android is full on in competition with iOS and thus has to play the same game of in-built obsolescence.

We saw this and realised things have to change. The first thing we did was beef up Firefox for Android, which is a browser you can install and gives you lots more HTML5 goodness on Android with backwards compatibility including Froyo. On iOS, no browser is allowed that doesn’t run the same JavaScript engine as Safari, which means Firefox can’t get there. This even forced Opera to swallow the bitter pill of ditching their engine and make their browser WebKit based.

We also realised that the lock-out happening on the mobile web is not only based on expensive and fleeting hardware but also in the infrastructure around it. Many people in emerging markets would love to play with apps and the new mobile web world but have no credit card and their connections still cost by the megabyte, which makes a 50MB Angry Birds upgrade a costly affair.

So we went the extra mile and built Boot2Gecko. This was a new operating system for mobile devices based on the same Linux core as Android. On top of that we have a stack of drivers and open, standardised APIs to access the hardware via JavaScript. The rest of the phone is Gecko – the engine that powers Firefox. Every single thing in the phone’s interface and in the apps you build for this platform is HTML5. It is the hardware platform and OS the standard deserves.

We showcased B2G last year at Mobile World Congress – the biggest mobile event and a cut-throat sales show. We had some success. We went home, did our work and came back – and this year we owned the show.

In two days I gave 54 interviews to all kind of media about Firefox OS as the final product is called now. Everybody wanted to know about that open source thing that managed to attract 18 mobile provider partners and 4 hardware partners to bring phones to emerging markets where other approaches have failed.

Firefox OS is the open answer to all the problems I mentioned. We are not trying to compete with Android and iOS on the high-end. Instead the aim is to bring highly affordable phones to a market that wants to go online on their terms – with billing to the carrier and apps that can be tried out before you download them.

Let me quickly show you what that means. {demo}

The great thing about all this is that Mozilla built this system over the course of two years. Not as the open source deliverer for mobile providers but with them – a lot of the code has been written by partners.

The beauty of all of that is that when you write apps for Firefox OS, you write them on your own terms. You can publish them outside the market, bill your users with a payment API instead of having them sign up for a marketplace, and above all – your apps will also run on Android, iOS, and desktop browsers. You will not get all the goodies you get in Firefox OS across the board, but nothing stops you from using PhoneGap to, well, bridge that gap.

We bet on open and we won a massive battle. Now we are ready to roll out enjoyable mobile experiences for the masses without them having to be part of an arms race between two large corporations. This is about getting people online, not about getting them as consumers. And that, to me, is a massive opportunity.

So here’s to an open future of the mobile web. Come, join us.