Generative Design

CMPM 147 Generating Worlds

Instructor: Kate Compton

Office: E2 393, office hours Mon. 2:30-3:30 or by appt.

Kresge College Room 319, MWF,12:30-1:45pm



Class description

How can simple physical rules create the wide ranges of seashells, flowers, and galaxies we see in the natural world? Learn to generate surprising new worlds for art, games, and science, with powerful techniques like grammars, boids, cellular automata, fractals, and genetic algorithms. The class will use JavaScript and Processing to create unique interactive experiences.

After taking this class, students will understand how simple algorithms can complex constructions, an important concept of programming. They will have learned satisfy aesthetic or scientific goals with actual running code, which will provide a good foundation to create more ambitious work in Computational Media




Learning outcomes

By the end of the quarter:

  • ●  Students can identify patterns in nature and explain those patterns as the result of a repetitive process.

  • ●  Students have a working knowledge of Processing/Javascript’s drawing functionality and can create sophisticated drawings using these tools.

  • ●  Students can express physical processes as a simplified simulation to reproduce those patterns computationally.

  • ●  Students can use these processes to create work that is artistically or scientifically interesting

    As a 5 credit class, this class will expect 15 hours per week, 3.5 of which will be spent in class on lectures, activities, and discussion. Additionally, 5 hours would be expected to be spent on reading an estimated 20-40 pages of scholarly articles and book chapters per week. The remaining 6.5 hours are for homework exercises or the assignments.

    If you qualify for classroom accommodations because of a disability, please get an Accommodation Authorization from the Disability Resource Center (DRC) and submit it to me in person outside of class (e.g., office hours) within the first two weeks of the quarter. Contact DRC at 459-2089 (voice), 459-4806 (TTY), or for more information on the requirements and/or process.


10% class participation

20% HW practice exercises and reading responses - graded based on completion

40% Assignments (3 Generations, Living Paintbrush, Story grammar, Context Free Art) - graded based on generativity, artistic merit, explanation, etc.

30% Final project


  • Proposal: 5%
  • Finished Work (due before finals)15%
  • In-class presentation (during finals block)10%


Late Work: 1 week extension, 20% off, and you still have to present it in class

Expect 20-40p of reading a week, due each Friday, and one homework or project coding assignment due each Monday

HW and Projects (submit to google drive)

  • ●  Video: 5-20 seconds, Giphy or other easy capture to mp4 (or youtube, etc)

  • ●  Source and working version

  • ●  3 paragraph writeup (projects only)

    • ❍  (Goal: Practice explaining your work, and document how concept changes with implementation)

    • ❍  Plan of attack: one paragraph before you start, explaining your intentions and how you intend

      to build them.

    • ❍  Post mortem: one paragraph about how that worked out, and what you ended up with, and

      the - modification and new directions that you took during the process

    • ❍  Acknowledgements: one paragraph to list any outside assistance, code snippets, library use,

      etc Avoid software development kvetching except when explaining how it evolved your design

      Reading response, for each reading assigned

      (borrowed from Jim’s 265 class)

  • ●  1-2 paragraphs summarizing the main point(s) of the article.

  • ●  1-2 paragraphs describing one of the following:

  • ●  Something you found inspirational

  • ●  A research question (or questions) the article suggests

  • ●  Ways you could apply the technique

  • ●  Aspects you liked/disliked about the article (please do not focus on the writing)



Some online articles (academic and industry)
Some playable artifacts (web based, make sure you can run OpenGL)
Nature of Code by Daniel Shiffman (available from amazon or pay-what-you-want PDF)

Honor Code
If you were a programmer in the professional world, you would be expected to seek information

