Jun 21

6 Lions | North Kingdom

Warning: Illegal string offset 'custom_page_theme_template' in /storage/content/27/2008927/vfxsverige.com/public_html/wp-content/plugins/custom-page/custom-page.php on line 345

Big congrats to North Kingdom for winning 6 Cannes Lions – WOW!

Cannes Lion

 

 

 

 

 

 

 

 

 

 

 

 

 

 

Google ROME got 1 Gold, 1 Silver and 1 Bronze, while ONLY Liberation project won 1 Gold and 2 Silvers.

 

Dec 16

2011 in review: 20 sites that took 3D to the next level | Feature | .net magazine

Warning: Illegal string offset 'custom_page_theme_template' in /storage/content/27/2008927/vfxsverige.com/public_html/wp-content/plugins/custom-page/custom-page.php on line 345

North Kingdom on 1st place and Stopp on 3rd, Sweden shows it knowledge in for the 3d web.

2011 in review: 20 sites that took 3D to the next level

2011 in review: 20 sites that took 3D to the next level

3D on the web really came into its own this year. Here HelloEnjoy’s interactive director Carlos Ulloa compiles 20 of the best 3D websites of 2011 and shows us some of his own projects to boot

This year will go down in internet history as the year when hardware accelerated 3D graphics arrived to the browser without the need of dedicated 3D plug-ins.

With WebGL support in modern browsers (ie except Microsoft’s) and the recently launched Flash 11, developers have started to combine experimentation with creativity to build high-end interactive 3D experiences.

The advertising industry is always looking for new and exciting ways to promote products, and real-time 3D graphics have the potential of bringing a new level of interactivity to their customers.

1. Rome: 3 Dreams of Black

Featuring music by Rome, 3 Dreams of Black immerses the user in three amazing 3D worlds, where animals and plants come to life forming beautiful dreamscapes and users contribute with their own creations.

An interactive film by Chris Milk and Aaron Koblin, it was created by North Kingdom, Skellftaå, Mirada and the Google Data Arts Team led by designer/developer Mr.doob, the man behind the Three.js JavaScript 3D engine that powers many of the projects listed here.

Although this list is ranked in no particular order, if I had to choose the best project, it would certainly be this one. A truly landmark experience that shows what WebGL can do in a web browser.

 

 

2. Nissan: The Planet Zero

An interactive 3D microsite by ROXIK using his Sharikura engine, produced by unit9 for Japanese agency ENJIN, promotes Nissan’s new eco-friendly range of vehicles.

Visitors explore The Planet Zero in search of various methods of renewable energy, all set in the neo-futuristic, zero-emission world.

Being Flash 10 based, this is the only project on this list that doesn’t use hardware accelerated graphics. But who needs technology when you have ROXIK’s magic?

 

 

3. Adidas: Adizero f50

The new Adizero F50 football shoe created by Stopp for Adidas is a great example of 3D product visualisation, something we will certainly see more of in the future.

Using WebGL to render this high-tech football boot, allows the user to change between wireframe, solid and expanded views to see how the boot is put together and read about the various features.

 

 

4. Nissan: StageJUK3D

Revealed at the launch of Flash 11, StageJUK3D allows you to configure and drive the Nissan Juke in full 3D. The first of many to come commercial projects taking advantage of the Stage3D technology in the latest version of Flash.

Created by Adobe, Nissan Europe and Digitas France and powered by the Away3D engine.

 

 

Self promotion

It’s great to see agencies bringing creativity and innovation to their own sites, leading the way and showing clients what’s now possible.

5. Nouvelle Vague

Created by French agency Ultranoir, Nouvelle Vague offers a poetic WebGL experience based on Twitter.

In a surrealist world, tweets retrieved from your selected hashtag, are carried out by flying objects such as air balloons, biplanes, zeppelins and even UFOs. The user can see the scene from any of these ships from each of the pilot’s point of view.

 

 

6. Les Chinois

The website of also French agency Les Chinois was one of the first Flash 11 projects launched this year using Away3D.

Immersive sound design and creative camera work combine with Stage3D graphics to create a futuristic scene dominated by a flying dragon creature.

 

 

Creation tools

Making 3D creation tools accessible to anyone is another exciting prospect of the future, made possible by the use of 3D technology in the browser.

7. 3DTin

3DTin is a WebGL modeller that runs in your browser, allowing the user to create 3D models using cubes and other kinds of shapes.

Models can be saved in the cloud or exported in standard 3D file formats like OBJ and Collada.

 

 

8. My Robot Nation

