All Posts

Cool Cat

Hey I did a thing. It’s pretty cool! Jack helped me discover box() instead of (rect) and how to rotate the image so you can really see the 3D aspect of it.

Here’s the original picture I used:

Here’s the code:

PImage img;
float increment = 5;
float incrementZ = 400;

void setup() {
  size(1200, 720, P3D);
  img = loadImage("pics.jpg");
  rectMode(CENTER);
}

void draw() {
  noStroke();
  background(0);
  rotateY(.2);

  for (int y = 0; y<img.height; y+= increment) {           
    for (int x = 0; x <img.width; x+= increment) { 
      img.loadPixels();
int index = (x + y * img.width);
      color pix = img.pixels[index];
      fill(pix); 
      float diam = map(brightness(pix), 0, 255, 2, incrementZ/2);
      pushMatrix();
      translate(x, y, diam);
      
      box(increment, increment, map(mouseX, 0, width, 0, incrementZ));
      popMatrix();
    
    }
  }
  
 img.updatePixels();
 
 increment = map(mouseY, 0, width, 5, 30);
}

Basically, the increment size changes with the Y axis and it “explodes” on the Z axis based on the mouseX value. Here’s a video to show it off:

In Class Exercises

Start with which ever is easiest, go deep or try as many as you can get through. Post at least one finished one on the blog (with images/video/code/etc.)

  • Take an image and make an artistic collage with sections of that image using get()
  • Access the pixels of an image and for a particular color change that pixel with a pixel from another image (green screen effect)
  • Take an image and draw it with rectangles with the proper colors
    • Make those rects explode along the Z-axis based on the brightness of each pixel ( you need to set P3D in the size statement at the beginning of the sketch, i.e. size(512,512,P3D) )
    • Make it interactive with the mouse, the further you move the mouse in one direction the more it explodes, or goes back to it’s original position
  • Take an image and draw it with rectangles or circles with the proper colors
    • Using a class/object from before (like the letters sketches), or some other generative movement algorithm, make the shapes move around on screen in various ways and then return to their  home positions when you press a key

Updated Final Project Idea

I decided to completely change my project because I wasn’t too confident with my previous proposal. For this project, I will be using more of the techniques we’ve already learned in class, so I don’t have to use too many new techniques and overwhelm myself.

As an art history student, I’m really interested in the idea of using interactive methods and interactive media within museums or gallery spaces or in relation to them.

I was inspired by an idea that I thought was really cool––the “Highway Gallery” project by the Louvre Abu Dhabi. I was driving back to Abu Dhabi from Dubai airport after spring break, where I saw a Buddhist statue replica on the E11 Sheikh Zayed highway.

As it turns out, it was part of a series of three sculptures and 10 metre high billboards showcasing the museum’s collection on the highway, where you can tune in to Radio 1 (100.5 FM), Classic FM (91.6 FM), and Emarat FM (95.8 FM) to experience the artworks and listen to their stories from your car. I thought it was a clever way of engaging people with the museum’s collection and teaching them a thing or two, without them having to physically visit the museum. The project takes into account the “car culture” which is prevalent in the UAE. It takes a highly-frequented highway that’s usually empty and uneventful landscape-wise and transforms it completely.

It also reminded me of the Louvre-Rivoli underground station in Paris, where they have replica works from the Louvre’s collection for everyone to view, even though this example is merely visual and not really “interactive”, I liked the idea of extending the museum to the public sphere.

Louvre-rivoli-metro1-Paris

There exists a wide-ranging dialogue about museums in the digital age, and how we can extend museums and museum knowledge beyond museum walls. There are also a lot of conversations being had about what museums would look like in the future.

For the longest time, most museums have been static, rigid spaces within an ever-changing world. Oftentimes because a lot of the objects within them come from the past, we construct an idealized way of looking at them, preserving them and displaying them using approaches that are becoming increasingly counterintuitive and disengaging.

“The speed of technological change is transforming the way people access, enjoy and create culture and if we don’t seek to fully grasp its potential there is a real risk that we (museums) become obsolete for those we seek to engage.”(Laura Wilkinson, Programme Director, New Museum, Museum of London)

