Follow Internet Explorer on Twitter by clicking the below button!
When we launched Dev Unplugged on March 1st of this year, we knew what we were hoping for: amazing web experiences that pushed the limits of modern browsers, particularly in the genre of gaming and music. We set the bar extremely high and challenged developers to show everyone where they thought the web was going.
It has been a daunting process working our way first to 40 finalists and now to 18 winners and runner-ups. It was clear going through the submissions how much time and effort developers put into crafting their apps, and we thank everyone who entered the contest and hope they enjoyed the experience of building on HTML5 and IE9.
We are now happy to put an end to the suspense, and announce the winners of the first Dev Unplugged contest! The 18 winning submissions come to us from 13 different countries, and we think that is a testament to both how quickly HTML5 has caught-on and how level the playing field is globally for client-side developer talent.
Our Grand Prize winner is Edan Kwan, a freelance web developer in Hong Kong, China. Edan wins not just $9,000 USD but also a Golden Ticket to the Future of Web Apps conference in Las Vegas! It’s a fantastic event and we’re excited to be sponsors this year.
Edan discovered Dev Unplugged when he saw a note about the contest on one of his favorite web sites, theFWA.com. He decided that this was an excellent excuse to expand his skill set beyond Flash and learn HTML5.
Edan didn’t take a well-worn path into the world of web development. He spent three years after University pursuing a singing career in Hong Kong (seriously!) and was first exposed to web development when a small project from Logitech fell into his lap. As he taught himself to code and raced against his deadline, Edan discovered he had a natural talent for interactive design and quickly started to make a name for himself.
Edan’s submission was an ingenious application that was part music video and part videogame called Music Can Be Fun. When I spoke to Edan about MCBF, he told me that he initially drew some inspiration from an elegant website (built by the interactive agency Badabing!) for the recording artist Virginia Labuat. Starting with this kernel of an idea, he re-imagined how someone could experience music and completely trashed the arbitrary boundary that we had set-up between “gaming” and “music” experiences.
The soundtrack for the app was the song “Boy”, by the band Ra Ra Riot. When the band had a chance to play with his app, they were impressed:
“Ra Ra Riot is excited to see their song “Boy” incorporated into the winning site for the Dev Unplugged contest. Edan Kwan did an amazing job presenting immersive visuals that brought the song to life in such a creative way. Music Can Be Fun is quite addictive and I am sure we will be playing with it as we make our way around the globe from show to show.” - Josh Roth, Owner/Manager, Light Fiction Management
Moving beyond what the app was, I wanted to dive in to how Edan had built it and the tools he used. His application is very rich (music, graphics, fast-moving, interactive). I asked Edan if hardware acceleration played a role in broadening the horizon of what her thought he could create:
“The original idea of my app didn't have different backgrounds and very many elements because when I was testing in other browsers, the FPS was pretty low. But when I tried testing on IE9, I was wondering why it ran faster than other browsers. And then I realized that it was the help of its hardware acceleration. Then I started drawing most of the elements (especially complex vector objects) into the canvas caches to boost performance. After this optimization, I managed to add more visual effects into my app and it was wonderful.“
I was shocked to learn that Edan had taught himself HTML5 from scratch over the course of 3-4 months. When I asked about his development environment, he told me that his primary development machine was an HP laptop running Windows 7 and coded using a combination of Visual Studio Express and Internet Explorer 9. If you’re interesting in learning more about how Edan built MCBF, check-out the first of a series of blog posts on his experience.
1st Place in Gaming HTML5 Canvas Breakout Frédéric Falliere (France)
1st Place in Music Royal Wedding Stas Goferman (Israel)
As great as Edan’s submission was, it was simply the best of a fantastic crop of winners. The winner of our Gaming category was HTML5 Canvas Breakout by Frédéric Falliere of France. The judges loved how the Frédéric’s personality came through and the unique twists he added to a classic game.
The winner of our Music category was Royal Wedding by Stas Goferman from Israel. Didn’t get an invite the William and Kate’s royal wedding? No worries! Royal Wedding lets users sign-in via Facebook, create an avatar based on their profile picture, and join the “virtual” royal wedding along with a host of other celebrities.
In addition to the Grand Prize and First Prize winners, each category had two 2nd place winners and four innovation awards. Check-out all the winners below and make sure to pin your favorites!
Finally, there were 9 runner-ups, or as we like to call them “pretty freaking awesome, too” submissions.
We on the IE team hope that everyone who participated in Dev Unplugged had a great experience. We have been overwhelmed by the enthusiasm and creativity that everyone put into their applications, and it’s gratifying to see so many developers getting on-board with HTML5 and building the next generation of web experiences for modern browsers. It has been especially cool to walk around the office and see so many of these apps taking up residence on my co-workers’ taskbars. They’re that fun!
If playing with these apps has inspired you to see what you can do with HTML5 and IE9 (and I hope it has), one good place to start is Channel 9 and these videos on HTML5 from MIX11. If you’re interested in learning how Andrew West enhanced his winning app for Pinning, please check-out BuildMyPinnedSite.com for case studies, cookbooks and code to get started.
I don't understand. Does really anybody think that breakout game pushes the limits of HTML5? It's "classic game" because it's old and it's old because it was easy to make for first computers. "Hey, look, HTML5 can do now what Atari could in 1976." -- not very inspiring. HTML5 canvas breakout doesn't show anything new that couldn't be done ten years earlier with pre-rendered graphics... no real need for canvas, SVG, video, audio, contenteditable, drag&drop. Also no breaking of boundaries between web and native applications.
Maybe my judgement is blinded by the fact my game didn't win anything. Sincere congratulations to the Grand Prize winner. Just for transparency, could you please publish full comparative table with individual weighted Judging Criteria scores by Official Rules 6. a) I.?
Congrats to all the winners! Especially the amazing Edan Kwan, who is in a league of his own. I must say that I played MCBF over and over again.
One game that I did not (and could not) play for longer than 10 seconds was Canvas Breakout, and I must agree 100% with Marek. Honestly, I thought this was a competition for HTML5, not IE5 ( www.google.com/search ).
I feel that most of the other contestants who did not win anything had much better and more fun games. This outcome does not do their talent justice.
I'm very glad to see that the incredibly fun Space War and Hellboy: Something Fishy got something. Hellboy: Something Fishy was excellent and IMHO the slickest looking contestant.
Congrats to White Rabbit as well. Definitely deserved (Where's the Holy Hand Grenade?)
I can't realistically support "pinned" pages so long as I can't use my addons with the pages. There are some addons I rely on and when I "pin" a page they are innaccessible by design. Please allow us to manually "allow" addons to show on pinned pages if nothing else. I took the time to convert make favorites to pins, and now I've spent the time to convert them back because disabling addon support in pinned pages hurts my productivity. Thank you.
I'm the winner of the game category. I was the first surprised of me winning.
I think my game has a great sense of humor and people liked it. I was inspired by an old breakout I was playing in college with my buddies. Back then, there even was tournament organized on it and people just had a blast and that was it. It's the important part of a game right ? Having fun ? So even a breakout game, in my vision, could be as fun as the next game. There are breakout games that are fun, other are not. There are big 3d things, fps and all, some are fun and other are not. Mine was nice to look at, with references to geek culture all over the place, maybe basic but kind of cool effects and bonuses.
I'm not saying breakout is an innovative game concept - it's just what you do with it that is. See my point here ?
That being said...
I think my game have unexploited potential, transition sucks, it lacks music.
I think my game still has some bugs and imperfection.
I think my game could be better, and more fun, and more addictive.
When I heard about the contest, I was working on HTML5 websockets and looking for others perspective. The deadline was within 1 week, so I worked my ass off to get something playable, nice to look at. Kind of proud of what I did there, but I know I can improve it much much more. Also, it's my very first game (I'm more into managament application).
Also I think a lot of games did not respect the one rule stating that developers should not use 3rd part libraries. In a lot of games, I was surprised when browsing the source to find ImpactJS (and others) and also MINIFIED code. What kind of things could be hidden in there, the judges may have asked themselves. In the end, there was not a lot of games that the judges could have worked on.
So I won, I know I could do better and that others games in the contest were better.
Congrats to all participants of the contest !
@frederic, you weren't the only developer who thought they couldn't use 3rd-party JS libraries. The truth is that those libraries were 100% ok. The restrictions on plug-ins was meant to only apply to "browser" plug-ins. Drop-in libraries for HTML, CSS or JS were completely fine. We definitely should have done a better job of explaining that, but it doesn't look like it held you back! :)