Author: Adeliya Aitpayeva

Concept

After playing with different songs from the GitHub folder, we have decided to include several of them at the same time into our interpretation of a musical instrument. One way to do so would be to switch between three songs back and forth, creating a version of a radio with changing stations. Three classical compositions were chosen: Ode to Joy, Fur Elise, and Badinerie. However, this idea could be realised simply with two digital switches, so we decided to push it further by adding photoresistors that would allow us to work with a spectrum of values.

In what ways can a melody be altered while playing? Its volume or playback speed can be changed – as such, we decided to take values from one photoresistor to set up how loud the song was playing, and the other to set up the speed. A combination of all these electrical components helped us to create an advanced version of a radio, resembling a music player that allows to modify certain qualities of the sound.

Highlight of the code

:^)

Demonstration

IMG_9132

Reflection

Although we did not expect this idea to be so complex, we have faced serious difficulties in implementing the functions of switches – the audio kept repeating itself without any response to the change of digital or analog values. After troubleshooting the whole code using Serial.print(), we decided to ask the professor for help in order to finally tackle the issue.

A Brief Rant on the Future of Interaction Design by Bret Victor

I usually feel very skeptical about videos, such as one that was presented by Microsoft on Productivity Future Vision. But, here are couple of points that I made on it:

• I really liked how gamification in education was presented in the video, as it feels less daunting to study for children and they feel more integrated in real life.
• It’s interesting that in all this digitalization, people still have to carry their suitcases physically, they have to wait in lines waiting for train and do other not so productive stuff. So, the video shows a reform in terms of digital devices solely. It’s a shallow vision of the future and our interaction.
• In the video, I saw future life, which lost its colors, because the main color that you can see are blue, green, white and black. There is no vividness.
• I didn’t recognize that so many devices convert what we can do to what we want to do.
• Also, you don’t really think about hands being central point of interaction. Hands our main sensors.
• Feedback from the objects that we are using usually is not verbal, but we can unconsciously feel things, especially if we remember or extensively use things. For example, I’m using a keyboard with arabic characters for writing in english, kazakh and russian languages, because my hands basically remember the location of each letter, which I’m not really aware of.
• The Pictures Under Glass concept can be applied to kids games applications, where they play being a hairdresser and cutting someone’s hair.
• After author of the article said it, I understood that the thing that seemed very strange to me about interactions shown in the video – they felt numb and senseless.
• I found pictures with hands and objects they carry kind of powerful.
• It occurred to me that dance as an activity can bring so much understanding about our daily interactions with our body, since we become more conscious about them.
• I strongly resonated with Bret’s saying that most artistic and engineering projects can’t just be described.
• I didn’t agree with one of the author’s points that if physical interactions should always be very informative and communicative, since I feel like in today’s interactions there is a lot of imagination employed by the users, hence physical may not be the only priority.
• I liked that the author addressed comments in separate article, where he also discussed concept of finger blindness, which is really fascinating.

Concept

When thinking about concept of my project, I decided to use a light sensor for controlling LEDs in an analogue fashion. I thought initially about making it as an interactive artwork, where the brightness of many LEDs will be controlled by the lighting of the room and the way the users manage light sensors themselves. However that idea didn’t work, because I made a mistake of connecting wires to wrong digital inputs (without PWM~), which led to unsuccessful fading of the LEDs. I realized my mistake too late, and already had switched my idea to something more fun and engaging. As lights were just switching on and off when I covered the light sensor with my finger, it reminded me of DJ Set where you press specific buttons and different sounds occur. I decided to do the same, but replacing sounds with LEDs. I had three LEDs that would be lighted using light sensors. And I also included an LED that was switched on using slide switch, to add digital inputs to the circuit, since light sensors were connected to analog inputs.

Arduino Setup

 

As you can see, I just followed the rhythm of the song with my DJ Set.

Highlight of the code

GitHub Link