Going off of this idea that museums can become personalized experiences by the use of technology and interactive methods, and using the above concepts as inspiration, I will be creating a single exhibit, where the main idea would be to bridge the work in display to reality using physical computing, and where different aspects of the “visitor”‘s movements within the space will become reflected on the artwork in one way or another. It would be a “moving” museum of some sort, and I might include a sound or light dimension to it as well.

For the exhibit, I will be needing gallery display stands such as the one shown below, with a piece of glass covering the top part of the cuboid:

Image result for gallery stands

(These are usually available through the installation team at the Arts Centre)

As for the “content” of the exhibit, I want to create some sort of theme, and the focus will be on storytelling through interaction. I need to think a little bit more about the content of the exhibition, but I like the idea of creating some form of a futuristic exhibit set in the future, displaying our current technologies and what our uses for them were. Kind of like a technological archive or “graveyard”, where old technology goes after it dies.

I will need:

  • A Kinect camera which I will be using with Processing to track gestures or movements, which will be reflected on the displayed objects in the “museum”.
  • Two geared motors which I will be using to rotate displayed objects.
  • 2+ Arduino boards
  • 2-3 Display stands

The three most difficult aspects of this project are going to be:

  • Figuring out the actual content of the exhibit, and how using interactive methods is going to improve the way visitors understand the content, engage with it, etc. and whether the project will succeed in achieving an innovative way of engaging with museum objects.
  • Having a good restart system, and figuring out how the project will be able to handle multiple visitors at the same time (or maybe limit it to one visitor at the time?)
  • Figuring out clear, simple and seamless interactions, and setting up the exhibit in a way where I don’t need to give out too many instructions to the visitor.

(More information coming soon)

 

Tori and Kyle – Even More Dart Stuff

What’s up y’all we’re back! You know who we is. Our little old interactive dartboard has grown up into a big dartboard who is making its parents (us) proud.

Well, it’s still a concept, so not yet. Hey! Speaking of concepts, let’s get right into it…

Concept

Dartboard Interactive Hangman

  • How will it work?
    • People will throw darts at a square dartboard (about the size of a whiteboard). On the dartboard will be 26 panels (4 rows of 6 with two letters straggling at the bottom).
    • If the letter that the user hits is in the word (that has been randomly generated by our list in Processing), it will appear on screen.
    • if the letter is not in the word, a sad but cool animation will happen to inform the dart-shooter that they have chosen incorrectly. The letter will then be placed in a “Letters Already Chosen” box and a body part of the Hangman will be drawn
    • The “game” is over once they get the word, or the man is fully drawn onscreen. In either case, a super fun animation will happen.
  • What is the Purpose behind this?
    • Kyle and I both grew up playing hangman in our schools. It often brought together unlikely people and strengthen the bonds between friends. Putting this into processing and adding darts into it just extends a childhood game into our “adult” interests and skills and invites people in to form new connections with each other.
    • also darts are cool.
      • they have a sort of physicality to them that will work nicely to support interactivity.

Technical Considerations

  • Durability
    • how can we make it withstand having darts thrown at it?
  • Consistency
    • using switches instead of sensors should help with this!
  • Proof of Concept
    • Will the game work?
  • Program
    • will it do what we want it to?
  • Dartboard Mobility

Equipment Requirements

  • Projector (to be supplied by Kyle)
  • Darts
  • Arduino (2)
  • Materials for Dartboard (Wiring, Conductive + Permeable Layers/Fabric/Foam)
  • Acrylic for Housing/Protection of Wires
  • Things to glue it all together!

Program

  • The darts going through the permeable layers will act as a switch, thus triggering a response of either 0 (low) or 1 (high). We can then send that from arduino to processing. Once processing reads that 0/1, it can trigger a response.
  • If it clicks the wrong letter, an animation will happen and it will draw a new body part. If it clicks the right letter in a randomly generated word, it’ll display the letter on a line to fill in the word.
  • Note that once we conceptualize it and know the specific steps, it’ll be a lot easier to build the program and make the moving pieces work together.

Electrical Construction

