As the cinema experience continues to improve with technological advancements in Imax, 3D and fully immersive sound, so too does the aesthetic experience of the web with its glorious HTML5, parallax scrolling and super-slick CSS3 coding.
It’s as if they’re competing directly for our attention!
Thankfully the home experience will never match the cinema experience no matter how cutting edge your home cinema set-up may be.
Just think of the sheer visceral horror of watching Sandra Bullock spinning out of control in the depths of space and how muted it will seem while watching it in bed on your tablet.
These films still need to be marketed through these less than cinematic desktops and portable devices in order to drag us out of our homes and into the theatres.
Luckily the fast pace of change in web design trends has meant that the large scale experience of cinema can be substituted online in brilliant alternative and innovative ways.
Here is a list of movie websites that either feature captivating visuals, grand technological achievements, innovative UX or highly interactive fun, whilst also perfectly capturing the essence of the movie online.
The Hobbit: The Desolation of Smaug
With immersive 3D graphics built with CSS3, this is truly… oh no I think I’m going to say it… an unexpected journey. Sorry, I did say it. This really is an incredible piece of web design though.
The scale is huge, the avenues you can explore are incredibly varied and the navigation is some of the most intuitive I’ve ever experienced.
Meet the heroes, explore the woods, fight hill trolls, listen to Ian McKellen’s soothing narration. It’s amazing.
And the best part: it’s built for mobiles. You can navigate this site on any mobile device through WebGL or Chrome, and it works just as smoothly as it does on desktop.
X-Men: Days of Future Past
Quietly launched in July 2013 in order to tease the new X-Men film that’s not due out until May 2014, this is a brilliant peace of soft marketing. A website for Trask Industries that makes no mention of its ties to the film, and only the most hardcore of comic book fans would get (and be quietly disturbed by).
Although the presence of Peter Dinklage on the last page is a bit of a giveaway.
Life of Pi
This may be one of the finest HTML5 web experiences I’ve ever encountered.
A beautiful, scrolling website that tells a completely interactive story of how the film was made. It’s full of brilliant animation, parallax scrolling and glorious imagery.
Utilising large scale HTML5 backgrounds, this is the nearest way for the user to experience cinematic visuals at home.
Gravity is of course all about the spectacle and the 360 degree spacewalk from inside Sandra Bullock’s helmet is an immersive and slightly frightening experience even at home.
The Kings of Summer
Less big-budget event movie, more low-key character drama, The Kings of Summer website is no less brilliant than the above examples.
A Tumblr site that completely subverts your expectations of what a Tumblr site can achieve. It’s a large scrolling, flatly-designed, super-blog with posts, notes, GIFs, social media links and assorted interesting bits of tat thrown together wonderfully.
The LEGO Movie
As if I haven’t written about this enough already (The LEGO Movie: Content Marketing Triumph) however The LEGO Movie website is the perfect experience for younger users who are just discovering the possibilities of the internet.
I’m a particular fan of the featured SigFig Creator which not only lets you build your own LEGO character, but also allows you to upload it into The LEGO Movie trailer itself.
Tiny minds blown! (Mine included)
Oz: The Great and Powerful
This is a great one to get lost in for an afternoon. Find your way to Oz in this immersive, HTML5 based, 360 degree Chrome experiment.
If you want to be really geeky about the creation of it and know some of the code used, here is the official case study.
300: Rise of the Empire
Brilliant! It’s like a giant game of Risk!
An oily, sweaty, stabby game of Risk.
The oversize background with looped footage from the film playing make for an incredibly persuasive and surprisingly intense experience.
I was fairly non-plussed about seeing this, now I’m definitely going to watch Thor smashing up F1 cars.
A perfectly judged site, full of treats for computer nerds and chess nerds alike.
I was slightly entranced by this collection of classic games
This one goes far beyond the movie by allowing the full exploration of Wolverine’s body and its various mental and physical scars. It sounds ridiculous but it actually works really well, and is beautifully animated.
Killing Them Softly
A moody, parallax scrolling site that perfectly captures the tone of the film.
Time for a crime spree.
12 Years a Slave
Simple navigation coupled with gorgeous overlarge images of the cast and crew, replete with biographies makes for more of an Oscar-baiting piece of marketing then a genuinely great online experience, but it’s still fun to scroll through.
The only time you’ll hear ‘fun’ and ’12 Years a Slave’ in the same sentence.
Wait, how did this get in here?
For more awe-inspiring web design, check out these 20 beautiful examples of persuasive ecommerce design.