Computational Media

Week14- Final- Dating Strories – Interactive film 

When I started working on this project, Dating stories: an interactive, nonlinear film; I realized that I actually thought about making a film, especially about people’s daily-life. It makes me wonder what I would have done if I was faced with a different choice at that time. Thus, All the users could change different path to shape their own stories.

 

 

I worked with my partner Chris. She and I took turns filming depending on our storyboard.

We cut each clip to around 45second and each story has 7 endings.

Shooting – Nov.21 / Special thanks to Alex, Sharif, Grant

This story starts with an actor(Christina) who can go out with either Jarod or Douglas and make her stories and create her stories as she goes along.

By moving a wooden piece from an interactive board, users can make their stories path to path.

Interactivefilm2016Jina&Chris from 정진아 on Vimeo.

How to play (Instruction)

when a user puts to the wooden piece on the starting point, at the same time, it shows on the monitor Christine texting with Jarod and Douglas on split screens. While a short film is playing, on the board 2 path light up so that users could start.

 

I put a lot of effort into designing the top panel. I especially worked hard designing the shapes of the images so that they can think about stories with images on the board.

After finishing the film they could check the path of travel.

 

 

 

 

 

 

 

Week-10-13  Final ICM Proposal
This project is a collaboration with Chris and we wanted to make an interactive film by using physical interaction. we are interested in what Eko is doing interactive storytelling. we are going to design a very short interactive film  that plays like a board game where a user can make choices on which direction to move the board piece. Each direction has it’s own story dialog.

The whole movie is going to be 3min and the story will start ” choose-your-own- adventure ” and we’ll give them 2 choices each.

These drawings are parts of the simulation.

ICM part

By using P5js, we are going to put 10~14 film(each of film could be within 15sec) in a local page and we are going to use some functions.

createVideo()

play()

stop()

pause()  : while player choosing, hold, pause.

key pressed():

button():

 

 

Week – 9  Sound
 CODE
references :
image NYC ballet
sound archive

Week – 8  API

Code

I was searching for several museum API and I decided to load Cooper-Hewitt Design’s data. The Cooper-Hewitt Design Museum is one of the places in the U.S. exploring history, design, and arts. This museum provides an API regarding their exhibitions, objects, and databases. I followed Cooper-Hewitt’s instructions to get an API key.

 The Cooper-Hewitt Design Museum  This museum provides an API regarding their exhibitions, objects, and database, so I read the Cooper-Hewitt’s API introduction and I’ve got an API key.

%e1%84%89%e1%85%b3%e1%84%8f%e1%85%b3%e1%84%85%e1%85%b5%e1%86%ab%e1%84%89%e1%85%a3%e1%86%ba-2016-10-26-%e1%84%8b%e1%85%a9%e1%84%92%e1%85%ae-6-27-09

%e1%84%89%e1%85%b3%e1%84%8f%e1%85%b3%e1%84%85%e1%85%b5%e1%86%ab%e1%84%89%e1%85%a3%e1%86%ba-2016-10-26-%e1%84%8b%e1%85%a9%e1%84%92%e1%85%ae-11-04-18

%e1%84%89%e1%85%b3%e1%84%8f%e1%85%b3%e1%84%85%e1%85%b5%e1%86%ab%e1%84%89%e1%85%a3%e1%86%ba-2016-10-27-%e1%84%8b%e1%85%a9%e1%84%92%e1%85%ae-1-05-03

Cooper Hewitt JSON

 

Week – 5

1. A sketch in an object-oriented fashion

This week, I picked a color (R :104, G : 87, B :139) from my paintings.
I tried to make an abstract painting by using P5js.

horizontalmountains2   sea

<Horizontal mountains> 35.5×35.5cm, Acrylic on canvas, 2015
<Scenary>91x117cm, Acrylic on canvas, 2015

 


more paintings                                                         /                                                                      CODE


2. The synthesis workshop – 
with Jixuan Sun

Jixuan and I were using the pingpong ball code from the last class. we tried to change ball size by using potentiometer.

 

 

 

Week – 4

Reorganize – <Ball>

I changed the code that I previously made. I tried to make it shorter but it seems to get longer. I broke the code out of setup() and draw() into functions. When I tried to use simpler code, it became more and more complex. I couldn’t manage to create a complex design multiple times with different arguments, so I had trouble moving on to the 3rd and 4th items on the to do list. At this point, I am wondering how do you know a set of code is completely finished?

