October 2023 – Page 13 – Introduction to Interactive Media

Midterm Project Progress

Concept

For my midterm project, I have decided to implement a puzzle for the user to solve, “Black and White Hat Puzzle”. The puzzle typically goes something like this:

There are 5 hats: 3 black and 2 white. Three characters can see each other’s hats but not their own. They must figure out the color of their own hat based on what they see on the others’ heads, using logic and deduction.

Design

I will implement this puzzle as the user to be one of the three characters wearing a hat, and can see the other two people’s hat. The user needs to correctly guess the hat color he/she is wearing. The user can make only 2 guesses.

If the user can’t make the right guess, the solution will be presented to the user.

A simple wireframe:

Challenging Part

Drawing the each elements and characters on the canvas
Assigning the hats randomly to the characters and displaying it
Building the algorithm behind explaining how the user should solve the puzzle correctly.

Risk Prevention

I will not draw everything on the canvas, but I will draw them on my ipad and insert them as images to the canvas.
Assign each of the hats values (and an image of white or black hat) and randomly choose one of them and display it on the screen (on each characters’ head). But the hat of the user must be hidden until user makes the correct guess or two guesses.
Depending on the other two characters’ hat, the guessing logic must be one of the following:
1. If a character sees that both of the other characters are wearing white hats: In this case, the character deduces that their own hat must be black. This is because if they were also wearing a white hat, it would mean that there are two white hats in total, which contradicts the given hat distribution.
2. If a character sees one white hat and one black hat on the other two characters: In this scenario, the character cannot deduce the color of their own hat based solely on this information. They don’t have enough information to determine their own hat color. Their guess would be uncertain.
3. If a character sees that both of the other characters are wearing black hats: In this situation, the character can deduce that their own hat must be white. This deduction is made based on the knowledge that there are only two white hats and three black hats in total. If they were also wearing a black hat, it would result in three black hats, which contradicts the given hat distribution.

Week 5: Reading response

The author outlines several ways computer vision can be enhanced to work on identifying human beings which include but are not limited to using retro reflective marking material. This raises multiple questions in my head about the efficiency of the programs if it only works under certain conditions. I know that this is considered a huge improvement when compared to earlier solutions however I find it interesting that the author is overlooking the main problem which is that having people wear retro reflective film to be detected by the program makes the program non reusable which in turn makes it inefficient.

The author also mentions how the program would only be able to detect objects that can be described using code or by relating it to other objects the computer understands which further makes me question whether it is reliable to use in all cases.

The reading made me wonder how much this technology has advanced since this article has been written considering the amount of facial recognition, virtual reality and augmented reality softwares that have emerged and are being used more frequently and more accurately.

week 5 – midterm progress

concept

My favorite thing about media is its ability to tell stories. Particularly, in interactive media such as video games, the storytelling is incredibly immersive as the viewer has some agency in navigating the way they experience those stories. For this reason, for my midterm project, I wanted to engage in some sort of storytelling. What I envision is something that is at the intersection of being a game/a visual story. I want to have a character that moves in an explorable region and interacts with different objects in the scene to get bits and pieces of the story.

Ideally, it would look similar to something like below, but it would have more distinct objects and probably only one playable character. I also want the setting and the story I’m trying to convey to be somewhat personalized to me and some of my own experiences, though I’m not exactly sure what yet.

design

For the design, I think I am going to heavily utilize images for more rich scene-setting/worldbuilding. I would like the interactive objects, however, to be made in p5.js, so it’s easier to allow the player to interact with. I also would make visuals to convey the story, that would need to be drawn.

challenging

My main worry in this project is that it relies very heavy on visuals. I’m not exactly the best artist, so I’d need to find specific sprites for the story that I want to tell and background images. In addition, because I want some element of story telling through visuals similar to graphic novels, I’ll have to think about how to get those as well.

In addition, I’m worried about how to handle all these different aspects, especially transitions between different states (as this was something I struggled with in our last assignment as well).

how I plan to handle it

I think some part of it would be through finding assets online, and other would be finding creative ways to develop those as well, such as perhaps drawing them myself to make the project more personal.

For the more complicated/technical challenges, I think the best solution is to make the story as succinct as possible and start small. I’ll implement the small functionality first – such as making a few objects interactive – and only having one animating object. If I figure out how to do that, the rest should be easy hopefully.

Reading Reflections – Week 5!

The interactive artworks seemed quite interesting but what caught my attention more were the elementary computer vision techniques. I’m always curious to know what goes on behind the scenes so understanding how motion and presence are detected was fascinating. Just as I was thinking about real time issues these could pose with reference to the physical environment, the next paragraph highlighted these and the possible optimization solutions like dim light, thermal imaging and more, I wonder how plausible and multifaceted these are considering the diversity of environments users might be operating from.

However, amidst the technical intricacies of this reading, there was a line that struck me.’In designing systems to “see for us,” we must not only become freshly awakened to the many things about the world which make it visually intelligible to us, but also develop a keen intuition about their ease of computability.‘ This encapsulated the essence of Computer Vision to me and also added some meaning to it beyond code. This whole concept of being awakened to our surroundings, takes me back to something that I try to practice – being mindful about simple things around me. Combining this with code seems like the perfect combination to work on.