My Robot Nation combines WebGL, robots, and 3D printing. Users can make a robot on the site in full 3D, then have it 3D printed and shipped to their door.

You can customise your robot with different body parts, stamps, and colours. Everything happens in real time as you drag new 3D parts onto the model, rotate and place stamps, and pose their robot just right.

I would love for consumers to be able to get easy access to 3D printing. As they say, robots are just the beginning!

 

 

Data visualisation

One of the most immediate uses of 3D graphics is data visualisation. The possibilities are truly endless, just take a look at these examples.

9. BioDigital Human

BioDigital Human is an impressive 3D human body explorer with many interactive options and utilities to learn about your body.

Tools for exploring, dissecting, and sharing custom views, combined with detailed medical descriptions provide a new visual format to patients, students and medical professionals.

 

 

10. WebGL Bookcase

WebGL Bookcase is an experimental interface created by the Google Data Arts Team that aims to translate traditional media into a virtual space.

They designed a digital bookcase that’s an infinite 3D helix with more than 10,000 titles from Google Books. It allows the user to browse over the covers or search by subject, to open a 3D model of each book. Each one comes with a QR Code for downloading to your mobile and a link to its entry in Google Books.

 

 

11. CNN Ecosphere

The CNN Ecosphere Project is a real-time Twitter visualisation that aims to reveal how the online discussion is evolving around the topic of climate change.

The online representation consists of an interactive 3D globe where tweets grow into plants and trees. Conceived by Heimat-Berlin and developed and produced by Minivegas and Stinkdigital.

 

 

12. TwitterGraph

TwitterGraph is an interactive 3D word cloud visualisation which shows common friends among several Twitter users.

Developer Daniel Pettersson has also used data from last.fm to show similarities between music bands and artists in another interesting piece called ArtistGraph.

 

 

13. WebGL Globe

The WebGL Globe uses an interactive 3D representation of the Earth to visualise geographic data like world population, latest earthquakes or search volume by language.

Created by the Google Data Arts Team, the project is an open data visualisation platform for anyone to copy the code, add their own data and create their own globe.

Globe visualisations get more interesting every day. These are other good examples, using data from world flights, weather and internet traffic.

 

 

Maps

The future of digital cartography is clearly in 3D. We’ve just started to see what’s possible when maps take advantage of hardware accelerated graphics to create a more detailed representation of the world.

14. Nokia Maps 3D

Currently only supported in a few major cities, Nokia Maps 3D uses WebGL to accurately render terrain and buildings, that really come to life when you move and look around.

The experience is closer to Google Earth than Google Maps, with the freedom of a 360-degree view and adjustable elevation. Click the name of a city to go there and see it close up in all its glory.

 

 

15. Google MapsGL

Bringing one step closer Google’s idea of mirroring the real world inside your browser, the new MapsGL option introduces the power of WebGL graphics to Google Maps.

The experience is improved with 3D buildings (with shadows appropriate to the local time of day), slick transitions between imagery (like the 45-degree aerial photography views in some areas) and the ability to smoothly enter into Street View without a plugin.

To try this features out, click the “Want to try something new?” words on the lower left side of the screen.

 

 

16. Blocky Earth

Described by author Jaume Sánchez as “all the planet, one block at a time”, Blocky Earth is a voxel visualisation of your local area using both photographic and elevation data.

In close range it gives a unique view of the area that surrounds you, but only when you zoom out you can see the big picture, from the heights of the mountains to the depths of the seas. Fascinating.

 

 

Online coding

Due to the fact that JavaScript runs natively in the browser, a number of online live coding tools have emerged. These two are a lot of fun and have great potential as learning tools.

17. GLSL Sandbox

GLSL Sandbox  is a WebGL application for live coding fragment shaders right inside the browser. GLSL is the language the shaders are written in, and here you can edit them in real time and instantly get the feedback.

The interface is dead simple, the results are displayed in the background while the code editor is overlaid on top. Your work is automatically saved to the gallery for all to see and build upon.

Originally created by Mr.doob, the project has attracted many developers who are creating all sorts of awesome graphic effects, render tests and even simple games. The extensive library of shaders is quickly becoming an excellent source of reference for beginners and experts alike.

 

 

18. WebGL Playground

In a similar fashion, WebGL Playground lets you type in WebGL programs and see the results on the same page. The live editor supports JavaScript code and GLSL vertex and fragment shaders, plus a handful of features that make your life easier.

The idea is to shorten the development cycle so you can spend more time on the creative part. All necessary things are added behind the scenes. Your code is automatically organised, formatted and includes syntax highlighted.