int sensorValue = analogRead (A0);
Serial.println (sensorValue);
sensorValue = constrain (sensorValue, 10,200);
brightness = map (sensorValue, 15, 140, 0, 255);
analogWrite (ledPin2, brightness);
delay (10);

int sensorValue2 = analogRead (A1);
sensorValue2 = constrain (sensorValue2, 10,200);
brightness1 = map (sensorValue2, 15, 140, 0, 255);
analogWrite (ledPin3, brightness1);
delay (10);

int sensorValue3 = analogRead (A2);
sensorValue3 = constrain (sensorValue3, 10,200);
brightness2 = map (sensorValue3, 15, 140, 0, 255);
analogWrite (ledPin4, brightness2);
delay (10);

I think the hardest part of the coding was just with assigning correct numbers and pins to each function. I decided to use “constrain” and “map” functions that we learned on our lesson, because when building my project in IM Lab I found the light sensor values on Serial Monitor vary only from 15 to 140, hence I mapped them to 255 range, so that brightness could be manipulated. As it can be seen from the Arduino setup and the video, there are a lot of wires on the breadboard, which was another challenge of connecting them just right and not fail the code.

Reflection

In my next improvements of the project, I wish to experiment with different types of sensors, such as temperature, ultrasonic and sound sensors. It would give my project higher difficulty and also interest. Also, I am very eager to learn and employ Piezo Speaker in my next projects, as a further development of the DJ set. Moreover, it would make sense if I would use bigger breadboard and make connections more clear, reducing unnecessary  wires. I would also want to connect RGB LED, as it gives higher flexibility and room for experimentation.

 

 

Making Interactive Art: Set the Stage, Then Shut Up and Listen

I found this blog post insightful. At first, it made me feel very confused and upset, because the approach I was taking with the assignments that we’ve completed before is like with artworks, where I set the meaning and actions and people follow it. But, it actually makes such more sense when we say that it is not one sided interaction, we listen to how users speak with their actions and do they find their way by themselves. It was so surprising to me that the author related planning interactive artwork to the director working with actors, because this semester I’m taking a DIRECTING class too! After the paragraph about directing, the idea of the author became really clear to me and I actually got it. I resonated with his words of leaving half part of your work to the audience to figure out what they are feeling about it and what meaning they would find in it, because that’s what makes it an artwork. My professor in the Directing class used to tell us: “Love your audience”. Now, it could really apply to my interactive works, where the users would come first and the intentions and messages that I planned would go second. 

Physical Computing’s Greatest Hits (and misses)

In one of the first ideas of the author about not necessarily seeking originality, I agree with him, because I think that replication is key for learning and mastering skills. In art schools they teach artists to replicate the biggest art masterpieces, so afterwards there would be a room for original artworks creation.  

It’s my first encounter with the theremin instrument. And I like how Tom Igoe put the idea of interaction with instruments that when you are using them you essentially think about music and the process of using it. That leads us to the point that interaction should be simple, understandable and meaningful. 

When discussing dolls and pets, I remembered the viral dancing cactus toy, which replicates the sound and adds movements. The author mentions that “we like things that appear behave like us”, but the case with the cactus toy is definitely an exception, because in TikTok there is a growing trend of videos where these toys make babies cry after they hear a toy replicating their sound and movement. 

Moreover, even though dance is one of the most enjoyable physical expression forms, I don’t think the usage of it in physical computing expanded beyond the Step Maniax arcade, where you just have to step on right rectangles (or maybe I just didn’t see any other examples). 

When discussing the whole body as a cursor idea, I thought about using it for manipulating the computer screen. Also, in this case the concept of inclusivity really steps in, because different people have different abilities.  

The idea of flying seems very exciting in terms of interactions. 

Concept

