Leap Motion and Touch Designer
I used Leap Motion to get the data of my hand (x/y/x parameters) to control the rotation and the size of the model.
Video link: https://drive.google.com/drive/folders/1wk9JfA8lo1ICsoC15DdlgkWdrMKPcXlY?usp=share_link
Category Archives: Uncategorized
Sketch 5: Mufaro
For this sketch, I attempted to use p5.Party to create a p5.js sketch that many users can interact with at the same time, from different browsers. My attempt wasn’t very successful but I will continue to work to figure it out.
Here is the code:
https://editor.p5js.org/mufaromukoki/sketches/74c8zJoHM
Sketch 5 – Zaheen Sandhu
The main goal for this sketch was to understand how to make p5.js and Arduino talk to each other and communicate; by taking the input value from the sensor and reflecting it on the p5.js sketch. Through serial communication, I am using the potentiometer to change the size of the circle.
References: https://makeabilitylab.github.io/physcomp/communication/p5js-serial.html
https://medium.com/@yyyyyyyuan/tutorial-serial-communication-with-arduino-and-p5-js-cd39b3ac10ce
Sketch03 – PoseNet and Audio Level
I combine both of audio and poseNet in the sketch3.
The poseNet tracks the position of the participant’s face (ear,nose,mouth,eyes), and detects the audio level of the participant, if the participant is talking then the mouth will open.
Link to the video: https://youtu.be/JvPE5-jWPME
Link to the code: https://editor.p5js.org/zhuwentianzz/sketches/qbX96y5yI
Sketch02- Firefly
Many things are going on in the scene. When the top firefly stops flying, then the instruction text would show up and tell the participant what to do next. And after the participant moves his fingertip inside the range of the top firefly’s tail part, then it’s mate would appear and fly to its location.
Link to the video: https://youtu.be/IEqRVuOWZhw
Link to the code: https://editor.p5js.org/zhuwentianzz/sketches/d9KfobS3d
Sketch 3 – Cat-rnaval – Ricardo “Ricky” QS
Edit Link: https://editor.p5js.org/ricardokiza654/sketches/3ehu_nZC0
Screen: https://editor.p5js.org/ricardokiza654/full/3ehu_nZC0
For this sketch I wanted to create ”popping appearing” textures with .pngs all around the screen, with different values and ways of appearing. This sketch also explores extracting and drawing info from a .png, that can be used to be re-drawed pixel by pixel and then re modified, such as altering its color.
Reference: https://www.youtube.com/watch?v=3gXpk2mvTWk
Let’s Grow
For this sketch I experimented with creating multiples of one object and have them grow with the mouse function.
https://editor.p5js.org/TaylorPatterson/sketches/VljjtPNqd
Sketch 1: Magic Bubbles
I applied ml5.js poseNet to the project. The bubbles follow both of my wrists, and once their alpha value turns to zero, the bubbles would fade out and delete from the array.
gif link :https://drive.google.com/file/d/1kSmlTg1VZmBuNK3oM4STXjRmJZVbJHbI/view?usp=sharing
File folder (google drive link): https://drive.google.com/drive/folders/1PBOfNjaZnzzpvM1FSJvJej0QJKIh6EdQ?usp=sharing
I was inspired by the coding train tutorials and the Twitter video that Xuan posted on the Pages site (link
Sketch 1 – Nicky Guo
The concept of this sketch is to showcase the different facial expressions of each individual. Initially, I created this sketch to explore the process of showing different emotions on the screen based on users’ interactions, which is something I have to understand in the group project.
Video:
Code:
https://editor.p5js.org/Nickygg/sketches/i-QnAq6Ce
20 Screens – Group 1
The idea behind this was to understand the color with emotions. The emoji colors change into various different other colors and people with the same one win.
Team:
Wentian Zhu / Nicky Guo/ Divyanka Sadaphule/ Firass Khan
Link to Code: https://editor.p5js.org/zhuwentianzz/sketches/qHrKc-vVV
Video Link: https://youtu.be/HNujv2ElpqM