Friday Graphics! Episode HTML5

Hello!

I hope you’ve had a great week. This week’s edition of Friday Graphics is a HTML5 special! As you may know already I’ve worked a little bit with Mozilla, a great defender of free and open web technologies. So I told myself it was time to do a special HTML5 edition of FG!

For all you purists out there, sorry I won’t just be mentioning projects created with HTML5 , but also projects that use modern html technology (go here to find out what I’m talking about).

On this week’s menu: some typography, some data visualization, touchscreen interfacing, some DIY music, a viewer for Minecraft characters, the latest release from Ubuntu and a very strange html WTF!

Happy Friday Graphics!

Geoffrey

We’ll start with a game created especially for typography geeks. It’s called « Kern Type », a game to test your kerning abilities. What’s kerning? Well:

Kerning is the process of adjusting the spacing between characters in a proportional font, usually to achieve a visually pleasing result. Kerning is the adjustment of the space between individual letter forms vs. tracking which is the uniform adjustment of spacing applied over a range of characters. In a well-kerned font, the two-dimensional blank spaces between each pair of characters all have similar area. (Wikipedia)

These are the visual results. For some I’ve tried to kern correctly, and I’ve deliberately shifted others to show you the difference. Have fun!

source

Here’s a multi-touch Linux / HTML5 interface which allows you to read your RSS feed on a big screen or on your computer. Created by Pliage, Pascal Chirol and the talented Douglas Edric Stanley, the project is called “CITY MEDIA”. Started in 2009, the project is the fruit of the collective labors of developers, artists and cultural operators, brought together by a desire to reconsider the place of the media within cities and to create a more immersive, human and reactive experience.

The project takes the form of a large interactive touchscreen, installed in a public space, which could be used by many people at a time, working together or independently. It could be used for informational purposes, for cultural or tourist information for example, but also artistically or just for fun. The project was inspired by an experiment conducted in Helsinki. It’s a new urban medium of communication, an interactive noticeboard for residents and visitors to the city.

source / source

Next up an interactive HTML5 data visualization! Created by D3 (a digital production company based in Sao Paolo), the Circle Of Trust project takes your Google Plus account as its starting point and graphically displays your personal social network! It’s an interesting way to view how people are connected to each other and to construct a visual diagram of the strange social world that is Google Plus.

Try it out here.

source

We continue with Plink, 100% musical, 100% HTML5, which describes itself as a multi-player musical experience with a user interface that’s simple and intuitive. Just move and click your mouse to generate sounds (and music too, why not?), all in real time and online. But that’s not all – on Plink you’re not alone and you can play with sounds alongside other users online at the same time!

source

You’re no doubt aware of the phenomenon that is Minecraft,the game that immerses you in a world of blocks that represent sand, rivers, stones, trees, etc. The basic concept is that the player can modify the world as they wish, a little bit like Lego! Now Djazz, a young developer, has created this “viewer” for Minecraft characters. You can design a small image, upload it to the site and see your character come to life!

source

Staying with videogames, some big news: Google is launching a service called “PlayN”, a development platform for games made with HTML5, Flash, etc. PlayN is a multi-platform library of games that will allow you to create a game based on one language (Java) but which runs in HTML5, Java, Android and Flash. The idea of creating a common language to distribute its program across multiple platforms without complications is not a new one. But now Google are getting involved and they’re focusing on videogames! So I’m very curious to see what they come up with it!

Merci Sylvain

The all new version of the free operating system Ubuntu has been released! To celebrate, Canonical is inviting all Internet users to “test out” the new very visual, very graphic version, but directly in your browser in HTML5 ! Take the new version for a test drive here.

And for the WTF of the week, here’s a web experience that might not be new but is still pretty incredible! Created by a young Russian, this site offers up a thick slice of WTF with animated gifs, modular interfaces and radio buttons, all at toliademidov.ru

For the final word, delve further into the world of HTML5 and graphics with the fabulous sites of mrdoob.com,  chromeexperiments.com and demos.mozilla.org !

Have a great weekend everyone!

Geoffrey