ASCII Webcam Facebook Status

Here is one of many ways to achieve awesome:

  • Take any image
  • Map regions of the image into ASCII characters of equal dimension
  • Make sure your font metrics are equivalent to those of Facebook’s
  • ???



It is quite difficult to turn this sketch into an applet since I was using the webcam, but you can see the source code here. Originally I tried matching the font of Processing to be the same as that of Facebook but there’s too many CSS subtleties; in the end I had to write some JS to manually get the char-width of each character. Unfortunately the image starts skewing depending on your browser zoom and whether you have certain fonts installed or not, but there’s nothing to be done about such things.

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s