online and from your colleagues. You would also expect to get in trouble for claiming ownership of code that is not yours. The same principle applies here. Based on the Stanford CS honor code (, please follow these guidelines for code you submit in this class:

  • ●  Citation: If you received help or code from an outside source, cite it, including the URL. Make it clear in your source code where your work ends and other work begins. Each assignment's written component will have a section to cite sources you used, so, if you used the excellent js Voronoi library, write something like "I used Raymond Hill's Voronoi solver to find regions around the points (" Note that even in non-academic settings, StackOverflow requires attribution if you use snippets ( ck-overflow/25957#25957)

  • ●  Transformation: To quote from the doctrine of Fair Use: "Has the material you have taken from the original work been transformed by adding new expression or meaning? Was value added to the original by creating new information, new aesthetics, new insights, and understandings?" This is a class about making expressive programs. Any libraries that you use should be a small part of a much larger system, and the "new information, new aesthetics, new insights, and understandings" should be your own.

    Reminder: yes, I can search StackOverflow as well as you can.


Proposed schedule

Week 1: Rules and Generativity

We start with in-class physical activities (modular origami, Vi Hart’s flower generation algorithm) to explore the idea that simple rules, when repeated, can create the complex structures we see in physics, biology, and society. Students learn that rules, starting conditions, and iterations all influence the finished product of a generative system. Students read about patterns in nature, and how they often share similar generative algorithms, and identify new patterns in nature and form hypotheses about what algorithms might have created them.

Week 2: Repetition and Loops

Students learn basic drawing with Processing (using transforms), and how to create shapes and animations on screen. We explore how overlapping and repeating forms creates complexity and juxtaposition, and how that can be used in aesthetic pursuits. HW: drawing generative shapes with Processing.

Week 3: Interaction

How do you respond to user input in a way that makes the user feel “more powerful” and more skillful than they actually are? Students apply knowledge of Processing drawing tools to build a “living-paintbrush” that draws complicated shapes

Week 4: Textures and grids

Simulating physical processes with grids. Students learn the ways arrays and grids are used in games and science simulations, and can represent the generation of patterns in animal skins and natural predator-prey distributions. We discuss the use of Perlin noise, and how it can be used as a starting seed for generative systems. Students create artificial ‘life’ that can access nearby cells to create reaction diffusion or Game Of Life simulations.

Week 5: Grammars and recursion

We discuss randomness and unpredictability as an aesthetic tool, and explore how recursive programming can generate random content that still has structure. We explore the basic concept of grammars using Tracery (a grammar-based storytelling tool). Students make story grammars to understand the balance between variation and control.

Week 6: Branching L-systems

Grammars also provide a robust way to model spatial phenomena, like trees and houses. We read and discuss the use of grammars to describe cities and trees. Students practice using Context Free Art.

Week 7: Fractals

In-class activity: making paper fractal Heighway dragons, and other pen-and-paper fractals to demystify what fractals are. Discuss self similarity and how that relates to recursion. Open ended assignment include making Peano curves and fractal terrain in Processing (or Context Free Art). STUDENTS PROPOSE FINAL PROJECTS

Week 8: “Intelligent” Agents

Learning and review the basics of 2D vector math, and how it supports physical simulations by representing momentum and movement. Students learn to simulate ‘forces’ and move ‘agents’, and learn how that movement can be used to create ‘character’, by examining and reproducing famous agent-based systems like Boids flocks and Braitenberg vehicles.

Week 9: Evolution

Explore how other scientists/developers have used generativity to create evolutionary algorithms to design images and robots and vehicles. Compare supervised and unsupervised evolutionary algorithms, and techniques to involve human users in an evolutionary system.

Week 10: Constraints and Evaluations

How do we know whether a generative system is successful? How would you demonstrate the success of a generative system you had built, in a scientific paper or in a presentation? We will read about and discuss contemporary research in constraint solvers, and how this type of software can make generative solutions to fulfill real-world constraints. We will also read and discuss the latest

approaches to evaluating generative systems.

Week 11: Final

Final project presentations.

Additional resources
Want more PCG?
Optional, recommended JS guides:

  • ●  Javascript: the Good Parts, Douglas Crockford

  • ●  Javascript Patterns, Stoyan Stefanov

  • ●  Secrets of the Javascript Ninja, John Resig

Interesting images and links

Instructors and Assistants