It’s really just switches. The hard circitry is making an interesting switch. Plus, we may need more pin imputs… 😀

Physical Construction 

  • Corkboard
    • Needs to be durable and reliable, as well as work with our system
  • We plan to design an acrylic housing to not only hold the switches, but also to protect the wiring.
  • We want to put it on a whiteboard like system so it is mobile.
  • Make sure it’s consistent and pretty
  • Make it physically satisfying- don’t lose the integrity of the dartboard effect.

Three Aspects that Terrify Us 

  • Designing the Housing
  • Making sure the Switch is Reliable
  • Calling the Word and Triggering Letters

Finalized Project

For the concept, I am doing the following:

I am going to have a physical house, with a window that will basically be somehow attached to a screen. So when you look at the window, you are looking straight at the screen. The house is going to look like a dollhouse of some sorts and the user’s objective is to basically decorate/ furnish the house.

For my program, I am doing the following: 

There has to be some sort of environment, with objects like trees and animals and ponds. They all have to be there on the screen and each object would be connected to a specific pressure sensor. The pressure sensors will all have physical objects placed on them, when a physical object is removed from its place on its sensor, the correlating object on the screen will disappear. 

The three hardest aspects  and why I chose them: 

1- The coding/ programming aspect: I struggle with coding a lot and I think it’s what will take the longest amount of time out of most aspects of the project to tackle.

2-The screen aspect: I need to somehow perfect the screen into a window for my house. It’s going to be somewhat confusing and hard to figure out the parameters and how the box will be stable next to the box. 

3-The building aspect: Achieving balance and harmony across dimensions and materials.

Equipment needs: 

  • Wooden Box
  • Screen
  • Pressure sensors
  • Fabrics
  • Paint
  • Miniature furniture

Physical construction:

To be announced

Electronics:

To be announced

Final Project Update

I made small changes to my final project idea conceptually, and in terms of certain technicalities. So in plain terms, I aim to design a piece of interactive and performative art installation, where the audience shape/silhouette and movements are translated into different complex patterns and colors onto different transparent surfaces. I will still be using a Kinect in order to detect the movement of the audience, and program a Processing sketch that will analyze the data from the Kinect and translate that into patterns and colors. Conceptually, my project aims to explore issues of surveillance in our modern world, where people place a lot of trust in technology and a lot of our personal data is present and recorded on clouds. Through choosing to interact with the installation, the audience are giving information about their movements, which will be recorded by the Kinect. This doesn’t necessarily imply that sharing our data is in inherently good or bad, but rather to make the audience think about the larger implications of that prospect.

I believe some of the complicated or challenging aspects of the project will be:

  1. Separating the data from the Kincet into three sections, since I want each section to present a change of patters as the user moves along the width of the screens.
  2. Programming the Kinect into detecting more than one body at a time rather than solid surfaces
  3. Assigning specific colors to each section and each pattern

Final Project

I have decided to scrap my initial idea for a final project, and have instead decided to create a simple multistage game.

This game is intended to be an educational experience about the environment and human history. The game starts with a player in a forest, the style and POV of which is similar to an early Pokemon game, and the player is able to navigate the forest, which is also populated by animals. The player must walk about and interact with the trees, which will be “chopped” down to make a vehicle. The player can also interact with the animals, who will react positively.

Once the vehicle is completed, the player is taken to a world map and can go to three other stages, collecting resources for more complex and modern vehicles. However, as the player moves on to the other stages, interacts with more animals and constructs more vehicles, the environment reacts more and more negatively, with the animals becoming hostile and the landscape burning and becoming desolate. Eventually, the player is left alone on the planet, free to explore the desolate landscapes of the world alone.

I plan on creating a physical controller, similar to the nunchuck on the original Wii with a x-y joystick and one button.  I also hope to create the controller using clear acrylic, with LEDs inside that change according to how much destruction the player has caused the environment, starting with a green controller,  to a yellow one and finally to a red one.

The materials I need are:

  • Clear Acrylic
  • Several RGB LEDs
  • One X-Y Joystick
  • One Push Button
  • One Arduino
  • One Prototyping Board
  • Screen or TV to present game

