Updated context-free post
This commit is contained in:
parent
475f7d1a4e
commit
0a1db37273
BIN
images/spiral-first-20110823.png
Normal file
BIN
images/spiral-first-20110823.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 476 KiB |
BIN
images/tree3-abg.png
Normal file
BIN
images/tree3-abg.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 60 KiB |
BIN
images/tree4-lul.png
Normal file
BIN
images/tree4-lul.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 79 KiB |
BIN
images/welcome.png
Normal file
BIN
images/welcome.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 397 KiB |
@ -1,26 +1,46 @@
|
||||
---
|
||||
layout: post
|
||||
title: Context Free
|
||||
date: August 29, 2011
|
||||
tags: CG, Project, Technobabble
|
||||
status: publish
|
||||
type: post
|
||||
published: true
|
||||
author: Chris Hodapp
|
||||
---
|
||||
My [last post](http://hodapple.com/blag/isolated-pixel-pushing/) mentioned a program called [Context Free](http://www.contextfreeart.org/) that I came across via the [Syntopia](http://blog.hvidtfeldts.net/) blog as his program [Structure Synth](http://structuresynth.sourceforge.net/) was modeled after it.
|
||||
|
||||
I've heard of [context-free grammars](http://en.wikipedia.org/wiki/Context-free_grammar) before but my understanding of them is pretty vague. This program is based around them and the documentation expresses their [limitations](http://www.contextfreeart.org/mediawiki/index.php/Context_Free_cans_and_cannots); what I grasped from this is that no entity can have any "awareness" of the context in which it's drawn, i.e. any part of the rest of the scene or even where in the scene it is. A perusal of the site's [gallery](http://www.contextfreeart.org/gallery/) shows how much those limitations don't really matter.
|
||||
My [last post](./2011-08-27-isolated-pixel-pushing.html) mentioned a
|
||||
program called [Context Free](http://www.contextfreeart.org/) that I
|
||||
came across via the [Syntopia](http://blog.hvidtfeldts.net/) blog as
|
||||
his program [Structure Synth](http://structuresynth.sourceforge.net/)
|
||||
was modeled after it.
|
||||
|
||||
I downloaded the program, started it, and their welcome image (with the relatively short source code right beside it) greeted me, rendered on-the-spot:
|
||||
I've heard of
|
||||
[context-free grammars](http://en.wikipedia.org/wiki/Context-free_grammar)
|
||||
before but my understanding of them is pretty vague. This program is
|
||||
based around them and the documentation expresses their
|
||||
[limitations](http://www.contextfreeart.org/mediawiki/index.php/Context_Free_cans_and_cannots);
|
||||
what I grasped from this is that no entity can have any "awareness" of
|
||||
the context in which it's drawn, i.e. any part of the rest of the
|
||||
scene or even where in the scene it is. A perusal of the site's
|
||||
[gallery](http://www.contextfreeart.org/gallery/) shows how much those
|
||||
limitations don't really matter.
|
||||
|
||||
<a href="http://hodapple.com/blag/wp-content/uploads/2011/08/welcome.png"><img class="alignnone size-large wp-image-505" title="Context Free welcome image" src="http://hodapple.com/blag/wp-content/uploads/2011/08/welcome-685x656.png" alt="" width="411" height="394" /></a>
|
||||
I downloaded the program, started it, and their welcome image (with
|
||||
the relatively short source code right beside it) greeted me, rendered
|
||||
on-the-spot:
|
||||
|
||||
The program was very easy to work with. Their quick reference card was terse but only needed a handful of examples and a few pages of documentation to fill in the gaps. After about 15 minutes, I'd put together this:
|
||||
[{width=100%}](../images/welcome.png)
|
||||
|
||||
<a href="http://hodapple.com/blag/wp-content/uploads/2011/08/spiral-first-20110823.png"><img class="alignnone wp-image-507" title="spiral-first-20110823 (Context Free)" src="http://hodapple.com/blag/wp-content/uploads/2011/08/spiral-first-20110823-685x685.png" alt="" width="685" height="685" /></a>
|
||||
The program was very easy to work with. Their quick reference card was
|
||||
terse but only needed a handful of examples and a few pages of
|
||||
documentation to fill in the gaps. After about 15 minutes, I'd put
|
||||
together this:
|
||||
|
||||
Sure, it's mathematical and simple, but I think being able to put it together in 15 minutes in a general program (i.e. not a silly ad-hoc program) that I didn't know how to use shows its potential pretty well. The source is this:
|
||||
[{width=100%}](../images/spiral-first-20110823.png)
|
||||
|
||||
{% highlight bash %}
|
||||
Sure, it's mathematical and simple, but I think being able to put it
|
||||
together in 15 minutes in a general program (i.e. not a silly ad-hoc
|
||||
program) that I didn't know how to use shows its potential pretty
|
||||
well. The source is this:
|
||||
|
||||
```bash
|
||||
startshape MAIN
|
||||
background { b -1 }
|
||||
rule MAIN {
|
||||
@ -42,15 +62,19 @@ rule SQUARE1 {
|
||||
SQUARE { }
|
||||
SQUARE1 { h 2 sat 0.3 x 0.93 y 0.93 r 10 s 0.93 }
|
||||
}
|
||||
{% endhighlight %}
|
||||
```
|
||||
|
||||
I worked with it some more the next day and had some things like this:
|
||||
|
||||
<a href="http://hodapple.com/blag/wp-content/uploads/2011/08/tree3-abg.png"><img class="alignnone size-medium wp-image-508" title="tree3-abg" src="http://hodapple.com/blag/wp-content/uploads/2011/08/tree3-abg-300x225.png" alt="" width="300" height="225" /></a> <a href="http://hodapple.com/blag/wp-content/uploads/2011/08/tree4-lul.png"><img class="alignnone size-medium wp-image-509" title="tree4-lul" src="http://hodapple.com/blag/wp-content/uploads/2011/08/tree4-lul-283x300.png" alt="" width="283" height="300" /></a>
|
||||
[{width=100%}](../images/tree3-abg.png)
|
||||
|
||||
I'm not sure what it is. It looks sort of like a tree made of lightning. Some Hive13 people said it looks like a lockpick from hell. The source is some variant of this:
|
||||
[{width=100%}](../images/tree4-lul.png)
|
||||
|
||||
{% highlight bash %}
|
||||
I'm not sure what it is. It looks sort of like a tree made of
|
||||
lightning. Some Hive13 people said it looks like a lockpick from
|
||||
hell. The source is some variant of this:
|
||||
|
||||
```bash
|
||||
startshape MAIN
|
||||
background { b -1 }
|
||||
rule MAIN {
|
||||
@ -74,20 +98,62 @@ path box {
|
||||
LINEREL{x 0 y -1}
|
||||
STROKE{p roundcap b 1 }
|
||||
}
|
||||
{% endhighlight %}
|
||||
```
|
||||
|
||||
The program is very elegant in its simplicity. At the same time, it's a really powerful program. Translating something written in Context Free into another programming language would in most cases not be difficult at all - you need just a handful of 2D drawing primitives, a couple basic operations for color space and geometry, the ability to recurse (and to stop recursing when it's pointless). But that representation, though it might be capable of a lot of things that Context Free can't do on its own, probably would be a lot clumsier.
|
||||
The program is very elegant in its simplicity. At the same time, it's
|
||||
a really powerful program. Translating something written in Context
|
||||
Free into another programming language would in most cases not be
|
||||
difficult at all - you need just a handful of 2D drawing primitives, a
|
||||
couple basic operations for color space and geometry, the ability to
|
||||
recurse (and to stop recursing when it's pointless). But that
|
||||
representation, though it might be capable of a lot of things that
|
||||
Context Free can't do on its own, probably would be a lot clumsier.
|
||||
|
||||
This is basically what some of my OpenFrameworks sketches were doing in a much less disciplined way (although with the benefit of animation and GPU-accelerated primitives) but I didn't realize that what I was doing could be expressed so easily and so compactly in a context-free grammar.
|
||||
This is basically what some of my OpenFrameworks sketches were doing
|
||||
in a much less disciplined way (although with the benefit of animation
|
||||
and GPU-accelerated primitives) but I didn't realize that what I was
|
||||
doing could be expressed so easily and so compactly in a context-free
|
||||
grammar.
|
||||
|
||||
It's appealing, though, in the same way as the functions discussed in the last post (i.e. those for procedural texturing). It's a similarly compact representation of an image - this time, a vector image rather than a spatially continuous image, which has some benefits of its own. It's an algorithm - so now it can be parametrized. (Want to see one reason why parametrized vector things are awesome? Look at [Magic Box](http://magic-box.org/).) And once it's parametrized, animation and realtime user control are not far away, provided you can render quickly enough.
|
||||
It's appealing, though, in the same way as the functions discussed in
|
||||
the last post (i.e. those for procedural texturing). It's a similarly
|
||||
compact representation of an image - this time, a vector image rather
|
||||
than a spatially continuous image, which has some benefits of its
|
||||
own. It's an algorithm - so now it can be parametrized. (Want to see
|
||||
one reason why parametrized vector things are awesome? Look at
|
||||
[Magic Box](http://magic-box.org/).) And once it's parametrized,
|
||||
animation and realtime user control are not far away, provided you can
|
||||
render quickly enough.
|
||||
|
||||
*(And as [@codersandy](http://twitter.com/#!/codersandy/statuses/108180159194079232) observed after reading this, [POV-Ray](http://www.povray.org/) is in much the same category too. I'm not sure if he meant it in the same way I do, but POV-Ray is a fully Turing-complete language and it permits you to generate your whole scene procedurally if you wish, which is great - but Context Free is indeed far simpler than this, besides only being 2D. It will be interesting to see how Structure Synth compares, given that it generates 3D scenes and has a built-in raytracer.)*
|
||||
*(And as
|
||||
[\@codersandy](http://twitter.com/#!/codersandy/statuses/108180159194079232)
|
||||
observed after reading this, [POV-Ray](http://www.povray.org/) is in
|
||||
much the same category too. I'm not sure if he meant it in the same
|
||||
way I do, but POV-Ray is a fully Turing-complete language and it
|
||||
permits you to generate your whole scene procedurally if you wish,
|
||||
which is great - but Context Free is indeed far simpler than this,
|
||||
besides only being 2D. It will be interesting to see how Structure
|
||||
Synth compares, given that it generates 3D scenes and has a built-in
|
||||
raytracer.)*
|
||||
|
||||
My next step is probably to play around with [Structure Synth](http://structuresynth.sourceforge.net/) (and like Fragmentarium it's built with Qt, a library I actually am familiar with). I also might try to create a JavaScript implementation of Context Free and conquer my total ignorance of all things JavaScript. Perhaps a realtime OpenFrameworks version is in the works too, considering this is a wheel I already tried to reinvent once (and badly) in OpenFrameworks.
|
||||
My next step is probably to play around with
|
||||
[Structure Synth](http://structuresynth.sourceforge.net/) (and like
|
||||
Fragmentarium it's built with Qt, a library I actually am familiar
|
||||
with). I also might try to create a JavaScript implementation of
|
||||
Context Free and conquer my total ignorance of all things
|
||||
JavaScript. Perhaps a realtime OpenFrameworks version is in the works
|
||||
too, considering this is a wheel I already tried to reinvent once (and
|
||||
badly) in OpenFrameworks.
|
||||
|
||||
Also in the queue to look at:
|
||||
* [NodeBox](http://nodebox.net/code/index.php/Home), "a Mac OS X application that lets you create 2D visuals (static, animated or interactive) using Python programming code..."
|
||||
* [jsfiddle](http://jsfiddle.net/), a sort of JavaScript/HTML/CSS sandbox for testing. (anarkavre showed me a neat sketch he put together [here](http://jsfiddle.net/anarkavre/qVVuD/))
|
||||
* [Paper.js](http://paperjs.org/), "an open source vector graphics scripting framework that runs on top of the HTML5 Canvas."
|
||||
* Reading [generative art](http://www.manning.com/pearson/) by Matt Pearson which I just picked up on a whim.
|
||||
|
||||
* [NodeBox](http://nodebox.net/code/index.php/Home), "a Mac OS X
|
||||
application that lets you create 2D visuals (static, animated or
|
||||
interactive) using Python programming code..."
|
||||
* [jsfiddle](http://jsfiddle.net/), a sort of JavaScript/HTML/CSS
|
||||
sandbox for testing. (anarkavre showed me a neat sketch he put
|
||||
together [here](http://jsfiddle.net/anarkavre/qVVuD/))
|
||||
* [Paper.js](http://paperjs.org/), "an open source vector graphics
|
||||
scripting framework that runs on top of the HTML5 Canvas."
|
||||
* Reading [generative art](http://www.manning.com/pearson/) by Matt
|
||||
Pearson which I just picked up on a whim.
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user