The project is still at its early days but the potential for becoming another comprehensive learning source is an exciting prospect.

 

 

Demos

Of the many demos we’ve seen this year, I’ve chosen these two because of their technical prowess and superb attention to detail.

19. Chrysaora

Chrysaora is a real-time jellyfish simulation using realistic rendering and simulation techniques. Created by Aleksandar Rodic, it demonstrates both creative talent and technical expertise.

To enjoy it at its full, make sure you check the debug console and play with the different shaders and simulation controls.

 

 

20. WebGL Water

WebGL Water by Evan Wallace, is another beautiful demo that combines advanced rendering techniques like reflection, refraction, caustics and ambient occlusion to simulate something as simple and beautiful as a pool of water.

Don’t forget to try the various interactions to draw ripples with the mouse and move the sphere across the water surface.

 

 

 

Looking at the 3D sites created this year, we can see interesting trends starting to appear. Developers working in advertising, entertainment and product and data visualisation are starting to take advantage of hardware accelerated 3D graphics to deliver a richer, more immersive experience to their users. Furthermore, game and demoscene developers have also produced amazing 3D work, pushing the boundaries of what can be achieved in the browser.

But things are going to get even better. On the one side, professional 3D development tools such as Unity and Unreal UDK will enable us to create console quality graphics for Flash 11. On the other, WebGL has got a lot of momentum and a growing community, and will soon be available on mobile browsers.

Different technologies give creative teams plenty of choice to choose the right one for the job. These are very exciting times and we look forward to the year ahead.

2011 in review: 20 sites that took 3D to the next level | Feature | .net magazine.

Dec 09

An evening with North Kingdom | NK

Warning: Illegal string offset 'custom_page_theme_template' in /storage/content/27/2008927/vfxsverige.com/public_html/wp-content/plugins/custom-page/custom-page.php on line 345

Inspiring from North Kingdom.

