Homework 13

OF mini-final

Proposal:
In mini-final, I used a piece of music from Journey to the West to make a music visualization project. As for the graphic elements, I get inspiration from Japanese comic book. Japanese artists draw lines to highlight the emotion of a character. Another inspiration is the rough after effects from the TV drama. Openframework is a good tool to mimic things in a digital way.

Addons I use:
GUI

Feedback:
change the color of GUI to match the background; more bright color scheme; less variable as the music is changing the shape.

Link to Code on Github:
https://github.com/wangy969/CCLab/blob/master/CircleClass.cpp

Homework 12

OF mini-final proposal

Concept:
In mini-final, I am going to create a music visualization project based on a piece of pioneering Chinese electronic music. The music is from a famous TV drama Journey to the West. Although this is a low budget television drama, the special effects is rough but interesting. So I am going to use GUI to reproduce the special effects with geometric shapes.

Precedents:
Journey to the West is a Chinese novel published in the 16th century during the Ming dynasty and attributed to Wu Cheng'en. It is one of the Four Great Classical Novels of Chinese literature. In English-speaking countries, Monkey, Arthur Waley's popular abridged translation, is most commonly read.

Homework 11

Firefly with GUI

Explanation:
In this homework, I used particle system with GUI in OpenFrameworks to create a cluster of fireflies. I can use GUI to change the color and size of fireflies. And all the fireflies follow the light. By getting mouse position, I am able to make the position of light following my mouse. 

Link to Code on Github:
https://github.com/wangy969/CCLab/blob/master/CircleClass.cpp

Homework 10

Firefly

Explanation:
In this homework, I used particle system in OpenFrameworks to create a cluster of fireflies. To mimic the movement of fireflies, I tried to let each firefly fly randomly and use alpha and setcolor to create the effect of glowing. In next step, I will try to figure out how to blur each firefly and make them look fancy. 

Link to Code on Github:
https://github.com/wangy969/CCLab/blob/master/ofApp.cpp

Homework 9

openFrameworks

Explanation:
In this homework, I used the code from the live coding of bouncing ball in ccLab class. Besides, I added the background music and changed the ball with pictures of animals. The sounds of cat and dog are triggered by keypress. Press 'z' to play the sound of cat, press 'x' for dog. As for the background color, it is related to mousemove. Once I move my mouse, the number of "RGB" will change.

Link to Code on Github:
https://github.com/wangy969/CCLab/blob/master/ofApp.cpp

Homework 8

API&Library

Explanation:
For the mini final of API&library, I got the API key from Google map API. There are information about location including latitude, longitude, postal code and etc in this API. Once you type the name of the location you want to know and click the button, the information about this particular location will show up. Besides, I also add animation to this website. By using animate css, I am able to make the website more interesting.

Resource:
https://www.youtube.com/watch?v=Zxf1mnP5zcw/

Link to Code on Github:
https://github.com/wangy969/CCLab

Homework 7

JQuery

Explanation:
In homework 7, I used JQuery and another library called scrollorama to make a parallax effect website. In this website, there are many layers, such as trees, grass, rock, elf and moon. Each layer move in a different speed. Things far away from us move slower than things in front of us.

Resource:
http://johnpolacek.github.io/scrollorama/

Link to Code on Github:
https://github.com/wangy969/CCLab

Homework 5&6

JQuery

Explanation:
In homework 5, I used Star war API to load some information in character intro page. I tried to load the whole character list, but it always return a error. I think one of the reason is that we need to find the right API. Sometimes, it is confusing that what kind of information we can get from an API.

Link to Code on Github:
https://github.com/wangy969/CCLab/blob/master/homework5

Homework 4

Decompression game_Sweet Machine

Explanation:
In homework 4, I used a Keypad4*4 to make a decompression game by Arduino and Processing. Studies have shown that having dessert is able to help people reduces their stress. However, too much dessert may cause various diseases. So this game is going to entertain people without having real dessert.

Material:
Arduino Uno | Keypad 4*4 | USB wire | 

Resource:
https://www.allaboutcircuits.com/projects/use-a-keypad-with-your-arduino/

Link to Code on Github:
https://github.com/wangy969/CCLab/blob/master/homework4

Fritzing Circuit Diagram:

Homework 3

use potentiometer to do simple data visualization

Explanation:
In homework 3, I used a potentiometer to do simple data visualization by Processing and Arduino. Users are able to control shape and color of the pattern in Porcessing when they rotate the potentiometer. And the LED can be controled when user click in Processing.

Material:
Arduino Uno | Potentiometer | LED | Resistors (220) | 

Resource:
https://diyhacking.com/arduino-processing-ide-communication-tutorial/

Link to Code on Github:
https://github.com/wangy969/CCLab/blob/master/homework3

 

Fritzing Circuit Diagram:

Homework 2

use thermistor to control a electric fan

Explanation:
In homework 2, I used a thermistor to control a electric fan. When temperature rises, the fan starts to work. When temperature decreases, the fan stops working.

Material:
Arduino Uno | Thermistor | Button | Resistors(10k Ω,330 Ω) | NPN | battery | DC motor | Fan

Resource:
http://www.sohu.com/a/111528460_464000

Link to Code on Github:
https://github.com/wangy969/CCLab/blob/master/homework2

Fritzing Circuit Diagram:

Homework 1

use button to turn on/turn off the LED

Explanation:
In homework 1, I used a button to control the state of LED.

Material:
Arduino Uno | Blue LED | Button | Resistors

Link to Code on Github
https://github.com/wangy969/CCLab/blob/master/homework1

Fritzing Circuit Diagram:

© 2019 by Yixun Wang