Letter-heads

http://simurai.com/projects/letter-heads/

by pmcpinto • 12 years ago

118 17 12 years ago

simurai.com

npatten• 12 years ago

Very cool!

jack_hanford• 12 years ago

Very interesting! Would love to read about how you did this.

simurai2• 12 years ago

The source is on GitHub to check out: https://github.com/simurai/simurai.github.io/tree/master/pro...

To create the head shapes, the position and rotation of each letter is defined with CSS transforms (see heads.css). To get the right values, it's mostly trial and error. But to make it a bit easier, I created a little helper script that let me drag/rotate each letter with the mouse and then copy the value to be used for those CSS transforms.

samwillis2• 12 years ago

Clever idea.

I think it's based on the artwork [1] of Tim Noble and Sue Webster [2] who create images using the silhouette from scultures made from rubbish.

1: http://en.wikipedia.org/wiki/File:Miss_Understood_and_Mr_Mea...

2: http://en.wikipedia.org/wiki/Tim_Noble_and_Sue_Webster

bhauer2• 12 years ago

The creator [1] says it's inspired by Kumi Yamashita.

[1] http://simurai.com/projects/2011/03/11/letter-heads/

samwillis2• 12 years ago

Yep, so it is.

http://www.kumiyamashita.com/portfolio/profile/

bhauer2• 12 years ago

[2011]

jnardiello• 12 years ago

mind-blowing

kartikkumar2• 12 years ago

Interesting idea but I was totally caught off-guard by the automatic tweet posted when I clicked on the little birdy in the middle. Really not cool. Deleted the tweet immediately. At least let someone know you're going to be posting a tweet so that they can decide if they're game.

simurai2• 12 years ago

Sorry. In the middle used to be a font switcher, but it didn't turn out that well, so I replaced it with a custom tweet button. Yeah, maybe it would be less intrusive to move it to the bottom.

Edit: done!

kartikkumar2• 12 years ago

Awesome! Thanks for taking my tip on-board! Other than my initial reaction to the tweet, compliments on a pretty sweet idea!

kwaimind• 12 years ago

Just when you thought you knew it. BAM...something new!

rel• 12 years ago

Worked surprisingly well on mobile!

ishi• 12 years ago

Extremely well done!

IgorPartola• 12 years ago

Pro tip: looks like refreshing the page gives you different faces.

I wonder if these are pre-compiled or is there some algorithm at play that makes these dynamically?

FreeFull• 12 years ago

You don't have to refresh the page, you can just click again to get a different face.

fcatalan• 12 years ago

Seems like a genetic algorithm would be a great fit to produce a letter arrangement given a target silhouette

Letter-heads

Related Stories