[vimeo=http://vimeo.com/33147575]

[vimeo=http://vimeo.com/33148102]

 

Oct 28

Weetakid | North Kingdom

Warning: Illegal string offset 'custom_page_theme_template' in /storage/content/27/2008927/vfxsverige.com/public_html/wp-content/plugins/custom-page/custom-page.php on line 345
New game from North Kingdom.

 

Weetakid – an intergalactic mobile gameplay for kids

 

weetakid

We helped BBH London to develop a iPhone based game app for Weetabix called “Weetakid.”

gameplay 1

The game sees users take control of Weetakid, a happy and lovable yellow creature whose magical world has been robbed of all its energy by the Evil Eater, the galaxy’s villain. Weetakid and his sidekick Nibbles must then go on a quest to retrieve the items stolen by the Evil Eater.

gameplay 2

An AR marker printed on the back of Weetabix will enable kids to fuel their Weetakid character for game play by feeding it a bowl of Weetabix every morning. At a certain point in the game, players are prompted to point their device’s camera at the back of the Weetabix Yellow Box. The game then launches into an augmented reality sequence whereby Weetakid appears.

Download the app and try for yourself here!

Jan 29

Behind the Scenes – LG Good News Billboard « North Kingdom

Warning: Illegal string offset 'custom_page_theme_template' in /storage/content/27/2008927/vfxsverige.com/public_html/wp-content/plugins/custom-page/custom-page.php on line 345

Awesome long post from North Kingdom about GIL at Time Square.  This is how it should look like, read and learn.

 

Behind the Scenes – LG Good News Billboard « North Kingdom.

Dec 15

Welcome to the world, Gil! | North Kingdom

Warning: Illegal string offset 'custom_page_theme_template' in /storage/content/27/2008927/vfxsverige.com/public_html/wp-content/plugins/custom-page/custom-page.php on line 345

Meet Gil! Awsome and smart new stuff from North Kingdom…

 

Welcome to the world, Gil!

gil_IMG_2375-3

Meet Gil, Good News Ambassador for LG and New York’s latest digital inhabitant.

Today, Dec. 14, 2010, New York has a new digital landmark with artificial intelligence on Times Square.

His name is Gil and is a so called good news ambassador for LG and will be able to react to and present bits of Good News to the world.

LG Billboard

His home is the first ever wraparound HD billboard, developed by LG which allows both a southern and west view to one of the world’s most visited streets.

Because Gil is animated in real-time 3D, instead of using loops of pre-rendered animations, he actually can respond differently to messages, weather reports or news feeds so that he feels really alive.

LG Billboard

His behavior is influenced by the good news he receives. He will be fed daily good news from RSS feeds and user generated messages through social media portals or through SMS interaction. He also reacts to time of day, weather, and holidays or maybe he just watch the people on the street, living his own life on his own schedule.

gil_IMG_2316-2This creates a unique interaction between people on the street and our character – when he smiles, you can’t help but smile back!

Young & Rubicam New York, BrandBuzz, and us, teamed up with Dynamic Digital Displays to create a unique architecture for LG that integrates real-time 3D animation with Unity3D, mobile services, a customized CMS to source and moderate all data, an advanced AI controller logic and a unique puppeteering system.

LG Billboard

Alongside his AI and organic behaviors and reactions, Gil also been developed to be manipulated through manual take over, which allows him to be used in a 100% customized way. The controller can have Gil draw from his behavior list to move and react, much like a video game control. This allows for customizable responses to consumers instantly.

Finally, the entire architecture has been set so that the project can evolve and grow over the next two years.

Stay tuned for more updates on this project and behind the scenes.

Young and Rubicam New York, BrandBuzz, and North Kingdom out of Stockholm, Sweden teamed up with Dynamic Digital Displays to create a unique architecture for LG that integrates real-time 3D animation with Unity3D, mobile services, a customized CMS to source and moderate all data, an advanced AI controller logic and a unique puppeteering system.
Alongside his AI and organic behaviors and reactions, Gil also been developed to be manipulated through manual take over, which allows him to be used in a 100% customized way. The controller can have Gil draw from his behavior list to move and react, much like a video game control. This allows for customizable responses to consumers instantly.
Finally, the entire architecture has been set so that the project can evolve and grow over the next two years.

 

Welcome to the world, Gil! « North Kingdom.

Nov 24

FWA | Scion | ATTIK |North Kingdom

Warning: Illegal string offset 'custom_page_theme_template' in /storage/content/27/2008927/vfxsverige.com/public_html/wp-content/plugins/custom-page/custom-page.php on line 345

Congrats to ATTIK and North Kingdom for their win today at The FWA for their super cool augmented reality game for SCION

[youtube=http://www.youtube.com/watch?v=kc3KHUS2GZ8]

[youtube=http://www.youtube.com/watch?v=muo0UPDF614]

Some great screengrabs and read more about the project.

 

Nov 14

Behind the scenes – The Great Piggy Bank Adventure | North Kingdom

Warning: Illegal string offset 'custom_page_theme_template' in /storage/content/27/2008927/vfxsverige.com/public_html/wp-content/plugins/custom-page/custom-page.php on line 345

An awesome behind the scenes from North Kingdom for Walt Disney Parks and Resorts.

At the cross road

Walt Disney Parks and Resorts Online contacted us after they saw “Get the glass” and wanted us to work on a project with them and T.Rowe-Price. They wanted to create a fun game for kids that also teaches them about finance.
Beyond that, the brief was quite open, and we worked on about 10 different concepts before we settled for one. And then we set out to develop the game together with the creative team at Walt Disney Parks and Resorts Online.

Read the full story at:

Behind the scenes – The Great Piggy Bank Adventure « North Kingdom.

Sep 27

WIP – Woodbot Pilots, an interactive installation 3D | North Kingdom

Warning: Illegal string offset 'custom_page_theme_template' in /storage/content/27/2008927/vfxsverige.com/public_html/wp-content/plugins/custom-page/custom-page.php on line 345

A really interesting WIP article from Robert Lindström, Art director and co-founder of North Kingdom about an interactive installation that will be placed at Skellefteå Airport this winter. An installation where NK will use a 3D camera technique and a huge 82 inch one-touch screen.

interactive installation woodbot pilots

read more here.

WIP — Woodbot Pilots, an interactive installation 3D | Designchapel™.

Sep 02

Behind the scenes – Battle of the Cheetos| North Kingdom

Warning: Illegal string offset 'custom_page_theme_template' in /storage/content/27/2008927/vfxsverige.com/public_html/wp-content/plugins/custom-page/custom-page.php on line 345

Nice work and behind the scenes from North Kingdom for Cheetos.

intro2 copy_620

When we got the request from Goodby, Silverstein & Partners there were as many uncertainties in our heads as there were immediate ideas on how this game could come together. The core idea was having banners on different sites wich would transform the web page to a battlefield with Cheetos fighting over it.

Building a war game with lots of fun shooting and exploding action was of course something we all would love to do. But there were a lot of technical and conceptual exploration ahead of us.

Read more at:

Behind the scenes – Battle of the Cheetos « North Kingdom.