As I find this field of Computer Vision quite interesting and fun, I definitely want to learn more and explore its applications in further projects. I would also read up more in-depth about this specifically, the algorithms, the issues that may come up and possible ways to solve them.

Midterm Progress Report 2- Pop Frenzy

I made some significant changes to my p5.js game, which I’ve now named “Pop Frenzy”. One of the key updates was the addition of a menu feature, aiming to improve user experience. At first, I attempted to use a while loop to transition between game states, but I ran into some issues when trying to create a final screen for game loss. To address this, I opted for if statements and introduced a variable called “choice” to switch between the menu, game, and game-over screens. This approach allowed for smoother transitions and better screen management.

In terms of visuals, I decided to dynamically change the game screen’s color intensity. As the player loses more balls, the screen shifts from a vibrant red to a darker, more intense shade. This alteration effectively conveys a sense of rising challenge and urgency, heightening player engagement.

In addition, I took the initiative to incorporate various sound effects, breathing life into the gameplay. I included sounds for button clicks, ball pops, game-over scenarios, and even background music to create a more immersive experience. This auditory dimension adds depth and excitement to the game.

Here’s a screenshot of the final loser screen where the player is given the option to either go to the menu or press the shout button that outputs a sound(merely for fun interactivity).

The Menu Screen:

To make things look more neat, I went with a blue title to match everything. As well as, adding some text of the description of the game to get started.

I incorporated a screen allowing players to pause or resume the game by pressing a designated key, which in my case is the escape key. This functionality was achieved by implementing the built-in functions loop() and noLoop() from p5.js. When the escape key is pressed, noLoop() is executed, causing p5.js to halt the execution of the draw function. Subsequently, when escape is pressed again, the game seamlessly resumes from where it was left off.

To facilitate the addition of a paused menu screen, I strategically placed the function containing the loop() and noLoop() calls at the end of the entire code. This ensures that when the escape button is triggered during gameplay, one final draw cycle occurs before suspension. Within this concluding draw cycle, p5.js generates a screen displaying the “game paused” message. This approach ensures a smooth transition between active gameplay and the paused state.

Here’s a snippet of that function:

function keyPressed() {
  if (keyCode === ESCAPE)
  {
    if(balllost==8)
      {
        gamePaused=false;
      }
    else
    {
    gamePaused = !gamePaused; // Toggle gamePaused variable
    }
    if (gamePaused) {
      noLoop(); // Pause the game
    } else {
      loop(); // Resume the game
    }
  }
}

The initial ‘if’ statement basically ensures that if the escape button is pressed in the loser screen, the draw function will still keep looping and won’t cause issues. Since the player already lost, there’s no need for a pause screen at the loser screen.

Overall, I’m quite pleased with how these modifications have elevated the game’s overall experience. The combination of refined visuals, dynamic color shifts, and a diverse range of sound effects contributes to a highly engaging and immersive gameplay. Adapting to challenges along the way has been a learning experience, and I’m proud of the creative and technical progress I’ve made in this project.

week 5 – reading reflection

This week’s reading particularly piqued my curiosity, as I have often heard/read about computer vision, but never in the context of Interactive Art. The reading adequately introduces the difficulties within the field and brings up notable artworks that utilize technology like this. It was interesting to see the different ways computer vision could be used.

The pieces that caught my attention were the ones about surveillance. My favorite piece was Sorting Daemon. The composition of the given snapshot generated by the project reminds me of many avant-garde artworks, which is not only aesthetically pleasing – but also eerie, considering that the artwork is being generated from real people’s faces, regular unaware passers-by. I can not imagine how odd it must be to see a machine reconstruct your physical self, using your likeness to construct silhouettes that only appear vaguely human. The existence of this artwork in of itself feels like a paradox – critiquing surveillance while enabling it as well.

Another piece that causes similar conflicting feelings is the morbid Suicide Box. I think the art piece, while exploring themes of surveillance, presents ethical questions at the cross-section of technology, art, and interactive media. Does the piece’s intention – measuring the ‘despondency index’ – justify the technology used?

Both these pieces inspire a conversation about computer vision in interactive media art – not only raising the question of how far we should go, but also if we should.

Week 5 – Midterm Progress!

Concept

While the holiday season may still be almost 80 days away, this midterm project allows me to bring a touch of early Christmas magic into our lives, especially amidst the upcoming academically intensive weeks. My project is designed to immerse users in an interactive Christmas wonderland, where they can experience the joy and festivity of this cherished time of year.

Design

In this experience, I aim to blend various elements to incorporate the spirit of Christmas. Users will have the opportunity to enjoy the following:

They will be able to decorate their own Christmas tree by dragging and dropping ornaments of their choice
Snow using the concept of noise
A mini game revolving around the idea of collecting presents. Either in the form of a hidden objects game or a secret santa game
A Santa claus, gracefully traveling across the night sky in his reindeer-drawn sleigh
A collection of Christmas carols playing in the background.