I decided to create a switch that would be initiated by two cups touch. I was inspired by the “Emotions & Design: Attractive things work better” reading, as it focused on the affect and the emotional connection to the product. Then I thought of the importance of tea drinking in the Kazakh culture and how there is a clinking glasses ritual that makes you celebrate the moment. I believe that this ‘Cheering’ process is the one that bonds people and creates special atmosphere in the room. So, I wanted to highlight how special this moment is by lightning up the LED when cups touch.

I just attached the foil on two cups and connected it to the wires to the foil and arduino board. I used two LEDs of different colors to portray two different people and their lightning connection.

Coding

Arduino File on Github

void setup() {
  pinMode(11, OUTPUT); // led pin
  pinMode(2, INPUT);  // foil pin
  digitalWrite (2, HIGH);
}

void loop() {
  int cuptouch = digitalRead(2);

  if (cuptouch == LOW) { 
    digitalWrite(11, HIGH); 
  } else {
    digitalWrite(11, LOW);
  }
}

I don’t think there is a particular thing I am proud of about my code because the code is similar to what we did in the class. At first of my setups of the circuit, I forgot to add the digitalWrite function in the code, which made my circuit fail. But then I added it and the cups touching worked as a switch on to the circuit.

Setup

Reflection

I think that I could further work on how the clinking of glasses is portrayed on the breadboard: maybe the LEDs don’t light up immediately, but with a pace, which will remind of growing mood of the person.

I feel like my project could present a great potential to the experience of customers in coffeeshops, where people connect with each other while having cups of coffee. It could bring coffeeshops customers higher level of interaction with the products and a desire to come back to light up another LED with their cups.

Also, I would like to work on how aesthetically wire and foil is attached to the cup/glass (again coming back to Don Norman’s work). There are different designs of cupholders, and I think I could make one that would be created from metal or have foil attached more gracefully. Moreover the wire can be connected in a more hidden way and maybe incorporated to the coffeeshop tables, so that cups are kind of wired to the tables, but are still usable.

Her Code Got Humans on the Moon

I’ve heard about Margaret Hamilton and known her for this famous photograph, but I wasn’t familiar with her work specifically. And now reading the article, I am fascinated by the amount of dedication and commitment she put in development of the software as well as the scale of her creation and it’s very disappointing that not many people are familiar how she started the software engineering as a field.

I liked that in the article it was emphasized that we should approach coding by planning out and thinking through all possible mistakes and failures that could happen in the process of using the product. No one believed Margaret Hamilton’s saying that human error could happen among astronauts, but it did in one of the most unfavorable moments for the team. In the same way I feel like this attentiveness to details and thinking of possible outcomes beforehand helps to build usable and friendly product for the user, so that when the user fails, the application doesn’t fail as well.

Also I was shocked that copper “ropes” could store words.

Emotions & Design: Attractive things work better

The main takeaway for me from this article is about the importance of the impression and emotion that the user is left with after using the product. And basically that’s the reason why Don Norman buys three teapots, because each of them provides him an affect value. This kind of resonates with the idea of arts and also the teachings of my theater class that I’m taking this semester: everything falls to what kind of emotions artwork prompted you to. Hence, one of the ways to cause feelings in the person is by beauty and aesthetics of the product. That’s why attractive things work better, when you feel great you do great.

One of the things I noted for myself was that according to the Don Norman, design preferability depends upon the occasion, context, and above all, mood, hence people buy different things to suit different circumstances, which ultimately leads to overconsumption and waste.
Also I didn’t know that our choices and affective signals are so much biologically driven, because the way I thought about it was that it cannot be impacted in any way and it was purely intuitive.

Also, I believe that many people have a conviction that attractive things are less usable. I think it is a belief that was instilled to me by my community because too bright and vivid things were less desirable to have. But, the article completely proves otherwise. Overall, the trend described by Don Norman that people want to have more pleasure and joy in life kind of describes why there is now a great development to the entertainment field and why many designers prioritize the pleasure in using their product.

Concept

