HTML5 = new world of hackable games

March 12, 2012 § 10 Comments

I believe HTML5 will create a new class of games: webbish games that, like the web itself, are hackable by design. These games will let you pull assets and data from across the web into your game world. And, they will let you remix, fork and share to your heart’s content. The result will be fun for people who like games — and huge potential for webmaking and learning.

The first glimpse I got of this was Jono Xia’s RunJumpBuild, a very simple side scroller level editor. While RunJumpBuild is rudimentary at this point, it shows an important idea: web games can pull anything with a URL into a game. A picture. A sound. A video. Data. RunJumpBuild is designed to let people create game levels that are made up of the web.

This may sound like no big deal. This is how millions of everyday web pages already work: displaying an image from Flickr; embedding a video from YouTube; pulling in Twitter and RSS data. But, just like movies, most games don’t work this way. Games tend black boxes, firewalled off from the social and creative assets of the web. IMHO, this is a missed opportunity for fun and creativity.

The other thing we’re starting to glimpse is games where ‘the web is the level editor‘. Of course, hackable games are nothing new. There is a long history of game modding. However, most modding uses level editors designed for a single game or game engine. HTML5 games will change this: the web programming stack (HTML, CSS, JavaScript) will become a universal level editor.

Enchant.js is an early example of this. It’s a rudimentary JavaScript framework for making 2D games. What’s notable is the invitation to ‘fork’ that is included in all the sample games. Press the ‘fork’ button and you get pushed into an editor that lets you work with the HTML, CSS and JS code that makes up the game.

While these developments are nascent at best, I believe they hold great potential for Mozilla’s webmaking work and for our efforts to promote HTML5 games through our app store. At the webmaking level, the potential is obvious:

  • Games are where the people are
  • Hackable games can teach people basic web mechanics
  • -> e.g. a URL is how the web knows where things are
  • They could also teach HTML / CSS / JS to non-programmers
  • -> games = motivation to learn the ‘universal level editor’

With this in mind, we’re starting a number of HTML5 game experiments as part of our webmaking work. The most significant is Gladius, a game engine which uses the web’s most popular 3D game libraries. We’ll use Gladius to build sample games with a web native level editor as a way to test out the ‘hackable web games’ idea. We’re also considering hackable game experiments built around basic 2D game archetypes and learning-oriented game experiences using Processing.js. All of this is in very early stages of development.

Obviously, there are a bunch of big design questions that will come with this work. How do you use content from across the web to add fun and playability into a game? How do we create simple UX to onramp people who have never edited HTML / CSS / JS before? And how do you layer in the learning angle? The good news is we have many of the same questions with Hackasaurus and Popcorn, so we’ve got a head start.

As an example: we’ve already done alot of work with Popcorn to build an ecosystem of plug-ins that pull services and data into a web native video production. We have plugins that make it easy to throw Twitter, Flickr or GoogleMaps into or around your video. We should do the same with games.

Why does this matter? Because much of the HTML5 talk today treats games like a black box — using things like Google’s NaCl to port existing C++ games to the web. This is similar when we first started Popcorn, a time when the web was seen simply as a distribution channel for a black boxed video. Now we’re starting to show that video on the web can be about something totally new. We can do the same with games: to seed a whole new class of games that are actually designed from the ground up to work like the web, and that are more fun because of this.

Rumour has it that Dan Mosedale, Alan Kligman, Bobby Richter and Rob Hawkes are going to be blogging about some of our plans in this area in coming days. So watch for that. Also, if you know other examples of hackable HTML5 games please let us know about them. We want to work with any and all people who are exploring this space.

PS. Yes, there is a typo in the word ‘learning’ in the diagram above. That’s part of my charm.

Dan Sinker joins Mozilla as MoJo lead

July 22, 2011 § Leave a comment

I’m excited to announce that Dan Sinker will soon be joining us to lead the Knight Mozilla News Innovation Challenge (MoJo). MoJo is already kicking butt. It’s about to kick even more.

I knew Dan was the right guy for this gig when I learned that he a) taught web dev to journalists at Columbia College for 3 years and b) successfully ran Punk Planet magazine for 13 years. Web dev, journalism and gritty business chops to boot. Exactly the sort of things MoJo is about.

