Unusual Switch

For the project, I was walking around my room and looking for creative ways to create a switch. Finally, I found two American pennies which are made from zinc and are coated with copper, both of which are good conductive materials. Then, I realized I could make a switch that works when the coins touch. Wires are taped to the coins so that when the coins touch, the circuit closes and lights up the yellow LED. I connected the green and blue wires together to extend the reach of the coins. The idea is similar to Carrom – the coin that has an extended reach has to be flung into the other coin which will be relatively stationary. The setup can be seen below.

Next, I write some code for the Arduino, so that when they touch, the LED stays lit for 3 seconds so that the contact is captured and a hit or miss can be seen clearly.

void setup() {
  // put your setup code here, to run once:
  pinMode(9, OUTPUT);
  pinMode(A5, INPUT);
}

void loop() {
  // put your main code here, to run repeatedly:
  int switchState = digitalRead(A5);

  if (switchState == HIGH){
    digitalWrite(9, HIGH);
    delay(3000);
  }
  else{
    digitalWrite(9, LOW);
  }
}

Reading Reflection – Week#8

Both of the readings for this week have similarities and differences with each other, but one common thread among these readings that I tried to follow and extract was the role of human subjectivity in design. The first reading introduces psychological concepts in the form of affect and analyzes how they interact with design. The second reading shows the importance of it more subtly, by showing how a hazardous error was found by a kid playing around with the keyboard, and the same error was committed by an astronaut that was believed to be exceptionally professional. Unfortunately, nobody is perfect, and every human holds a different set of characteristics and, therefore, has a different perspective on the world and the tools they use. Hence, the one idea I would connect these readings with is the idea of personalization in design. Just like the three teapots in Norman’s text, different design has different form and functionality and can suit different people to accomplish a task. Even the same person in different moods or environments could desire a different design. If this idea is paired with the “beauty is subjective” discussion, we can see how personalization of design is important from Norman’s ideas about attractive things working better. As much as we like to think of ourselves as rational and intelligent creatures, humans are emotional at core and this should be reflected in good design, incorporating emotional choices along with functional choices.

Midterm Project Beatly