I have come to the decision to change my initial idea with Piano Tiles to one that had more connection with me and my interest. And TA-DA here I go again connecting my project to favorite Friends show. The reason I switched is because I knew it would be easier to create a project that you will have fun building and also passionate about. In this project, I wanted to highlight key moments from the show through the perspective of the characters, since each of them has a different story and individuality. There are six main characters in the show, and creating a game for each of them was kind of challenging and time inefficient, so I came up with different interactive project ideas for characters. I would like to stop on each one:

1. Phoebe
   I started from creating a page for Phoebe. I still wanted to work with music in my midterm, so I chose a famous song sang by Phoebe, called Smelly Cat. I wanted to make it similar to karaoke, so I implemented an interactive element, where the user could press the specific keys to get the singing of specific lines of the song. So, there is only a karaoke version of the song playing in the background and to make the song complete, the user should add the lyrics sounds by pressing on keys. This page took me a lot of time working and correcting the code, because the sounds in p5js are pretty hard to handle. First of all, I separated the song to the lyrics sound and to the instrumental part, then I cut the lyrics sound to the lines, and assigned each line a specific key. But the hardest part now comes with the playing of the sounds.

   let soundPlayed = {
     'S': false,
     'W': false,
     'F': false,
     'T': false,
     'R': false,
     'Y': false,
     'N': false
   };
   
   
   function smellykeys() {
     // converting the pressed key to uppercase
     let pressedKey = key.toUpperCase();
   
     // logic is to play a specific sound and stop the rest
    if (pressedKey === 'S' && !smelly.isPlaying() && !soundPlayed['S']) {
       stopAllSoundsExcept('smelly');
       smelly.setVolume(0.2);
       smelly.playMode('untilDone');
       smelly.play();
       soundPlayed['S'] = true;
     } else if (pressedKey === 'W' && !whatarethey.isPlaying() && !soundPlayed['W']) {
       stopAllSoundsExcept('whatarethey');
       whatarethey.setVolume(0.2);
       whatarethey.playMode('untilDone');
       whatarethey.play();
       soundPlayed['W'] = true;
     } else if (pressedKey === 'F' && !itsnot.isPlaying() && !soundPlayed['F']) {
       stopAllSoundsExcept('itsnot');
       itsnot.setVolume(0.2);
       itsnot.playMode('untilDone');
       itsnot.play();
       soundPlayed['F'] = true;
     } else if (pressedKey === 'T' && !theywont.isPlaying() && !soundPlayed['T']) {
       stopAllSoundsExcept('theywont');
       theywont.setVolume(0.2);
       theywont.playMode('untilDone');
       theywont.play();
       soundPlayed['T'] = true;
     } else if (pressedKey === 'R' && !yourobv.isPlaying() && !soundPlayed['R']) {
       stopAllSoundsExcept('yourobv');
       yourobv.setVolume(0.2);
       yourobv.playMode('untilDone');
       yourobv.play();
       soundPlayed['R'] = true;
     } else if (pressedKey === 'Y' && !youmay.isPlaying() && !soundPlayed['Y']) {
       stopAllSoundsExcept('youmay');
       youmay.setVolume(0.2);
       youmay.playMode('untilDone');
       youmay.play();
       soundPlayed['Y'] = true;
     } else if (pressedKey === 'N' && !yournot.isPlaying() && !soundPlayed['N']) {
       stopAllSoundsExcept('yournot');
       yournot.setVolume(0.2);
       yournot.playMode('untilDone');
       yournot.play();
       soundPlayed['N'] = true;
     }
   }
   
   function stopAllSoundsExcept(keep) {
    
     for (let key in soundPlayed) {
       soundPlayed[key] = false;
     }
     // stop all sounds except the currently selected one
     if (keep !== 'smelly' && smelly.isPlaying()) {
       smelly.stop();
     }
     if (keep !== 'whatarethey' && whatarethey.isPlaying()) {
       whatarethey.stop();
     }
     if (keep !== 'itsnot' && itsnot.isPlaying()) {
       itsnot.stop();
     }
     if (keep !== 'theywont' && theywont.isPlaying()) {
       theywont.stop();
     }
     if (keep !== 'yourobv' && yourobv.isPlaying()) {
       yourobv.stop();
     }
     if (keep !== 'youmay' && youmay.isPlaying()) {
       youmay.stop();
     }
     if (keep !== 'yournot' && yournot.isPlaying()) {
       yournot.stop();
     }
   }
   

   It is surely part of the code I’m really proud of. It took me couple of days to understand how to solve a problem of repeating sounds and lagging . Some sounds would block others and code didn’t work at all. By introducing variables with boolean values, I could create a check points in the code to get what I wanted (f.e. when the key is pressed, the sound plays only ones and doesn’t repeat until it is called out again) .