Dan’s other claims to fame include: a year as a Knight Fellow at Stanford; entertainingly imitating the Mayor of Chicago on Twitter; and belonging to a secret mailing list of menschy hipster dads with young children.

Of course, it’s what Dan is about to do with MoJo that has me most excited. When we first met over tap water in an AirBNB’d living room, we jumped right onto the topic of ‘wow we could build a huge and really awesome news innovation community‘. We’re still talking about this today. Dan wants to make it happen.

Dan is going to do an excellent job running the MoJo fellowship, for sure. I also believe he has the chops and vision to turn MoJo into something much bigger.

Welcome, Dan. See you on August 8th.

The challenge: reinvent ‘TV news’ online

May 3, 2011 § 9 Comments

Recently, we’ve seen a huge change in video online. The advent of web native <video> makes it possible to mash up moving images with social media, tie clips to data from across the web or, more simply, create simple transcript-based interfaces for navigating long pieces of video. Yet, despite the these capabilities, we’ve seen almost nothing in the way of new kinds of storytelling. Telling stories with video online today looks pretty much the same as it did when I used to shoot local TV news 20 years ago.

This is something we hope to change with the first Knight Mozilla news innovation challenge topic. We’re inviting hacks and hackers from around the world to answer the question: how can new web video tools transform news storytelling? People with the best ideas will get to bring them to life with a full year paid fellowship in a world leading newsroom.

The next ‘montage moment’

What do I mean by transform storytelling? Just that: taking today’s online video tools beyond the mechanical and obvious, bringing people, ideas and events to life in ways we haven’t seen before. To get your imagination going, think back to how visual storytelling emerged in the world of cinema.

The Lumiere brothers made some of the worlds first films. Workers going to a factory. A train arriving at a station. Etc. The Lumiere’s fixed frame wasn’t much to write home about in terms of story. But seeing moving photographs was hugely impressive to most people at the time. It was a technical wonder.

It took 25 years for Eisenstein to grab hold of this technical wonder and then say: wow, I bet you we could tell a more powerful story if we varied the shots a bit and then edited them together. With Potemkin, he invented the visual language we still use to tell stories today: montage.

The fundamental technology didn’t change in those 25 years. The Lumiere’s knew how to splice film and move the camera around. Eisenstein’s breakthrough was to use basic film technology to tell a story in a new and creative way. Which is very much like where we are at with web native video today: huge technological potential just waiting to be seized for creative storytelling. What we need now is a ‘montage moment’ for the web era.

Open video: a huge palette of awesomeness

The potential of web native <video> truly is awesome: we can now link any frame within any video to any other part of the web. This was hard to do in the world of Flash video. The introduction of the HTML5 <video> tag over the last two years has made it easy.

Early experiments and demos hint at the potential of this new open video palette. With the recent State of the Union, PBS used Mozilla’s popcorn.js tools to synchronize their live blogging with the timecode of the President’s speech:

The same tools have been used to show how transcripts can be used to search and then navigate immediately to anywhere within a long clip. This demo from Danish public radio shows how this can work with web native <audio>. The same thing could easily be done with video.

Of course, the big potential is in connecting video to the massive amount media and data that already exists all across the web. Imagine if you could weave the sum of all human knowledge seamlessly into your news story or documentary. That’s now possible. This book report demo shows the basics concept, with a student connecting her narration to wikipedia articles and news reports.

Google and Arcade Fire took this idea a step further, pulling moving images from street view and Google Earth into a rock video. If you enter your zip code, your neighborhood becomes a character in the narrative in real time.

The Japanese based Sour-Mirror went even further, pulling you into the video. Enter your Facebook ID and turn on your camera, and then you become a character in the band’s video. Again, in real time.

These demos make an important point: the line between what’s in the frame and what’s on the web is dissolving. Or, put nerdily, timecode and hypertext are fusing together. They are becoming one.

Are you the next Eisenstein?

