OpenFrameworks: On The Line

OpenFrameworks: On The Line

Welcome to processing.js for Open Frameworks! Have you ever made a project in openFrameworks and been like "This is awesome! I want to put it on my online portfolio!". You could always make a video or take photos, but what about the UI aspect of your project? How can people see the awesome mouse effects you made? Enter Emscripten. Emscripten turns your C++ code into Javascript code in a matter of minutes! So you can put your awesome OF project "on the line" in your portfolio. My project 'OpenFrameworks: On The Line' is a proof-of-concept of making the Emscripten library work. 

The Emscripten project spear-headed by Arturo Castro (a core OF developer) is really not being used widely in the community. By submitting this project as part of the OFOpen, my hope is that more people will start using it. By popularizing the functionality it could be a more core functionality of OF. Further research needs to be done to see the capacity of Emscripten, like which add-ons work and do not. Also, rendering speed is an apparent issue which should be addressed. 

I think one core question is:  Can OF on the web push our creative pursuits? Or is this just simply for documentation? I would like to hope that by adding functionality to our tool box we can push the limitations of our artistic expression and find new avenues in which to operate. I think more work here can help shape a new era of OF creativity. 

The piece that I have submitted as my proof of concept is called "Sol Lewitt Met" which is an interpretation of Sol Lewitt's Wall Drawing #118. The points are generated by performing a Self Organizing Map algorithm on data from the Metropolitan Museum of Art. Each point represents a work of art that is organized by the RGB color channel. The points are then connected by lines to create a data-driven-wall-drawing.

Emscripten Examples:

Install Emscripten:

Procedures to run it:

  1. Download the nightly build of OF:
  2. Open the Project Generator in the nightly build version of OF
  3. Make a new project (lets call this solLewittMet)
  4. Copy the source code of your running project into you "nightly build" version
  5. Go into Terminal and 'cd' into the solLewittMet project in the "nightly build
  6. In Terminal type: /Users/reginaflores/Documents/emsdk_portable/emscripten/1.30.0/emmake make (this is where you have downloaded your emscripten files)
  7. In Terminal type: /Users/reginaflores/Documents/emsdk_portable/emscripten/1.30.0/emrun bin/solLewittMet.html

After you run the emmake command you see that the Terminal gives you the .html file to run in the emrun command. Notice how the bin is now full of web files. 

In the /public_html files on your website put all the bin files: 

What's The Female Body For?

A collaboration with my classmates Kristin Slater and Marcos Berenhauser. I produced the visuals for the live performance using OpenFrameworks.

Video editing: Marcos Berenhauser

Performer/Dancer: Kristin Slater

Screenshot of my point of view during the performance. I manually control the visuals live using OpenFramworks custom software. 

Major Studio Final: SYNERGY

Synergy is a performance piece that sits at the intersection of design, technology, and improvisational-performance. Explorations were made using improvised dance movements, interactions with projected light, and visualizations created in the OpenFrameworks toolkit using a Kinect Sensor. Synergy was filmed in a closed-set at the Alchemical Theatre in New York City on December 5th, 2014. Synergy was enacted by the Synergy Collective, a six-person production team comprised of a creative coder/director, dancer, DJ, videographer, creative consultant, and a general alchemist. The filmed performance piece was then cut into a 2.5 minute short video and presented as the representation of the work. 

Also check out this short behind the scenes clip:

Creative Coding Final: microMacro

This project is an exploration in the duality between the micro and the macro — a duality that, while seemingly different, is inherently similar, fractal, reflective and mirrored. Through experiments using the OpenFrameworks platform, I made a series of creative visuals that may prompt us all to reflect on the beauty and unity in the microMARO-cosm.    


Created using OpenFrameworks using ofxUI and ofxPostProcessing addons.

Code can be found here:

Music: Above & Beyond by The DJS of EuroTrance Alliance