Below a post with the presentation and some useful links of a lecture I gave at NHL university on March 31st 2010. Enjoy it

Presentation (links below)

iPad will change computers forever for normal people. Simple computers where web access is even more important. So web apps are the future.

The slides of the companies was about defining their core business and their interest in the web. Adobe: selling design software, Google: collecting data for relevant adds (wants everybody with webaccess to google products), Apple: selling hardware (best software experience), Microsoft: Selling windows, thats why IE9 will not be available for XP and why they now want HTML5 to succeed.

Flash

Adobe isn’t in the Flash business

Seriously.

It isn’t in the Photoshop business, or the Acrobat business, or the [take-your-pick product name] business, either.

It’s in the helping people communicate business.

• Adobe is not in the flash business – On an adobe weblog

HTML5

All examples are best seen in Safari 4+ or a recent Google Chrome release. Want to know how it works.

Use Web inspector in webkit to inspect the elements and to see their CSS. Read more about incredible webkit inspector here and here.

What can I use now:

A simple matrix of what HTML5 features are implemented by which browser.

CSS fonts:

• Font-face generator for all browsers incl free fonts to use.
• Font face more deeply explained
• More Fonts for font-face css.

HTML5 video:

• Cool video player – Also uses webfonts.
• It is all about h264 which flash and html 5 video both support. Vimeo and youtube both have HTML5 video players in beta which are almost identical to flash version. Test youtube HTML5
• Internet Explorer 9 is going to support HTML5 H264 video. Firefox does support the tag but nog H264. But does support the inferior Ogg Vorbis format.

Canvas:

• Cool interactive music visualisation – Also uses HTML5 audio tag for native browser audio.
• Drawing in the browser – almost like photoshop and can even save images thanks to base64.

CSS animations/transitions/transforms

• Snow stack – Navigating through images in 2.5d. Space for enlarging.
• CSS animation – Webkit introduction, also in near future Firefox. Be sure to click through to demos.
• CSS transitions – Webkit and will also be included in firefox. All based on Apple Core Animation.
• CSS 3D transforms – See examples. This was the one I showed in the talk.
• SVG vector animation – You can create vectors in any vector program.

Local Storage:

• Webkit example – Be sure to check web inspector to check results in db viewer.
• Webkit Introduction post
• More client side storage. Localstorage also works in IE8+.

IE9:

• HTML5, hardware accelerated drawing & SVG
• Script speed compared to other browsers – I used the graph from here.

Webgl: (only works in experimental browser versions of firefox & webkit)

• Quake 2 with GWT & webgl in browser
• Webkit webgl introduction – The latest webkit build has changed too much to show all the demos correctly.
• Characters be sure to try out multiple & animated characters with right number select.
• Chrome windows directX translation for webGL coming.

Websockets:

• Websockets in Chrome

Google Web toolkit: write cool fast web apps in Java. Compiles to super optimized javascript. Google Wave is a GWT product and even Quake 2 can be built in it. (See webgl)

• Overview
• 2.0 new features with video
• Building UI like Adobe Flex in XML
• App engine for superscalable cheap NOSQL databases

Our Care product: (screenshots are from an older version than I demoed)

• Lable EZLP

Photo by Raymond van Dongelen