I think that the most challenging parts of creating this project will be creating the game, because I am not so confident in coding the game mechanics and am sometimes not confident in my programming logic skills. I am also worried about the game design and the assets I use, especially the visuals and the music/audio. I want this game to be simple but effective in immersing the user into the meaning of this game. Lastly, I am in the process of creating the game and everything is going relatively smooth. However, I want the game to be coded efficiently so that I do not have hundreds or even thousands of lines of code. I want to be able to replicate stages and objects’ behavior properly so I do not have to copy code between different classes.

 

Ironman Project: Update 5/1/19

Concept of the Project:
After the feedback received in class, the concept of the remains the same. We will make a 3D video game that simulates that the user is using the iron man glove to shoot at objects.

Materials Needed:
– Infrared WebCam
– Infrared Light
– IronMan Cable
– A bluetooth arduino that send instructions to the infrared light(if it exist)
– If the above material does not exist, then batteries and a small plastic box that allow us to put the arduino in the glove without causing any accident.
– T.V or projector to screen the video game

Building the project:
The building process will be divided in two main parts: Physical Computing and creating the video game environment. The physical computing consists of building a remodeling of an iron man sensor with an infrared light that allows an infrared webcam detect the location of the glove. The glove will need to be as similar as possible as the iron man glove to create a better experiences with the user. The user in the other hand will have a button that allows them to shoot wherever they are aiming with the glove.

Creating the video game environment consists of using processing to create video game interaction. Our Processing program will receive the location of the glove and will map it to an aiming box that will show up in the screen and will move according to the glove movement. The background will recreate an iconic landscape from one of the Iron Man or Avengers movies in order to immerse the user into the story. Iconic Iron Man enemies will show up for a few seconds and these will be the targets that the user must destroy to earn points. Also, to bring more activeness to the user in the video game, AC/DC and Iron Man music will be played while the user is playing the game.

Biggest Challenges:
– Many Marvel fans have always wanted to know how does it feel to be iron man, and we hope that the interactivity of this game would have enough quality to cause that sensation.
– One of the biggest challenges will be to build a glove that gives the sensation to the user that is an actual iron man glove. That would be a key to achieve the interactivity that we want
– Another challenge is to create a video game environment that causes the user to feel that he or she is part of the Iron Man Universe. We do not only want the user to feel that they are inside of the iron man suit but also that they traveled to the MCU universe

Final Project Concept

Since the last post, I’ve changed my idea from the Morse code game to an interactive installation where people can interact with the art displayed by plucking at the El wires. Each of the El wires are attached to different points on the wall and the other end of the wire will be tied down so there is enough slack. Once a wire is touched, it should vibrate and triggers the Arduino to connect with Processing so that it can display drawings on the wall. The El wires would also glow when this happens and when it’s idle, the wires won’t light up, so ideally, this project would be placed in a dark room. 

What I Need:

  1. El Wires (different colors if possible)
  2. Hooks for walls to tie the wires onto
  3. (Not-too-sensitive) vibration sensor — possibly analog vibration sensor?
  4. Projector
  5. Speaker (for music) — may or may not need it depending on whether I can find the right sound for the plucking of wires

Top 3 Difficult Problems I Might Run Into:

1. Connecting El Wires to Arduino

I have to solder the El wires to the Arduino and since the El wires come with an inverter, I’m worried about how that works too since I’ve never used one before. With that also comes with the trouble of programming these wires to do exactly what I want. I’m thinking the wires can come in at an angle so maybe I would need a corner of the room.

2. Projection mapping of effects onto specific locations of the wall

I think the way to make sure the wires hit the right spot on Processing art on the wall would be trial and error. Depending on where I put the projector, the size of the screen may change, so I’m worried about having to readjust the projector every time I’m testing. I also have to think about where I should put the projector so that the user isn’t blocking anything.

3. Making sure the Arduino doesn’t detect movement of El Wire when no one is touching it.

From previous experience, I have a feeling that the vibration sensor would let me down by detecting very small vibrations or by being very sensitive. I also have to find where the best place to attach the sensor is and how I should attach it so that it doesn’t end up falling after a while.