Browsers

Making Context Free Art

If you are reading this post in your feed reader, you’ll want to click through to my actual website. Trust me on this one.

I was really impressed with Aza Raskin’s ContextFree.js experiment. I like how the simple rules of a context free art piece generate complex forms. See below, that text will turn into something I can’t exactly predict.
I’ve added a few comments to help you understand what’s going on there.

//all context free art starts with a single rule.  Ours will start with a rule named face.
startshape FACE
//and here is the rule FACE
rule FACE{
//a FACE rule means that we should draw the rules EYE MOUTH and HEAD.
 EYE{}
 // flip an eye over to the other side of the face.
 EYE{flip 90}
 MOUTH{}
 HEAD{}
}

//OH NO! We have two rules named HEAD.  Context free will randomly pick one
rule HEAD{ CIRCLE{}}
rule HEAD{  SQUARE{}}

rule EYE{CIRCLE { s .1 b .5 y .12 x .3}}
rule EYE {SQUARE { s .1 b .5 y .12 x .3}}
rule EYE {SQUARE { s .1 b .5 y .12 x .3 r 45}}
rule EYE {TRIANGLE { s .1 b .5 y .12 x .3}}
rule EYE {TRIANGLE { s .1 b .5 y .12 x .3 r 60}}

rule MOUTH {SQUARE{ s .8 .1 y -.12  b .5}}

And here is a randomly generated face, all made up of squares, circles, and triangles:

Want more faces? Go mess about with my face generator on Aza’s demo site.

update: in the comments Chris came up with a bunch of great mouths for an even better face generator!
The art is context free because any rule can be executed without knowing the context of the other rules - they are side-effect free. (these are the kind of problems that work well on lots of processors)
It gets much better. If you are using a modern browser, you’ll see that the heading of my website now is using this to generate random art up there in that previously wasted space.
Reload the website, you’ll see different art generated according to a handful of tiny algorithms. If you can see this, you might want to switch from Internet Explorer to Firefox or Safari. They both support the cool stuff that I’m doing, but you can’t see right now.

Art
Browsers
Design
Dev
Hacks
Pals
morelight

Comments (4)

Permalink

It’s all details

They say the devil is in the details. Sometimes subtle details are a place to shine.

I was reading notes on a lecture by the great Joshua Schachter, developer of Del.icio.us, when I was thunderstruck by a detail.

You have to speak the user’s language. “Bookmarks” are what you call them if
you use Netscape of Firefox - most users these days know the term “favourite”
instead. Half of his population (? users) didn’t know what a bookmark was.

It is true:
The small details matter

Browsers
Design
Dev
User Experience

Comments (0)

Permalink

How to install Add-Art

Steve Lambert put up a nice helpful walkthrough video on Add-Art, the project I’ve been working on recently. Take a mo’ and check out the project and the video.


Introduction to Add-Art from Steve Lambert on Vimeo.

Art
Browsers
Video

Comments (1)

Permalink

Interrobang

“You’re really going to start a band called interrobang” asked Tom excitedly.

Browsers
Design
Hacks
Lit
Pals

Comments (0)

Permalink

Turn Ads into Art with AddArt

What if fox news could just be more blatantAnother great idea from the folks at Eyebeam.  Take the idea of one of the most popular extensions for Firefox, AdBlock, but remix it to display art placeholders instead of blank space.

Instead of crappy banners, Fox news gets an eagle flying with an American Flag!

Now, this isn’t a final product - it’s still being worked on.  I’ve sent them a mail offering development help if they need it.  I love this idea.

Browsers
Hacks
Spam
User Experience

Comments (0)

Permalink

The problem of spam

Been reading a lot about spam problems lately.

It isn’t a problem for me, since I’m not a high value target for spam. The other reason is that I’ve raised the bar by a very tiny amount. CAPTCHAs (those type the letters in the picture tests) are designed to raise the bar for spammers, and I’ve got kind of a unique one on this blog.

My comments aren’t hosted on blogspot, but rather on a site called haloscan. That tiny little difference has meant that I have never displayed a single comment spam ever. Automated comment spam occasionally is done, but it is always done using the normal blogspot comment fields. I get notices of these when they happen, but they aren’t a worry because they aren’t displayed ever or crawled by search engines.

This works because spam is a problem of economics. It takes very little work to be not worth the effort.
This is also a reason that firefox tends to be more secure than ie6. Fewer folks use it and therefore its less lucrative to write firefox exploits. So one of the surprising things that would tend to make ie6 and the web more secure is if opera, safari, and firefox took off!

Browsers
Captchas
Economics
Incentives
Spam

Comments (0)

Permalink

Bad Behavior has blocked 221 access attempts in the last 7 days.