2.  Chandler
   When I thought about Chandler’s character, I immediately thought about his sarcastic sense of humor. So, I decided, I want to prompt the user to ask a question by typing it in the input line, and get an answer from “Chandler’ by sending the question. So, basically how I did it was by creating csv.file with all sarcastic punch lines Chandler character could actually say in the show. I wanted really to appeal to Friends fans, so I tried to create realistic Chandler’s responses. There wasn’t much difficulty with this page.
3. Joey
   I was confused with what could I possible introduce for Joey character, apart from his immense love for food, especially pizza. I decided to tie it to his character quality of not sharing food with anyone. I wanted to represent it directly in the interaction. So on his page, the user can place pizza slice wherever they want to except place, where actually the user’s plate is located. In that way, I am implying that if they go with Joey to the restaurant, they won’t get even a slice of his pizza to their own plate. For this page, I used arrays.
4. Rachel
   I definitely wanted to work with “fashion” part of Rachel’s character. As I watching the show myself, I was always inspired by the looks that were created for this character. So, for this page I decided to make a journal layout, where all Rachel’s outfits are collected and sorted by the purposes, like casual, festive, office. This page really reminded me of the scrapbook, and I find it pretty aesthetic.
5. Ross
   What I remember brightly about Ross’ character is his lines, especially “We were on a break!” one. So, I decided to focus on that side. I decided to implement OOP for this page to introduce more movement on the screen. So basically, when a user presses on this phrase, he will get a happy face of Ross, since by this phrase he used to make excuse of his cheating. And there is another phrase “It is a big deal!”, said by his ex, which made him angry, so when the user presses on it, there are bubbles with Ross’ angry face.
6. Monica
   When I thought about Monica’s character, I was struck by many ideas, because of so many qualities that she was presented in the show. So I decided to compile them all together. I came up with the creative text that would describe one of the main activities that Monica does during the show, like cleaning, cooking, dancing, organizing.

I extensively used Canva for this assignment to get high quality images.

Also to follow the aesthetics, I chose a color palette for my project and also selected the fonts (Helvetica and Friends theme font).

Final Version

https://editor.p5js.org/aa11832/full/JSemZD8wC

Hopefully, I could convince you to watch at least one episode of Friends!

Future Improvements

• For the future improvement of the project, I would really like to work on the sound accompaniment across different pages, not only Phoebe one. I could implement sounds starting from Friends show theme song to the sound of the specific key character lines, like maybe adding the sound of line “We were on a break!” to Ross page. I believe that would enhance user’s immersion to Friends universe.
• I would also to expand my work with object oriented programming in different parts of the project. I feel like there is a room for working with different objects as a parts of the background or the main interaction.
• I would also like to transfer my project to the full screen.
• I think what this project lacks is gamification. While there are many ways to interact with the project, there are no scored activities that are usually appealing most to the user. For example there are ways to gamify the karaoke page by evaluating how exact was the user in pressing the keys to match the song lyrics.
• I would also like to improve the immersion of the user to the show environment. What I created in my project captures very shallow part of the whole Friends show. Adding more unique content and games, I can address this problem.

