Christian Heilmann

Posts Tagged ‘html5’

Reclaim HTML5 at Super VanJS in Vancouver, Canada

Sunday, January 15th, 2012

I am in Vancouver, Canada right now and yesterday night the Super VanJS meetup attracted around 160 people to come and see Rebecca Murphy, Robert Nyman, Jim Andrews, Preet Jassi and little me talk about all things JavaScript.

My own talk was the last of the day and was an ad-libbed introduction to a few of the things I coded lately wrapped in a request to reclaim HTML5 as JavaScript developers. The audio of the talk is available on archive.org:

The links to the demos I talked about are available here and here is a gist of what was covered:

I started by explaining my confusion about Supervan JS as Supervan is a terrible movie from the 70s with very interesting cover and back sleeve art and even more awesome posters.

I then continued to explain my unhappiness about the decline of HTML5. With this I meant that there are lots of marketing demos of HTML5 using a lot of technologies that are actually not HTML5 or use it in a very Flash-intro-ish way. I showed just how annoying it is to play Angry Birds online and how the recent Cut the Rope port looks much smoother. I also pointed out that none of them really use the web to their advantage by for example have feedback mechanisms or allow for level editing.

In essence I wanted the audience to think about bringing HTML5 into the “boring” world of day to day deliveries instead of just games and showcase sites. For this, I showed a few code examples and explained how they can benefit from HTML5 features.

I showed how to move an element to the current mouse position and how you can make this faster by using CSS translate instead of left and top using translateZ(0) to trigger hardware acceleration even when you don’t go 3D. I then showed that you can move things smoothly by adding CSS3 transitions instead of writing a JavaScript animation.

I continued introducing the 3D CSS maker, a tool to play with CSS 3D translation and animation that generates code for you.

The blue beanie maker was next showing how you can use drag and drop to put an image into the browser and manipulate it with Canvas.

The image cropping with canvas demo shows how you can enhance the functionality of browsers without having to write and install extensions. In it you can get a bookmarklet to crop any image on the web in the browser by double-clicking (in Webkit and Opera) or with a context menu (in Firefox).

I then continued to show a demo of less obtrusive video overlays showing how you can add hints for overlays on videos by reading data- attributes in the HTML and reading the current time of the video.

The last demo was a simple game with a an HTML twist that showed using canvas for game animation, touch, orientation and keyboard events to control a game paddle and how to read the necessary game data from HTML and thus making it easy to rebrand and change the game.

I ended with a plea to try some of these things out and play with all the cool APIs and hooks browsers provide us with these days instead of relying on frameworks and libraries for everything or build for one single environment. HTML5 is there for developers, if we allow only marketing people to play with it we do a disservice to ourselves.

I will follow up this with in-depth posts on hacks.mozilla.org and we also shot videos of the talks which will (quality permitting as there were some issues) be released soon.

All in all I had a great time, got lots of good questions and enjoyed the event a lot. Seeing that Vancouver is only a 2 hour flight from the valley there is a big chance I will be back soon.

HTML5 shiv history, discontent and ski jumping – the smashing mag meetup

Thursday, December 22nd, 2011

I am right now in my hotel room after the smashing magazine meetup in Stuttgart waving good-bye to each byte of the audio recording of my talk as it is uploading to archive.org (Update: it is done now). I had a great time at the meetup and want to thank Lisa, Vitaly and the others of Smashing Magazine and the Stuttgart GTUG for organising and having us.

Paul Irish’s talk HTML5 history and terminology was a good reminder on why things are the way they are in HTML5, how the HTML5 Shiv came to be and explained some terminology in detail. You can see his slides here

My own talk was more or less the blog post I wrote yesterday on discontent in the web design world but with a comparison to Ski Jumping and bringing the need for discussion and explanation home. I urged people not to repeat “best practices” and “useful shortcuts” blindly but consider the consequences instead. I also plead for less preaching and more assistance in creating new and modern web products with good approaches from the past.

The slides are available here (left+right to go back and forward, down for next bullet point and N to toggle notes):

The audio of the talk is available on archive.org

There were great questions from the audience and after the talk Paul, Vitaly and me also recorded a Podcast for Workingdraft.de which should be out soon.

Again, thanks for organising, and I had good fun there! See you next time.

Xcommerce 2011 – The web and browsers as the platform – exciting opportunities in new web technology

Thursday, October 13th, 2011

I just got back from the x.commerce conference in San Francisco where I gave a talk this afternoon on how new technology can make ecommerce more engaging:

The slides are available online or embedded below (cursor keys to navigate, press N to show and hide notes and space to proceed on slides with bullet points):

The audio recording of the talk is available on archive.org.

Evento Linux – HTML5 and the new challenge of “open”

Thursday, September 29th, 2011

Today I gave a quick talk on HTML5 at the Evento Linux conference in Lisbon, Portugal. Originally I had planned for a longer keynote and when I realised I only had 20 minutes, I had to cut down a bit. Anyways, here are the slides and the audio recording of the talk:

The abbreviated presentation slides are available here

The audio recording of the talk is available on archive.org.

You can also check the slides I had to skip below:

The full length presentation slides are available here.

All in all I had a good time and hope that I inspired a few people. Once I am on a better connection I will also upload some photos and the video of Tux eating its own birthday cake, so stay tuned.

Kings of Code – HTML5: Time for some slicker apps

Tuesday, September 20th, 2011

Yesterday I was in Amsterdam to speak at the Kings of code conference. My ambitious goal was to cover the relevant parts of HTML5 and CSS3 for backend developers in 25 minutes and I think I just about managed to reach it.

The presentation slides are available here and embedded below (use cursor keys to navigate back and forth):

The audio recording of the talk (raw, unedited) is available on archive.org.

Overall the reaction was good, so I hope I managed to bust some myths and look forward to see what people do with the inspiration.