Design By Code

from $69.00



Drawing inspiration from Design by Numbers, the influential project led by John Maeda at the MIT Media Lab in the 90's, this class also aims to introduce programming basics to artists with no previous coding experience. Starting with basic 2d shapes and colors, the examples will translate basic design principles — scale, rhythm, transparency, modularity, pattern — into code.


Sunday, Feb 15th, 2015 11:00 a.m. – 5:00 p.m. (6 hours)

(Intro hour: 10:00 a.m. - 11:00 a.m.) what is intro hour?


Gabriel Gianordoli - Gabriel Gianordoli is a visual and interaction designer who draws with data, code, and his hands. Depending on variations of those 3 tools, his work falls into different categories: visual design, UX, data visualization, or data art.


the Metropolitan Exchange, 33 Flatbush Ave, 4th Floor, Brooklyn, New York, 11217 (Map)


We will select some of the tastiest brunch spots to satisfy your appetite(MiriamChar No4Cafe Luluc, etc.), while our carefully prepared curriculum will ensure that you are provided with a full, comprehensive and lasting understanding of our course topics. 


What should I bring?

  1. Mac Users:
  2. Windows Users:

Course Overview

How can computer programming serve as a medium for visual expression? This question has been addressed by pioneers of computer arts long ago, but coding is still seem as an inaccessible tool for practitioners of visual arts and design today.

This class draws inspiration from 2 previous initiatives in the field. First, John Maeda's project at the MIT Media Lab in the 90's, Design by Numbers. Second, Ellen Lupton and Jennifer Cole Phillips' book Graphic Design Design: The New Basics, which presents an updated syntax of graphic design.

Students will utilize openFrameworks, a creative coding toolkit that makes it easy to create interactive visuals in C++. Participants will be encouraged to draw and code, experimenting with visual sketches for each theme.

Why openFrameworks is important?

openFrameworks is a tool for creativity based on C++, already having spread across many countries like the US and Japan, and now developing quickly in China. It plays an important role at the top level of many cutting edge fields like new media art, interactive design, the "internet of things", robotics, etc. 

Frequently asked questions

1. Do I have to know openFrameworks? Is it required for taking this class?
You don't have to know any openFrameworks. oF Course gives someone who doesn’t have any coding skills the full support. An one hour long intro hour will be hosted before every course, if you are beginner with OF, you can take it to catch up. What is intro hour?
2. Can I take class online if I am not in NYC?
You can take it onsite or through recorded sessions on youtube and get timely assistance from teaching crew by google hangout or Skype. please contact for more info.
3. Can I take whole session of spring 2015?
You can contact to get access to register full session. As a small     
appreciation, we will give you 10% discount for the total tuition.                            


  1. Intro Hour (10:00-11:00) **optional what is intro hour?

  2. Introduction (11:00-12:00)
    • computer arts
    • generative art
    • generative design
  3. Coding Basics (12:00-14:00)
    • 2D Geometry
      • point, line, plane
      • fonts
    • Color
      • color models
      • color scale
  4. The New Basics of Graphic Design (14:00-17:00)
    • Rhythm
    • Scale
    • Texture
    • Transparency
    • Modularity
    • Pattern


**You can contact us for corporate training or small group training opportunities.

Other Courses

Intro to Openframeworks/C++

Presents a brief introduction to writing code in c++, followed by an immersion into using OF

Feb 8 2015

Animation By Code

To understand animation through the lens of code through basic geometry and physics principles

Feb 22 2015

Visual Music

Explore the relationships between audio and visual forms using openFrameworks

Mar 1 2015


Glitch Workshop

Break and crash our operating systems, explore and embrace everything around the system

Mar 8 2015


Live Coding Shaders

Learn how to setup an openFrameworks project to live code shaders in GLSL, and how to make them interactive

Mar 15 2015