Inspiration:

What I’m uncertain of

One of the primary challenges I anticipate in this project is managing the display of multiple elements on the screen. I think that creating a cozy Christmas wonderland with various components like the Christmas tree, the presents game, and Santa’s journey while maintaining a visually pleasing and harmonious composition can be tricky. All the elements of this project seem quite simple and basic but managing them together might become chaotic.

How I plan to handle it

To address this challenge, I plan to implement a structured approach. I will utilize multiple classes and functions to keep it organized. For segments like the game, users will have the option to zoom in and play, ensuring that the main screen retains a clean and inviting appearance

I’m excited to continue coding this prelude to the holiday season

Week 5: Midterm Progress

For my midterm project, I’m drawing inspiration from the cherished game my sister and I used to play on our PSP, featuring Sonic, and giving it an endearing and personal twist. I’ll be introducing my beloved dog, Simba, into the world of gaming.” Simba’s Pawtastic Adventure” centers around Simba’s quest to gather delicious treats and his favorite toys as he embarks on a journey to find his way back home to his family. Simba will journey through enchanting landscapes while avoiding obstacles like puddles, bushes and other obstacles.

Gameplay Overview:

Character: Simba, the adorable and loyal dog with a heart full of love and a tummy full of treats to collect.
Objective: Accompany Simba through a whimsical world filled with colorful landscapes while gathering his favorite treats and toys.
Obstacles: Simba must navigate around playful puddles, fluffy bushes and other challenges.
Homecoming: The ultimate goal is to reunite Simba with his family, making it a heartwarming experience for players.
Scoring: Players earn pawprints as they collect Simba’s treasures, with bonus pawprints for completing levels fast.
Feedback: Adorable animations and joyful sounds upon collecting items, plus a heartwarming “Family Reunion” animation when Simba finds his family.

With Simba’s Pawtastic Adventure, my aim is to not only transport players back to the days of playing online games but also envelop them in a world filled with the purest form of love and warmth – the love between a furry friend and their family.

While I haven’t started coding the game yet, I anticipate challenges in achieving smooth and responsive movement for Simba, especially when it comes to jumping and implementing gravity in a way that feels natural. Additionally, handling collision detection with obstacles and surfaces may prove to be complex. To overcome these challenges, I intend to break down the game development process into smaller, manageable sections. By tackling smaller chunks of the game at a time, I can focus on refining specific aspects without feeling overwhelmed by the complexity of the entire project.

Reading Reflection: Week 5

The reading delves into the realm of computer vision, a technology that enables computers to comprehend images and videos. It discusses a significant transformation: how computer vision has evolved into a field that is now accessible to anyone. This transformation has been facilitated by the development of new tools, the emergence of open-source communities where people freely share their work and the availability of more affordable video equipment. In the past, computer vision was highly complex and primarily reserved for experts, but today, it is a resource that regular individuals, including students and artists, can leverage to accomplish exciting projects.

One project discussed in the reading that stood out for me is “Videoplace,” an interactive art installation developed by Myron Krueger between 1969 and 1975. In this installation, a participant stands before a backlit wall functioning as a projection screen. The system digitizes the participant’s silhouette and analyzes their real-time posture, shape and gestures. What’s striking is how this technology was conceived and implemented decades ago when our technological capabilities were far less advanced. It serves as a precursor to contemporary innovations like facial recognition in Apple iPhones.

We are currently observing a growing incorporation of computer vision in interactive art installations and diverse applications. Computer vision has become increasingly accessible and smoothly integrated into our everyday routines, elevating a broad spectrum of functionalities beyond the realm of art. These encompass healthcare, transportation, security and entertainment, signifying its pivotal role in our contemporary existence.

Reading Reflection – Week #5

The reading for this week was especially interesting. I have never seen the first works in interactive media that were using the concept of computer vision. I do not think that I came to like every work, however, one work was extremely fascinating – Suicide Box by the Bureau of Inverse Technology. It raises complex ethical concerns. While it offers a thought-provoking commentary on surveillance, privacy, and technology’s impact, its name and intent may be distressing. Ethical issues include potential harm to vulnerable individuals and the responsibility of artists to consider the emotional impact of their work. Even though this work triggered negative emotions in me, I believe it is one of those works that changed the world.

Although I liked how the author of this article was trying to present evolutionary artworks and thus provide a guide for new programmers about computer vision, I believe the lack of technological advances that use computer vision was obvious. Today, for instance, in healthcare, computer vision aids in medical image analysis, diagnosing diseases like cancer, and monitoring patient vital signs. In criminal investigation, it’s used for facial recognition, fingerprint matching, and analyzing surveillance footage to identify suspects and solve crimes swiftly, enhancing both medical diagnosis and law enforcement efficiency. These are just several examples of how people use computer vision not just for the sake of art, but also for something that is truly significant. I feel that the author could’ve mentioned these implications and shown how art can be incorporated into our everyday lives.