detail

Audi – #onemillionreasons

By | @minivegas | No Comments

audi3d-1

audi3d-2

audi3d-3

Incredible campaign microsite for Audi and #onemillionreasons. Essentially a model of their R8 car made up of spheres, which people can ‘own’ through social media, clicking on one of the spheres shows the statement, which then also when the “3d ansicht” button is clicked – totally destroys the car and rebuilds it in front of your eyes – and turns it into the photo or statement – absolutely incredible! All built in Web GL, it allows you to rotate your view, zoom in, and interact with the various spheres. Love the attention to detail too, with the spheres moving around based on position of your cursor, and watching the light source cast shadows dynamically. It really is incredibly well made.

Created by Minivegas (@minivegas) and Razorfish Germany (@razorfish_de).

Site here…

TCM Summer Under the Stars 2013

By | @1trickpony | No Comments

summer-under-stars-1

summer-under-stars-2

summer-under-stars-3

The 2013 version of Summer Under the Stars, a campaign site promoting TV movie channel TCM’s summer schedule. Focussing on the range of famous movie stars of a time gone by. Love the homepage carousel of profiles of the stars, scrolling goes into their respective bios, with a nicely designed scene summarising the actor.  Nice little section on what makes that person legendary too. Overall really slick transitions and animations from section to section, nice art direction and fun to play around with.

Created by 1 Trick Pony (@1trickpony).

Site here…

Citroen DS4

By | @rumbatronics | No Comments

Citroën DS4 1

Citroën DS4 2

Citroën DS4 3

Lovely campaign site for the new Citroen DS4 in Brazil. One of the richest non-Flash sites i’ve seen for a long long time, videos, dynamic masking, fantastic rollover effects, lovely use of scroll and interactivity. It also looks great, with nice photographs and video assets, and well considered design and typography. Really like the homepage and the innovative menu – a real exercise in cutting edge design for non-Flash sites.

Created by Rumba (@rumbatronics).

Site here…

H3 – Bang Olufsen

By | @hellomondaycom | No Comments

beoplay-h3-1

beoplay-h3-2

beoplay-h3-3

Website of Bang & Olufsen’s new in-ear headphones the H3. One long scrolling site with a navigation bar following you down the page, each section with animated features and information about the product. Really like the timeline where you can see the range of headphones B&O have made over the years. Also really like the image gallery and the way your view zooms into the grid of images. Lots of nice detail in each of the individual content modules, nice tidy promo site.

Created by hellomonday (@hellomondaycom).

Site here…

60 FPS

By | @webdesign | No Comments

boris-1

boris-2

boris-3

Site of developer Boris Etingof. Loads of shiny 3d animated particles coming together to create icons of the clients he has worked on, responsibilities, links and so on. Reminds me of the old school Flash portfolio sites, but in this case in Web GL and so on. Nice animations and transitions between the various projects.

Created by Boris Etingof.

Site here…

Nespresso Trieste & Napoli

By | @WerkstattParis | No Comments

nespresso-napoli-1

nespresso-napoli-2

nespresso-napoli-3

 

Lovely site for Nespresso showcasing 2 limited edition flavours – Napoli and Trieste. Fantastic 3d animated illustrations of the scenes evoking the ambience of both towns. Lovely animations and transitions and a great level of detail – love the way the scene colours in when you click on the label of the scene. Really nice site with a lovely ambience – really nicely executed.

Created by Werkstatt (@WerkstattParis), and Lowe Strateus (@lowestrateus).

Site here…

WeAreData

By | @BETCParis | No Comments

we-are-data-1

we-are-data-2

we-are-data-3

we-are-data-4

