Upcoming movie The Hunger Games is about to launch in cinemas tomorrow, to get fans excited there’s a shiny new website to investigate. This website however is not typical, not by a long shot.
The future of the web is clear, plugins are going away. How long that transition takes is yet to be determined, but what is for sure is that HTML5, CSS3 and Javascript will power the web of tomorrow.
Born from a partnership between Microsoft and Lionsgate Entertainment, developers of the website for the Hunger Games wanted to build one of the most advanced website possible using new technologies and completely avoid the plugins. The end result is a beautiful website that is much less website and much more of an experience.
Those developers looking to learn how the creative minds at Ignition Interactive, BAM, Lionsgate and The Nerdery should check out http://thecapitoltour.pn/dev/.
If you’re wondering about Microsoft’s involvement in the project, it’s all about promoting the benefits of moving to IE9. Personally the conversation has now moved to IE10, particularly with the no-plugin metro version in Windows 8. It turns out the site works fantastic in both versions of IE10 as a result of its use of HTML5.
The site provides trailers, photos, cast information and social updates as you’d expect from any modern movie website. The big difference is how this site presents its movie-related information, smooth transitions, animation and effects that were used to be the exclusive domain of a flash-driven site are now achieved through HTML5 to create an engaging experience. My personal favourite is the simulated lens flare in The Capitol Skyline, which reacts to the mouse position relative to the sun.
There’s no doubt about it, what has been achieved here is impressive, but it is important to remember that not all web development requirements can be fulfilled with HTML5. Maybe by the time HTML6 rolls around we’ll have other much demanded features like DRM-protected video streams.
The other thing to remember is the time taken to pull of an advanced site like this. While it is a possible to achieve, the ease in which developers can create is questionable. Creating an animated, transparent object in Flash is a 10 second task, in HTML5 and JavaScript, this same object manipulation may take dozens of lines of code.
That said, there is no question website development is changing.. and fast. It’s important to have some examples of great websites to light the way and give other developers a target to aim at. Personally I hope the tools used to create advanced interactive websites improve, because right now HTML5 development isn’t for the faint of heart.
Disclaimer: I’ll be checking out the movie with 2 free movie tickets provided by Lionsgate Entertainment and Microsoft.