Concept

I honestly felt lost about what kind of project I want to create for my Midterm. I did consider card games, artworks, but finally I settled on a concept of musical game. I took an inspiration from a game that I used to play non-stop as a kid, which is called Piano Tiles.

When I played this game, it made me feel like I was creating music myself, while I was just pressing the rectangles and it initiated sounds of a song. So, I transferred this idea to my own project. I decided that I want to change the interface and introduce piano keys, so it would almost seem like a piano tutorial (like in the photo below).

I imagined that I will have only seven piano keys on the screen (hence just an octave).  And there will be bubbles that will fall down on specific piano keys, depending on the part of the song. The user will be able to press on those bubbles by pressing specific keys on keyboard that will correspond to piano keys.

I think I can assign Q W E R T Y keys on the keyboard to the piano ones, so it would feel more intuitive to the user. So, basically, when the user presses one of those keys, he will be able to pop the bubble. And importantly, user have to blow correct bubble to get a score and follow the song.

Design

As a part of the draft version, I designed piano keyboard using loops. Also, I added OOP for the bubbles, creating class, so it would randomly fall downwards. I sort of worked out on the color palette of my game. I added one song, that is stopped when you press on the screen. Furthermore, I am going to work on the opening page for the project that will introduce the game to the user, also I will set different background, score metric and adjust the movement of the bubbles according to the song.

Frightening aspects

Here is the most interesting part

• I will have to figure out how to connect pressing on keys of the piano to the blow of the circle, so it disappears. Also I have to think about whether the circle will need a specific duration needed to be pressed so it would suit to the song. If that’s the case, I will have to change circular shape either to the ellipse of rectangle with rounded edges.
• But the hardest part is to understand how to tie the music (beat and rhythm of the song)  to the falling of the circles, so basically they should follow the order of beats in the song and be adjusted to how strong the beat is or how long it is, which I don’t particularly understand how to do. Moreover, the circles should fall directly at the place beyond a particular key, which lead to more specification in the code.
• I will also need to work on interactivity of the piano key board, so it would be more intuitive to the audience that the keys should be and can be pressed in order to follow the song.
• I need to figure out as well how to calculate the score of the user if the duration of the pressing will be counted to the score. In that case it will lead to more complicated code.
• Finally, entering and exiting from the game should be planned and coded as well, so it would be accessible to the user.

Risk prevention

• To prevent risk, I looked at the works of other students, particularly with the purpose of identifying how they worked with the “score” metrics, how it appeared on the code and how the score was counted.  This helped me to get more clear on my project’s score calculation
• Moreover, I decided to watch series of lesson on sound in p5.js to figure out how to tie rhythm of the song to how the bubbles will fall down. Here is the link.
• Also, to mitigate the risk, I am planning to take an office hour once I am finished with implementing all the elements.

Computer Vision for Artists and Designers: Pedagogic Tools and Techniques for Novice Programmers

It was interesting to find out that technological applications stem not only from their technical strength and abilities, but also from suitability of the physical space to which you try to apply computer vision. Therefore, now I can see how in interactive art there are two sided contributions between the artist and computer vision’s capacity that creates a final image that the audience sees. 

As it was noted by Golan Levin in the article, computer vision creates broad opportunities for application and interaction with the real world. While it may seem that computer vision almost mimics human vision because of its surveillance practices, at its core there are very different methodologies applied to human and computer vision. While, human vision operates “generally”, analyzing and accepting any image that it sees in the surrounding environment, further generating the same level of processing, computer vision is highly dependent on what kind of image it receives and compatible it is to the vision’s capacity. Therefore, computer vision may generate unexpected processing outcomes with no consistency in the quality. Simply, the way we can help the computer to track what we’re interested in is contrasting the intended object from the background image and other unnecessary surroundings. Just like in Suicide Box project, where vertical motion was characterized as a contrasting event on the image, it was easier for a computer to identify what was tracking target.