Site promoting new Ubisoft game ‘Watchdogs’ an action/adventure game set in the modern age of communication and data. This site pulls in public live data from lots of different sources such as Twitter, Flickr, Instagram, transport grids, phone mast locations, cctv etc etc – and plots it all on a series of 3d maps across London, Paris and Berlin. The detail is quite incredible, featuring moving trains, phone networks, twitter messages, all in a 3d interface which moves nicely as you click and drag around the map. It really gives the impression of the amount of data in the world around us – all nicely colour coded and with icons to tell the differences between each bit of information. It looks really cool too – with the dark background and glowing icons and drawing lines – when you pan the buildings are draw all in 3d boxes, with particles at different heights giving that illusion of depth. A very cool site – all built in Flash –  full of interactivity and dynamic information rendered in a 3d map!

Created by BETC Paris, (@BETCParis).

Site here…

Nitrocharge your game – Adidas

By | @DDBTribal_AMS | No Comments

nitrocharge-1

nitrocharge-2

nitrocharge-3

 

Site promoting the new Adidas football boot – via an interactive game which you can play connected to your phone. Through a series of timed gestures you control the sequence of clips highlighting features of the boot. Loads of cool effects and rollover states and attention to detail and clever behind the scenes work make this a really nice interactive experience.

Created by DDB & Tribal Amsterdam (@DDBTribal_AMS).

Site here…

ROCCO Design Architects

By | @pillandpillow | No Comments

rocco-1

rocco-2

rocco-3

 

Site of renowned architect Rocco Yim showcasing his vast range of work. Really nice offset fluid grid that loads in thumbnails highlighting the projects, love the way the animate in and react to rollovers. Great transitions from one project to the next and zooming in/out – really cool. It was some 2 years in the making this site – everything feels polished and well considered.

Created by Pill and Pillow (@pillandpillow).

Site here…

Ed Banger Room

By | @anonymous_paris | No Comments

ed-banger-1

ed-banger-3

ed-banger-2

Site celebrating the 10th year anniversary and showing the history of the Ed Banger music label. A simple site – scrolling downwards reveals animations and shows key moments in the label’s history. Lots of detail – from dragging around music covers to interactive keyboards – it’s fun to explore and play. Love the history summary panel where you can see the entire page and navigate around. Just a nice example of a timeline based design which fun to explore.

Created by Anonymous (@anonymous_paris).

Site here…

Escape Flight

By | @b__reel | No Comments

escape-flight-1

escape-flight-2

escape-flight-3

 

Lovely site for Escape Flight – a search engine for last minute weekend flights for trips abroad. With useful filters such as ‘weather’, ‘culture’, ‘food’, and ‘hidden-gem’ – all aimed at making this a really simple, intuitive way of finding a flight. Really slick animations and transitions everywhere, and lovely design – and great typography. Easy to use and very visual, very modern, very slick.

Created by B-Reel (@b__reel), and Dog Studio (@Dogstudio).

Site here…

Into the Arctic

By | @hellomondaycom | No Comments

into-the-arctic-1

into-the-arctic-2

into-the-arctic-3

 

Lovely site for Greenpeace documenting their effort to claim the North Pole for nature – and highlighting peoples attempts to exploit the Arctic for resources. The story centres around a 3d map of the region which zooms and pans as you explore the timeline. There is lots of information about the animals in the area and the companies responsible for exploiting the region. All tied together with well considered typography and ‘app’ like design with sliding panels and large touchable buttons and icons. Really informative and loads of animations and transitions – all wrapped up in a great interface.

Created by hellomonday (@hellomondaycom).

Site here…

Oakley Airbrake

By | @oakley | No Comments

oakley-moto-1

oakley-moto-2

oakley-moto-3

 

Really cool site for Oakley’s new goggles for Moto Cross. Essentially a long scrolling page – with scrolling triggering animation – in line videos, nice exploded 3d views and so on. The great part of the site is the fact it is responsive, so on the larger screens you get the full parallax experience, on mobile you get a stripped down experience and on in-between sizes you get fewer animations. The animations are fluid and it all comes together to really explain the product well – great example of a responsive parallax scrolling site.

Created by Oakley Digital (@oakley).

Site here…