Previous CODE

%e1%84%89%e1%85%b3%e1%84%8f%e1%85%b3%e1%84%85%e1%85%b5%e1%86%ab%e1%84%89%e1%85%a3%e1%86%ba-2016-10-05-%e1%84%8b%e1%85%a9%e1%84%92%e1%85%ae-5-55-21

Revised CODE

%e1%84%89%e1%85%b3%e1%84%8f%e1%85%b3%e1%84%85%e1%85%b5%e1%86%ab%e1%84%89%e1%85%a3%e1%86%ba-2016-10-05-%e1%84%8b%e1%85%a9%e1%84%92%e1%85%ae-5-43-14

 

 

 

 

 

 

Reorganize – <week 2>

Previous CODE

%e1%84%89%e1%85%b3%e1%84%8f%e1%85%b3%e1%84%85%e1%85%b5%e1%86%ab%e1%84%89%e1%85%a3%e1%86%ba-2016-10-05-%e1%84%8b%e1%85%a9%e1%84%92%e1%85%ae-6-16-33

Revised CODE 

%e1%84%89%e1%85%b3%e1%84%8f%e1%85%b3%e1%84%85%e1%85%b5%e1%86%ab%e1%84%89%e1%85%a3%e1%86%ba-2016-10-05-%e1%84%8b%e1%85%a9%e1%84%92%e1%85%ae-6-20-26

Reorganize – <Purple>

Previous CODE

%e1%84%89%e1%85%b3%e1%84%8f%e1%85%b3%e1%84%85%e1%85%b5%e1%86%ab%e1%84%89%e1%85%a3%e1%86%ba-2016-10-05-%e1%84%8b%e1%85%a9%e1%84%92%e1%85%ae-10-27-21

Revised CODE

%e1%84%89%e1%85%b3%e1%84%8f%e1%85%b3%e1%84%85%e1%85%b5%e1%86%ab%e1%84%89%e1%85%a3%e1%86%ba-2016-10-05-%e1%84%8b%e1%85%a9%e1%84%92%e1%85%ae-10-25-06The squares are situated diagonally across from each other and interact with the movement of the cursor.

 

 

 

 

 

 

Week 3

CODE HERE

 

CODE HERE

CODE HERE

CODE HERE

 

 

 

 

 

Week 2

I created code that causes a green spot to follow the movements of the mouse cursor. When you click and drag, the spot draws in purple on the canvas.

When you click once, the mouse creates a random rectangular shape onto the canvas. When you click and drag the cursor, a purple ellipse is created on the canvas. As the time goes by, it changes slowly with burgundy dots.

CODE

 

 

 

 

 

 

Week 1

This depicts ITP students in their first week eating together. To the side, we see someone who would like to join in and eat, but they aren’t currently friends. I observed the people I saw on the 4th floor and found that they were intently focusing on their computers, like their eyes were penetrating the screen. Likewise, their eyes would light up when they found some food. So I focused on this scene as an inspiration. There’s someone’s empty plate on the table, and a nearby onlooker crying, hoping to eat.

In order to create this, I designed this graphic with basic figures: rectangles, squares, ellipses. These colors are randomly selected. Although this picture is fairly elementary, in the future I could adapt this program into a very useful tool.

 

%e1%84%89%e1%85%b3%e1%84%8f%e1%85%b3%e1%84%85%e1%85%b5%e1%86%ab%e1%84%89%e1%85%a3%e1%86%ba-2016-09-14-%e1%84%8b%e1%85%a9%e1%84%92%e1%85%ae-7-42-32

 

This depicts ITP students in their first week eating together. To the side, we see someone who would like to join in and eat, but they aren’t currently friends. I observed the people I saw on the 4th floor and found that they were intently focusing on their computers, like their eyes were penetrating the screen. Likewise, their eyes would light up when they found some food. So I focused on this scene as an inspiration. There’s someone’s empty plate on the table, and a nearby onlooker crying, hoping to eat.

In order to create this, I designed this graphic with basic figures: rectangles, squares, ellipses. These colors are randomly selected. Although this picture is fairly elementary, in the future I could adapt this program into a very useful tool.

Code

https://github.com/jaj347/jin/blob/master/ICM

Leave a Reply

Your email address will not be published. Required fields are marked *