Despite all the niftyness, there is a problem: these demos do not yet tap the open video palette to tell stories in meaningfully new ways. Open video tools like Mozilla’s Popcorn and Butter provide a starting point. But they need people with a creative flair for both web technology and storytelling to bring them life. Which is exactly why Knight and Mozilla threw out ‘how can new web video tools transform news storytelling?’ as our first MoJo challenge question.

We’re hoping that you — or someone you know — is up to this challenge. If you think you are, you should enter the MoJo innovation challenge. All you need to do is: draw up a napkin sketch showing how you might tell a story in a new way with open video, write a brief paragraph about it and then submit it online. If your idea is solid, you’ve got a good chance at a fellowship where you could actually bring it to life at the Al Jazeera, BBC, the Guardian, Die Zeit or the Boston Globe. Who knows, maybe you could be the Eisenstein of open video?

Find out more about Knight Mozilla News Innovation Partnership on the MoJo web site. Or enter the MoJo news innovation challenge today.

MoJo Interview: popcorn, video and news

April 29, 2011 § 1 Comment

I asked Mozilla Web Made Movies Lead Brett Gaylor excites him about news and video on the web today. He said: “Open video can help re-establish journalism as the fifth estate.” As the first Knight Mozilla news challenge topic is about video, I asked Brett to say more about this:

Brett riffs on the idea of a ‘wonk-a-pedia’ that uses open video on the web to connect video clips of politicians to their voting records, past positions and so on.

The current MoJo challenge topic is about exactly this question: how can new online video tools transform news storytelling? Tying video snippets to other web content and data. Letting audiences join into the debate. And do on.

If you’re a talented web developer excited about HTML5 video, you should enter this first MoJo news innovation challenge. If you want advice or inspiration, head on over to popcornjs.org or Mozilla’s popcorn IRC channel. Lots of people there who can help you out.

Just think of it: you might end up at BBC, the Guardian or one of our other news partners working on the next big thing in online video. All you have to do to get started is submit your idea.

This post is part of series of interviews with people involved in the Knight Mozilla News Innovation Partnership (MoJo). Find out more about the partnership on the MoJo web site or enter the MoJo news innovation challenge today. I’ve also posted a really simple primer on MoJo.

MoJo interview: Al Jazeera + innovation

April 28, 2011 § Leave a comment

I asked Al Jazeera’s Mohamed Nanabhay what excites him about news innovation on the web today. He said: “I’m excited by the sheer velocity of change going on. The web has taken the concept of live news and stretched it to the limit”. As a part of our joint work on the MoJo, I asked Mohamed to say more about this:

Mohammed also talks about the merging of traditional media and social media: a phenomena that has shaped a great deal of the coverage of recent events in the Middle East.

As Mozilla Knight News Innovation partner, Al Jazeera English will be hosting a fellow who will work on web apps that explore this trend. I know that Mohamed is especially interested in fellows who want to work on grassroots reporting, social media and video, which  ties into our current MoJo challenge topic.

If you’re a talented web developer or designer, you should enter the MoJo news innovation challenge. Who knows: you might end up at Al Jazeera building the next big web news app.

This post is part of series of interviews with people involved in the Knight Mozilla News Innovation Partnership (MoJo). Find out more about the partnership on the MoJo web site or enter the MoJo news innovation challenge today. I’ve also posted a really simple primer on MoJo.

MoJo news challenge: what is it?

April 28, 2011 § 1 Comment

Earlier this week, Mozilla and Knight launched our first news innovation challenge (aka MoJo). We’ve had good buzz, but also people saying ‘what is this thing?

I wanted to come up with the simplest possible explanation. At the top level, the idea behind MoJo is:

Back five individuals to build mind blowing web apps
in collaboration with world-leading news sites.

Broken down a little more, Mozilla and Knight plan to:

1. Find five incredibly talented web developers and designers.
2. Give them a paid fellowship in a world-leading newsroom for a year.
3. Using these newsrooms as a lab: build open tech and web apps that shape the whole field of news.

If you are an incredibly talented web developer and designer, you should enter the challenge over the next five weeks. Here is how:

a. Submit your idea for a news web app or tool. All you need is a napkin sketch to start.
b. If your idea is good, the brightest minds in web tech and news will help you build a prototype.
c. If your idea is really good you’ll have a chance to build out your app during a one year fellowship.

