Letter-heads

samwillis wrote: post #4

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

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

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

Re: Letter-heads

#7

Post by samwillis » Sat, Jan 25, 2014, 10:59 PM UTC

bhauer wrote: post #6

samwillis wrote: post #4

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

The creator [1] says it's inspired by Kumi Yamashita. [1] http://simurai.com/projects/2011/03/11/letter-heads/

Yep, so it is.

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

Re: Letter-heads

#8

Post by jnardiello » Sat, Jan 25, 2014, 11:20 PM UTC

mind-blowing

Re: Letter-heads

#9

Post by kartikkumar » Sat, Jan 25, 2014, 11:38 PM UTC

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.

Re: Letter-heads

#10

Post by simurai » Sat, Jan 25, 2014, 11:41 PM UTC

jack_hanford wrote: post #3

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

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.