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.

Assignment 2: Kaleidoscope

The assignment prompted us to create a work of art using loops and other concepts we have learned so far. Looking at the examples provided for the project, I saw many instances of graphical artworks that were created by arranging small objects and shapes into a bigger artwork iteratively, so I focused on creating some custom shape and iterating it smoothly on the whole canvas. I tried to come up with a similar concept from real life and what struck me as a typical example of small shapes iterating to create an artwork was a kaleidoscope. Hence, the idea for this project was to create a custom, colorful shape and reflect it 360 degrees around the canvas, just like the kaleidoscope does. That reflection part is shown in the following code snippet.


for (let i = 0; i < 10; i++) {
rotate(angle);
strokeWeight(8);
stroke(mouseX, colval, colval/1.5, 0.5);
line(mouseX, mouseY, pmouseX, pmouseY); //trace the mouse
push();
scale(1, -1);  //reflect vertically
line(mouseX, mouseY, pmouseX, pmouseY);
pop();
push();
scale(-1, 1); //reflect horizontally
line(mouseX, mouseY, pmouseX, pmouseY);
pop();
}

The shape is drawn by hand in the upper-left corner of the canvas and gets reflected and rotated all throughout the space. The shape is drawn by hand to resemble the chaotic but appealing visuals of the kaleidoscope.
What I would like to work on in the future is more uniform construction of reflections using the appropriate angles instead of arbitrary ones. In addition to that, I would want to enable the user to draw on all of the surface of the canvas, but this might saturate the picture too much, so I yet have to find a solution for it.

Assignment 1- Self-Portrait (Recursive Card)

For this assignment, we had to create a self-portrait. As I did not hope to realistically picture myself using p5, I I went for a different approach to make the portrait relate to myself more. As I practice card magic, I decided to picture myself in a playing card, similarly how Jacks, Queens or Kings are illustrated. This meant the card has to have certain rectangular proportions, have a dividing line in the middle and have a mirror image of itself on the bottom and top halves of the card, reflecting by the axis of the dividing line. Similar to cards, the mirroring had to be done by the middle vertical axis, too. I simply had to create the individual elements of the body, such as the head, arms, eyes, mouth, then invert the x and y coordinates to mirror the elements on the opposite side of the card.

However, midway through the assignment I remembered that court cards normally hold some object in their hands, usually a royal artifact of some sort. As a magician, the most obvious thing I could hold in my self-portrait is a card itself! There began a long journey of trying to create a recursive image of me holding a card that depicts me holding a card… and so on. I had to take into account the right proportions, meaning instead of using numbers as coordinates and sizes for shapes, I had to use ratios of those numbers to the width and height of the card. I tried to make the recursion as flexible as possible, meaning that it will work on any canvas, with any number of recursions inside of the card. Currently, it works on any square canvas, where height and width are identical. I believe this can easily be fixed in future improvements, by setting the highest side of the canvas by cropping the canvas to use equal sides.

I truly enjoyed the project, partly because of the creative freedom it gives, but there are some important reflections and improvements left.
Firstly, I spent most of my time figuring out the recursion code. Even, then I only managed to create a partial recursion, where only the upper right and lower left extremes are being recursed. Moreover, the recursion effect is reached through a loop, so it is not truly a recursion yet, but I am working on perfecting it.Though, at this point, changing the loop max constraint gives a deeper recursion effect by creating more cards inside of cards.