My midterm project is centered around an idea of a digital drum kit. As a drummer, I sometimes want to test new beats and patterns when I am not around a physical kit, and in such times I like to use the “musicca” website(https://www.musicca.com/drums), and this is the website that I got the inspiration for my project from. Each sound on the drum kit is tied to a specific key and the digital drum kit is played just like a physical one would, by combining sequences of keys corresponding to the notes. I have found all the essential sounds for each key from the website “freesound” (https://freesound.org/), including the cheering sound.
Next, I made the project more visual so that besides the audio feedback, users can also get a visual feedback corresponding to the sound that has been played. For that I have implemented circle waves of different color, each corresponding to a certain drum/cymbal, that arise from the center of the drum/cymbal that has been played and propagate across the screen. To mark a milestone in the user’s drumming session, after a certain number of notes played, a crowd cheers for you and colorful confetti pop up. This was the hardest part of the project as besides using the relevant classes and finding information on how to implement it, I had to make sure the timing and duration of the confetti was precise and simultaneous with the cheer sound. The implementation of that tricky part is the following.

if (counter%60 == 0 && counter !=0) { //60 bets till cheer
isDisplaying = 1; //bool for confetti
start = millis(); //timer start
interval = 0; //should be 5 seconds
isCheering = 1; //cheer sound bool
if (isCheering == 1 && cheer.isPlaying()==false){
cheer.play();
isCheering = 0; //so it does not loop again
print("isCheering is:" + isCheering);
}
}
if (isDisplaying == 1){
for (let i = 0; i < confetti.length; i++) {
if (interval < 5000){ confetti[i].confettiDisplay(); finish = millis(); interval = finish - start; } else{ isDisplaying = 0; }

if (confetti[i].y > height) {
confetti[i] = new Confetti(random(0, width), random(-height, 0), random(-1, 1)); //generate confetti instead of the ones that have disappeared
print("in the if");
}
}

The starting page contains instructions to which key produces which sound, but it is always fun to experiment if you do not know the names of the drums and cymbals! For the main page, I have cut the background off of the drum image and placed it on a stage surrounded by people – a choice to justify the cheering and confetti. Here is the photo of the background stage I used.

To play the drums, the user clicks on the “Start” button and after the user is done he can click “Restart”, so that the new user can play the drums. Restarting simply erases the counter for how many notes have been played and places the user back on the intro screen. I chose not to include any background music as the rhythm of the background music would interfere with and limit what the user wants to play. To enter or exit fullscreen, the user needs to press the “F” key.
In the future, I would like to implement more artistic waves that propogate from the circles or have a music choice that the user can play into. For improvements, the fullscreen mode needs to be improved to fit the actual full size of the screen.

Midterm Project Progress

My midterm project will center around an idea of a digital drum kit. As a drummer, I sometimes want to test new beats and patterns when I am not around a physical kit, and in such times I like to use the “musicca” website(https://www.musicca.com/drums), and this is the website that I got the inspiration for my project from. Each sound on the drum kit is tied to a specific key and the digital drum kit is played just like a physical one would, by combining sequences of keys corresponding to the notes. Accurate and user-friendly implementation of the sounds and keys will be a major part of the project. I will use the image below for a drum kit and I will label each drum/cymbal with the corresponding key so that new users can easily navigate and learn in a matter of seconds. I have taken this image from “musicca”, only editing out the drums sticks that are present on the website as I think my implementation does not require drum sticks, because of a different visual feedback that is discussed below.
Additionally, I have found all the essential sounds for each key from the website “freesound” (https://freesound.org/).
Next, I wish to make the project more visual so that besides the audio feedback, users can also get a visual feedback corresponding to the sound that has been played. For that I will implement circle waves that arise from the center of the drum/cymbal that has been played and will propagate across the screen. This is going to be the most challenging part of the project, and I am thinking about implementing collision effect for those waves, but I will decide on it later depending on the visual effects created. I am still searching for ideas to implement besides the circle waves that will make appealing visuals, but so far I sympathize with this implementation the most.
There are 2 classes for the project so far. A class for drums, each object being a different drum or cymbal, and a class for the waves, each object being the wave tied to a certain drum/cymbal.
There will be a button at the bottom of the drum kit image, suggesting the users to start a new session if the previous user is done, and the functionality of button is simply to remove the existing waves from the screen, everything else does leave a residual effect from the previous to the new user.

Reading Reflection – Week#5

This weeks reading was about Computer Vision, its types and implementation. One thing that stuck out for me was the accessibility of simple computer vision techniques and the emphasis the author put on how even undergraduate or high school students can use some of the techniques described in the text. The author even provided source code for four of the techniques mentioned in the paper, which is another indicator of accessibility of the subject. Presenting the subject of computer vision to a widespread audience with different interests and proficiency in the field can result in a broader reach of computer vision into different disciplines and we can see applications of a vast variety and creativity.
However, it is not be mistaken as an easy subject, as it has been regarded in the past, but rather rather a subject with low barrier of entry and high ceiling, as the opportunities and possibilities with computer vision keep increasing indefinitely, especially with novel applications using AI and ChatGPT, self-driving cars, AI image generators, etc. This seems like the tip of the iceberg as we enter into an era of advanced AI and VR, hence this reading can be an excellent starting point for anybody who wants to interact with the roots of the tree that might shape the future.

Conversation

For this week’s assignment, I chose to create generative text project. To find inspiration for it, I browsed through some data on Kaggle, eventually landing on a dataset of Tweets, where each tweet corresponds to a certain emotion(https://www.kaggle.com/datasets/nelgiriyewithana/emotions). Hence, I tried to use the data to create a somewhat meaningful conversation between two people.

First I uploaded an image of two characters speaking and thought about putting text over their heads like comic book characters, to indicate speech. The speech , in this case, is simply one instance of the Tweets in the dataset, but every Tweet is written from first perspective, giving an illusion of fluency in the conversation. The main idea behind creating a conversation was to randomly choose what the first person has to say, then identify the emotion the speech is tied to, and finally, get another random Tweet from the database that has the same emotion. The only addition to the text would be the connectives words I added manually, but they are also randomly taken from the given array that I wrote.
let openers = ["True, " , "Right!, " , "Agreed, " , "Same, ", "Fax, " , "Relatable, " , "Yeah, " , "I see, "]; //additions to the second speech

I made it easier for me to correlate text with emotions by creating arrays of text for each emotion, so that the random function only has to choose between texts of the same emotion. Example of a conversation below. With each run of the program, different texts and emotions will be generated.

Example

In the future I would like to try to make the conversation make more sense by adding additional variable and edits into the texts, but I feel like sometimes the generated outcome with this code is funny enough to be worth it.

Reading Reflection – Week#4

In the chapter “The psychopathology of everyday things”, Don Norman brings up a multitude of examples of bad design that hinders human experience with the object of said design. He proposes the idea of human-centered design as the ultimate goal of a good design. I do not think that the bad design in some cases is a problem that desperately needs to be fixed. For instance, confusing buttons of a dryer-washing machine is an example the author gives for bad design choices. I agree that the design is not human-centered and can be improved, but I find the emphasis on it being a problem unnecessary. The sales of such machines are profitable and people still buy the complicated technology despite the bad design, otherwise the production of such machines would be terminated. This could indicate that human-centered design is not the primary concern of the businesses selling the complicated technology. This also might suggest that creating a machine with more of a human-centered design is not beneficial to the company. Moreover, consumer can use fridges and washing machines for decades and I think the designers bet on the longevity of the product – it can be confusing at first, but not after 10 years of using the device and it is my understanding that the consumers are attracted to the bursting variety of features rather than the ease of use.
That being said, the author mentions that the good design choices come at an expense and have their fair share of constraints, but it is only discussed in chapter 6, therefore to make a conclusive judgement of the topic I would need to read about what author has to say in chapter 6. I hope the author can prove me wrong by offering worthy alternatives that would benefit the consumer and be feasible for the producers. Disclaimer: my points mentioned in the previous paragraph would apply to consumable goods, but not necessarily other products with bad design.

Assignment#3 – Nested Orbital Motion

For this project we had to use arrays and classes to generate an artwork. My initial idea was inspired by planetary motion, I thought about creating the solar system with the planets rotating around the sun. Then, I thought about the moon and how it revolves around the earth, resulting in an orbit determined by two circular motions – the moon’s orbit around the earth and the earth’s orbit around the sun. This idea of nested circular motion intrigued me to the extent that I decided to solely focus on creating an artwork with dots revolving around dots in a circular pattern – with each following dot rotating around the previous one, in a long chain of dots.

I created the basic circular motion of a dot based on this video (https://www.youtube.com/watch?v=ib_o5g7V8pc), but it was only sufficient in case of a fixed center point for an orbit. Hence, I created the appropriate classes and function to achieve the desired nested circular motion effect, which I would say was the hardest part of the assignment. Next, I connected the dots together using lines in attempt to make the chaotic movements of the dots easier to follow. The dots and the lines have different colors, which, after combining with a fading effect, resulted in unique patterns. The following snippet is the main part of the draw function used to display and move the dots and lines accordingly.
dotarr[i].show();
dotarr[i].move();
dotarr[i].drawline();
dotarr[i].setxcent(dotarr[i-1].getxcoord());
dotarr[i].setycent(dotarr[i-1].getycoord());

Changing the number of dots instantiated and the speed of their revolution results in different patterns: if the “speedCoef” variable is a positive number, the change of the speed with each subsequent dot decreases, which creates an effect of the dots rising outward and gives the pattern an impression of a something like a worm coming to life. If the “speedCoef” is a negative number, the pattern gains more of an “inward” quality, like collapsing into itself, but inevitably untangling itself and looping back to where it started. Additionally, giving the connecting lines more thickness than the dots results in a smooth, wave-like pattern (see the image below). For the future, I would like to analyze the movements of the dots from a more mathematical perspective to figure out when exactly the pattern will return to where it started, or will it return at all. I would also like to play around with the different variables and observe the emerging patterns, possibly for an inspiration to extend the initial scope of the project.

Changing the line thickness results in a smoother pattern.

 

 

 

 

The following part shows how the speed and radius, as well as the specific positioning of the dots are used to create the needed dots.

dotarr[i] = new Dot(dotarr[i-1].x, dotarr[i-1].y, (50+(speedCoef*i)), dotarr[i-1].radius);

Reading Reflection – Week#3

Chris Crawford challenges our initial understanding of interactivity with a discussion of various definitions of what interactivity is and what it is not. What I found notable in trying to define interactivity is that it is the listening, thinking and speaking between two actors, and not a reaction to an action of one of the actors. Crawford also establishes that interactivity is not two-sided, but rather it is a continuum, where we can establish high and low interactivity and bring an example of the fridge lights to distinguish between these levels.

Here, I disagree with the author’s choice to place the fridge at low interactivity. The fridge light has a very limited number of responses to out actions, meaning either turning on or off, which I would not call interactive. It rather reacts to our actions, just in more than one way. No matter how carefully the fridge “listens”, our how intense it “thinks”, its response is not going to vary unless it is broken in some way, which in turn will remove a component of interactivity and fail to fit in the definition provided in the reading.

However, I would like to further explore if interaction is any different from alternating reactions from two parties engaging in listening, thinking, and speaking. Ultimately, exploring the best forms of interactivity is essential for the user experience, therefore I believe these definitions are crucial for solving interactivity issues without faking it.

Reading Reflection – Week#2

The talk Casey Reas gave on the role of chance in art sparked my curiosity around the human perception of randomness. Throughout various exhibits, Reas showed how order can emerge from chaos and the value of ordered randomness. I think that one of the major factors that contribute to the appeal of these artworks to us is our brain’s urge to find patterns everywhere. The ordered-chaos artworks defy our brains ability to interpret the image so easily, but also invite the brain to try and seek as much information and patterns as possible. Therefore, the key to creating chaotic but attractive artworks is to embed a clever interplay between order and randomness and let our brains wander in the presumed chaos and work our way to understanding the artwork, while not confusing us or, in contrast, letting our minds get lazy by providing works that are easy to decode.

When I think about ordered chaos I always remember fireflies. When fireflies are in a group together on a tree, initially they blink in a chaotic order. However, due to an algorithm determined by mathematics, they synchronize into a massive, uniform ball of light, blinking together in constant intervals. There is more order in chaos than we think, and there is more chaos in order than we could imagine, but the most important takeaway for me was that the balance between the two can be infinitely beautiful.