Why does Mozilla care about the future of news on the web? Because:

We want to see the open technology and participatory culture
of the web become a core part of how news is made. This is
good for the web and good for society.

If you want a slightly more detailed but still simple overview of MoJo, you might want to watch this two minute explainer video:

Phillip Smith’s 10+ reasons to enter the Knight-Mozilla news innovation challenge is also a great read. And, of course, you should also check out the MoJo web site and the first challenge around open video and story telling.

Media, freedom + the web: berlin talk

March 24, 2011 § 5 Comments

As I pointed out a while back, this year is Marshall McLuhan’s 100th birthday. It’s a good time to be thinking about media and the web: in particular about how the free and open medium of the web is shaping all media that came before. Increasingly, this is a theme for Mozilla Drumbeat in 2011.

Why now? Yes, partly because it’s Marshall’s birthday. But more importantly, we’re at a key juncture: traditional media are increasingly reinventing themselves by tapping into the essence of the web; at the same time monopolies in spaces like social networking and mobile apps are calling the freedom of the web into question. Things could go either way: open or closed.

Back in February, I explored this theme in the annual Marshall McLuhan Lecture at the Canadian Embassy in Berlin. I’ve re-recorded the talk and posted it here:

It’s a long talk: 40 minutes. If you just want to get a feel, you can flip through the PDF version. Or, you can download an mp3 audio version or an ogg video version.

At a high level, I believe we have to make a number of critical choices in coming years that will impact media and society for decades to come. My three top level points are:

MFW Berlin - The Web is Made of Freedom

We rarely call it out, but the same basic principles that make free software and open source great are also baked into the very fabric of the web itself. The web gives us the freedom to use, study, remix and share — that’s what we are all doing at a massive scale. We do these things because they are baked into both the technical building blocks and the culture of the web. When we think about the web as the medium that is shaping our times, it’s important to remember that this kind of freedom that is central to what’s going on.

McLuhan said: “The next medium, whatever it is – it may be the extension of consciousness – will include television as its content, not as its environment, and will transform television into an art form.”

This has happened. And it hasn’t just happened to television. All media have become the content of the web. As a result, all media are wrapped in this context of freedom: in a world that lets you bend and share without asking permission. The initial reaction from old media was push back. But times are changing. We’re very clearly entering a phase where smart media players are using the essence of the web to reinvent themselves. Eg. witness the Guardian and Wikileaks or Al Jazeera in Egypt.

MFW Berlin - We Get to Make Choices

The context is a web built on freedom. The opportunity is that all media are reinventing themselves in this context. If we seize this opportunity, we can bake things like transparency, remix and sharing into the media culture and practice for the next 100 years. That’s what we’re trying to do with Mozilla Drumbeat projects like popcorn.js: build tools that give filmmakers and journalists access to the essence of the web. If we succeed, we also bake the web into how whole industries work and think.

Of course, there is another direction we can choose: we could close down the web. Tim Wu talks eloquently about this in his book the Master Switch. Talking about media empires in the last 100 years, he says: “Open eras tend to last for about 15 – 20 years. And then they flip into being more closed. 
We may be at the beginning of the closing with the internet.”

Specifically: we could give up our privacy and identity to one or two social networks; we let one or two companies decide who gets to innovate and create software; we could let governments decide whether we get to access the internet at all. The result would be a very different web than the one we have now.

It’s this point about choice that makes media such an important theme for Mozilla and Drumbeat in 2011: now is the time to aggressively, creatively and playfully promote web technology and web thinking in the broader world of media. What we do now will shape media — and society — for a long time to come.

I’d love to get people’s feedback on the ideas in this talk. And, even more, I’d love to see people building things and playing with the theme of media, freedom and the web as part of Mozilla Drumbeat in 2011.

This is the third in a series of posts about media, freedom and the web. I’m hoping to do more, including a few posts on the future of cinema.

Where Am I?

You are currently browsing the mfw category at commonspace.

Follow

Get every new post delivered to your Inbox.

Join 6,501 other followers