Sunday July 13, 2014
Register

 

Microsoft is showing off the power of HTML5 and Internet Explorer with an interactive music video for teen star Jasmine Villegas.

The IE team worked with creative agencies Digital Kitchen and Bradley and Montgomery to create an interactive HTML5-driven experience that pushes the boundaries of what HTML5, JavaScript and CSS3 can achieve.

[More from Mashable: Kinect for Windows 1.5 Bringing Better Skeletal Tracking]

Microsoft is showing off the power of HTML5 and Internet Explorer with an interactive music video for teen star Jasmine Villegas.

The IE team worked with creative agencies Digital Kitchen and Bradley and Montgomery to create an interactive HTML5-driven experience that pushes the boundaries of what HTML5, JavaScript and CSS3 can achieve.

[More from Mashable: Kinect for Windows 1.5 Bringing Better Skeletal Tracking]

The video is for a remix of Villegas' hit song, "Just a Friend" and it lives at JustAFriend.ie. The song is pure bubblegum pop -- it's frustratingly infectious -- and the various technical tricks that have gone into the experience are worth checking out for web lovers and developers alike.

Once users enter the video -- which integrates with Facebook -- they become part of the experience. In addition to watching the video, users can take part in mini-games within the video itself, with their actions altering what appears on screen.

[More from Mashable: Make a Flashy HTML5 Website Without Coding or Plug-Ins]

"Just a Friend" works on all modern browsers -- including Google Chrome and Apple's Safari. Microsoft, of course, is highlighting its performance in Internet Explorer 9 and 10.

We spoke with Ryan Gavin, general manager of Internet Explorer, about the project and what it means for Microsoft. For the last 18 months, Microsoft has been pushing forward with its idea of a more beautiful web, and with that, a web focused less on plugins (such as Adobe Flash or Microsoft Silverlight) and more on HTML5, JavaScript and CSS3.

In addition to building pure HTML5 versions of Cut the Rope, Microsoft also recently released a fully-interactive Inaugural Capitol Tour in conjunction with Lionsgate for the hit film, The Hunger Games. With The Hunger Games, the idea behind the project was to re-imagine a movie website.

The results have been stunning, with thousands of users logging in with Facebook and Twitter. The site was such a success, its servers crashed the first two days it was online.

With JustAFriend.ie, the goal was "to recreate the music video," as Gavin says. With a few exceptions, the music video as an artform has evolved little since the late 1980s. This is even more true as music consumption moves online, through services such as Vevo.

Fortunately, the tide is starting to change. In the last few years, we've seen bands such as Arcade Fire and the Red Hot Chili Peppers embrace the idea of the music video.

Arcade Fire's "Wilderness Downtown" video was one of the first examples of HTML5 that made jaws drop. Gavin hopes that from a technology standpoint, JustAFriend.ie will do the same thing.

On the Windows Steam Blog and on the dedicated behind-the-scenes page, the IE team goes into detail about how certain effects and features were achieved.

The dev site even has code samples and JavaScript libraries that developers can use with their own projects.

To me, that's the most exciting part of this experiment. Not only is the video a fun experience, but the developers are sharing their hard work with the community.

Let's hope this can kickstart a new wave of music video artists moving forward. Let us know what you think of the video and the use of HTML5 in the comments.

This story originally published on Mashable here.

Add comment


More recent news from servers :

InfoDam Newsletters

Name:
Email:

Related News

www.loonywire.com

Amazing stories from everyday life.

Wireless Technologies

Global Events

IT Security

Apple

Linux - Open Source

Data Centers

Business News





Join the Community

Becoming a member allows you to use InfoDam's many services: create a personal InfoDam profile, write your blogs, as well as comment and follow your favorite blogs, articles and news bits. Membership is free! 

Sign Up!

About Us

InfoDam, is your one stop resource for current  IT and Business related news.

Phone: +27 011 264 1000
Email: support @ infodam.com
Web: www.infodam.com

S5 Box

Community Login

Register

*
*
*
*
*
*

Fields marked with an asterisk (*) are required.