An Interactive Lighting Installation Powered By Creative Coding.

MIT Illuminations is an ongoing experiment in creative computation at the MIT Welcome Center. The lights dynamically illuminating the center are, like the MIT community, colorful, ever-changing, and alive.

They were inspired by a long history of the MIT community deploying creative installations of colorful lights in dormitories, on bridges and buildings, and around campus.

Meanwhile, the software driving the lights is published under the open-source MIT license, so anyone in the world can learn how to make their own.

Now Playing at the Welcome Center

DRAFT MITNews_1

Currently Playing at the MIT Welcome Center

Contributed By

Soso

Image Credit

---

Reveal an image, one row of pixels at a time.

Inspired by 'slit-scan' photography, this code samples an image's colors one row of pixels at a time - and sends those colors to the lights. Using this technique, viewers can watch an image reveal itself over time.

Under The Hood

This is the code currently animating the lights. If you are interested in trying it out yourself, download the MIT Illuminations app for WindowsWindows (64bit) v1.2.11 or MacmacOS (64bit) v1.2.11 or clone the open source repoGitHub .

//
// Title: Slit-Scan
// Contributed by: Soso
//

// Global variables
const w = helpers.canvas.width;
const h = helpers.canvas.height;
const scanSpeed = controls.scanSpeed.value;
let y1, y2;
let img;


// Preload
function preload() {
	img = loadControlImage(
        controls.image.value,
    );
}

// Setup
function setup() {
    createCanvas(w, h);
    img.resize(w, img.height * w / img.width);
    y1 = -img.height + h;
    y2 = y1 - img.height;
}

// Draw loop
function draw() {
    image(img, 0, y1);
    image(img, 0, y2);
    incrementY();
}

// Update the image height
incrementY = function() {
    if (y2 >= -img.height + h) {
        y1 = y2;
        y2 = y1 - img.height;
    } else {
        y1 += scanSpeed;
        y2 += scanSpeed;
    }
}

//
// Title: Slit-Scan
// Contributed by: Soso
//

// Global variables
const w = helpers.canvas.width;
const h = helpers.canvas.height;
const scanSpeed = controls.scanSpeed.value;
let y1, y2;
let img;


// Preload
function preload() {
	img = loadControlImage(
        controls.image.value,
    );
}

// Setup
function setup() {
    createCanvas(w, h);
    img.resize(w, img.height * w / img.width);
    y1 = -img.height + h;
    y2 = y1 - img.height;
}

// Draw loop
function draw() {
    image(img, 0, y1);
    image(img, 0, y2);
    incrementY();
}

// Update the image height
incrementY = function() {
    if (y2 >= -img.height + h) {
        y1 = y2;
        y2 = y1 - img.height;
    } else {
        y1 += scanSpeed;
        y2 += scanSpeed;
    }
}

The lights are animated using p5.jsp5js.org , an open-source JavaScript implementation of the Processingprocessing.org programming language developed at the MIT Media Labmedia.mit.edu .

Screenshot of the MIT Illuminations Application

Download the MIT Illuminations Software And Get Started

Learn More About MIT Illuminations

Introducing MIT Illuminations at the Welcome CenterMIT Admissions Blog“MIT Illuminations,” a colorful installation and introduction to creative computation, is now open in Kendall SquareMIT NewsInstructions for Setting Up Illuminations at HomeLearn.Illuminations

Who Made MIT Illuminations

MIT Illuminations is a collaboration between MIT Admissions, mitadmissions.org MIT Open Space Programmingwhereis.mit.edu, and SOSOsosolimited.com. The software controlling the lights is publishedgithub.com under the MIT Licensewikipedia.org.

Each light show is developed in partnership with MIT students, faculty, staff, and/or community partners.

MIT is committed to providing an environment that is accessible to individuals with disabilities. Learn more about our commitment to accessibility at accessibility.mit.eduaccessibility.mit.edu.