In the socially meaningful projects, like Suicide Box, it is confusing to observe how computer vision gets just manually involved in the process of identifying vertical motion without directly understanding what kind of tragic event it gets to record. While, if we would task a specific person to perform the same job as the computer, and see how people commit suicide on the bridge, the person definitely would be left with the trauma, and it would be much harder to transform his knowledge into other forms. While, in this case, using computer vision, we are separating some subjective experiences from the process, and we are left with the intended outcome, which is easier to work on. 

Concept

Honestly, I’ve been hesitant to start working on this assignment, because words like ‘data visualization’, ‘statistics’ kind of scared me with their broadness and complexity. Therefore, I tried to at least find statistics, which followed my interests. And at this moment, I saw on my IG feed that the Friends series have debuted exactly 30 years ago, on September 22, 1994. So, I started searching for any kind of statistical data on Friends (as I am big fan of this series myself), and I found this website, which has collected data about all episodes of Friends. So the dataset contained information, on year, season, episode, title, summary, director and a rating. From that, I decided to present this information in Friends series style, so it would be actually generative text output project, where you would be randomly taken on one of the episodes info collection.

You can see my final sketch here:

Sketch

To arrive at this final point of sketch, it took me a great amount of time to work with the code line by line. You can press on screen to see data on different episodes.

Firstly, I found it difficult to generate multiple pieces from the same row. In the class, we considered situations, where there was randomly selected raw and corresponding column with an item was extracted. However, in my case, I needed to figure out on how to extract values from the same row, so the row wouldn’t be randomized differently for separate elements. For example, I can’t extract “year of production” value from random row and then put it with the “title” value from totally different row, cause they are not related. So, in my project the whole difficulty lied in fact that all elements were related and had to be extracted from the same row, meaning row should be randomized only once and this value kept for all.

Highlighted code

function preload(){
//creating a p5.table object for main data
strings = loadTable('friends.csv', 'csv', 'header'); 
}

//retrieving data from the table 
let numRows = strings.getRowCount();
//setting random number of a row of a table
rowrandom = int(random (numRows));

// in the next lines I will be retrieving different pieces of data from the same random row

//retrieving "year" from the data
year = strings.get (rowrandom, 0);
fill ('#d8ccda');
textSize (16);
textAlign (LEFT);
//presenting it on screen
text ("Year of production: "+ year, 100, 210);

In the code above, you can see how I solved my problem by randomizing number of rows in the table and then kept this value in a variable and applied throughout the code.

Moreover, I learned to use image () function, by uploading a TV screen image.

//retrieving rating of specific episode based on random row
rating = ratings.get(rowrandom, 0)
// mapping range of ratings to the range of font sizes using a variable sizetext
let sizetext = map (rating, min(float(numbers)), max(float(numbers)), 10,50)
//setting mapped text size
textSize(sizetext);
textAlign (CENTER);
fill ('#504579');
text (rating, 300, 550);

Another part of the code I’m proud of is the one above, because I used map() function to illustrate difference in ratings of the specific episodes through ranging text sizes of the rating numbers.

However, there are imperfections in the code due to poor arrangement of data. The dataset that I downloaded and converted to .csv, contained commas in the summary descriptions of the episodes and they were not separated by the “”, which led to confusion in the code, as the system identified text after comma as a next column. It can be seen that at some point of generation the text “Directed by…” starts to show greater amount of texts, which are not even related to director names. This is parts of the summary that got identified by the system as next column. However, there are also parts of .csv file, where “” are correctly placed.

Highlighted code

Overall, I am really enjoying my output. The thing I would like to work on is to correct the dataset to avoid errors. Moreover, I would like my project to be more responsive to the user, so I would like to add a function of guessing the correct season/director/year of the episode, so that it will turn to a fan quiz on Friends. I would also further work on the visuals, to add more stylistic elements resembling Friends aesthetic.