Week 5- Midterm Progress 1

Generative Gallery: A Digital Art Experience

Concept: 

The concept of the art gallery is to create an immersive and interactive digital art experience that showcases the power of generative art and Object-Oriented Programming (OOP). The gallery is designed to engage visitors in a multi-sensory journey through four distinct exhibits, each of which highlights different aspects of generative art.

Project Components:

  • The background will be an image of the art gallery.
  • There will be a soothing sound effect in the background
  • On screen text will provide information about the art.
  • The project will be implemented using object-oriented programming.
  • When you start the project, a screen with instructions will be displayed.
  • You will be able to interact with the project by clicking on the screen to look at the art.
  • I will include a “Start Again” button, allowing you to start a new session without having to refresh the page or restart the sketch, ensuring a seamless experience.

This code just displays the exterior and interior of the art gallery.

Challenges:

Creating a Generative Gallery: A Digital Art Experience in p5.js will be an exciting project. It will come with some challenges I’ll have to work through. I’ll need to create complex art that changes in real-time, making sure it runs smoothly. I’ll need to design buttons and stuff so people can use the art easily. I’ll also have to think about how it will work on different screens and use a way of coding called object-oriented programming, which will be kind of like making different building blocks for the art. Finding and fixing mistakes in the art will be tough, but I’ll learn a lot. Making sure the art is well-documented will be important for others who might want to understand it. Despite these challenges, I’ll be proud of the result – a cool digital art experience that I hope everyone will enjoy.

Midterm Progress draft 1 – Week 5

 

Concept: PuzzlePlay

This project idea sprang from something personal and relatable – my sister’s love for solving puzzles. It always fascinates me yet triggers me how she has the patience and dedication to tackle intricate puzzles. It got me thinking, why not bring that captivating experience into the digital realm? I want to create a digital puzzle game that captures the essence of those satisfying moments when you piece together the final part of a puzzle.

But here’s where it gets exciting – users can take the reins to customize their puzzle-solving journey. Inspired by my sister’s passion for puzzles, I want to offer users the freedom to tweak the puzzle’s difficulty. They can do this by adjusting the number of columns and rows in the puzzle. It’s like having the power to set your own challenge level. this project aims to provide an interactive and enjoyable experience that’s both personal and engaging.

User Interaction Design:

  • The user is greeted with on-screen instructions 
  • The puzzle piece will be an image from online
  • Puzzle pieces are displayed on the canvas, and users can click and drag them.
  • A “Shuffle” button resets the puzzle.
  • Sound effects play when pieces are clicked or moved.
  • Upon completing the puzzle, a “Congratulations!” message with a celebration sound effect is displayed.

 

The most frightening or complex part of the project would be the implementation of puzzle piece movement and the logic behind shuffling the puzzle once the user has completed it. 

Piece movement:

As far as doing something to minimize that risk I’ve created a quick draft here of what the final project may look like I’ve numbered each piece on the puzzle so it will be easier for me to identify  the grid location and can later replace the number with the image that I’ll use 

Swapping pieces and finding the empty position: ( swap find/ 0 position):

I’ve created a function that allows me to check when the box is clicked if it’s valid to move to the empty position or not, also I created a function that can allow me to swap the pieces. Through an “IF” condition we check if the piece is valid/ empty then we allow the 2 pieces to swap.

Midterm Progress

For my midterm project, i researched many concepts but the concept that intrigued me the most is using animated sine wave structures to show data. As for the difficulties, the coding part of this concept is ranging in complexity, which i will have to pay extra attention to. Ive seen many examples on this interactive concept, i will figure out a creative way to join/connect all the things i learned in class also integrate sounds, and hopefully will have a final look to my project and by watching more tutorials on p5 i will be able to accomplish these ideas. To be Updated.

Week 6 MIDTERM PROGRESS REPORT # 1 : AURA 🦋

 

MY CONCEPT:

MY IDEA FOR MY MIDTERM COMES FROM THIS ARTWORK I PAINTED A WEEK AGO. WHILE I WAS PAINTING THIS PIECE, ONE OF MY FRIENDS SAID THAT THE PAINTING REMINDED HER OF AN AURA. I FOUND THIS INTERPRETATION OF MY PIECE VERY INTERESTING, SO I DECIDED TO PURSUE IT FURTHER AND CREATE A GENERATIVE P5 ARTWORK BASED ON IT. I THOUGHT IT WOULD BE REALLY COOL TO USE PERLIN NOISE AS ONE OF THE METHODS TO RECREATE THIS PIECE DIGITALLY.

https://editor.p5js.org/dianadonatella/sketches/GEIf0_ruE

 

TO MAKE THIS PIECE MORE INTERACTIVE AND INTIMATE, I WOULD LIKE TO ADD A FEATURE IN WHICH THE USER CAN TYPE THEIR NAME INTO A DESIGNATED LINE OF CODE AND THE ARTWORK WILL DISPLAY A UNIQUE RANGE OF COLORS THAT REPRESENT THEIR AURA. (MANY THANKS TO PIERRE FOR THE NAME) ADDING TO THIS IDEA, I’D LIKE THE NAMES THAT ARE TYPED OUT TO HAVE A UNIQUE SOUND IN ADDITION TO THE ARRANGE OF COLORS! FOR THIS PART, I WOULD MOST LIKELY COMPOSE SOME MELODIES OR USE A RANDOMIZED ARRAY OF NUMBERS REPRESENTING STAFF NOTES.

 

THIS PROJECT WILL BE DIFFICULT BUT I REALLY LIKE THE IDEA, SO I AM EXCITED TO TAKE ON THE CHALLENGE.

HERE ARE SOME BRIEF IDEAS FOR HOW THE SKETCH COULD APPEAR. (THESE ARE ROUGHHHHHHHH)

 

 

 

 

 

 

 

 

 

Week 4 – Reading Reflection

The reading, from the very start, drew me in with the example of the door. C2 of our campus has 2 doors on the sides (not the automatic doors in the very center) and I remember a friend who always pushed the wrong side of the door and so “nothing happened.” As a side note, she never figured it out (and rather gave up on using the doors) until she graduated last term.

It was interesting that design can have effect on people’s daily lives because I actually always thought designs are affected by human thoughts and behaviours. Looking at art and design as a way of showcasing how people think, I considered them as a one way thing, where people give inspiration to designs. For me, it was a very new way think that design has impact on people, and people give (or should give) feedback- impacting the design- and the (new) design impacting people, and on and on.

It does throw a question, however, in terms of how the feedbacks would be collected. I think normal users of designs still mostly focus on the aesthetics of designs more than the easy utility of it. (For instance, if something’s beautiful, we tend to think that its job is done as it is, even when it can be easier to use, or more effective serving its purpose.) So, I think the first step to being able to effectively gather feedback and provide some sort of guideline to designers would be the recognition of necessary standards of designs.

Week 5 – Reading Reflection

Computer vision algorithms have transformed the way I approach art and real-world problem solving. These algorithms track people’s activities in real-time, providing reports on identities, locations, gestures, and more. As a novice programmer, I have found it easy to implement user-friendly vision techniques quickly, while artists and designers can access advanced toolkits through popular authoring systems like Max/MSP/Jitter etc.

Software authoring tools have become more user-friendly, enabling art and design students, as well as novice programmers, to create interactive experiences for the web, installations, performances, kiosks, and prototypes. The integration of live video cameras as inputs has fueled the demand for straightforward computer vision capabilities.

Implementing machine vision techniques directly using environments like Processing, with its graphical capabilities, has proven rewarding. Computer vision has revolutionized art by enabling interactive and immersive experiences. In real-world problem solving, it has transformed fields like surveillance, robotics, and healthcare. Its ability to analyze visual data opens up new possibilities for understanding and addressing complex challenges and the reading has left me feeling more clear with what could be achieved with such stuff.

Midterm Progress Report #1 Drum Machine

Concept

The idea is to make a drum machine is on loop and where the user can tinker with the different sounds of the drum machine to create a beat. It’s a super fun thing to do and I thought it would be cool to learn how to make one, since it also is useful for me to teach more of the p5.sound library while at it.

This is a reference image for a general drum machine you can find online:

My current progress has been learning about the p5 sound library and the various options available with it. Currently using p5.Phrase array and p5.Part, I have been able to create a working but kinda annoying hihat beat. My aim is to add more drum sounds into the p5.Part and make options available for stuff such as bpm select, volume, play/stop functionality as well.

I am currently still figuring out how it will look like, however for now i am focusing on the function so I figure out if it can work.

 

 

Week 4: Data visualization

For this assignment, I drew inspiration from a previous project where text elements orbited around a central point. I aimed to create an illustration resembling a solar system, complete with data on the distance and mass of each planet. My goal was to have the planets rotate around the sun at controlled speeds. However, I encountered challenges that proved to be more complex than I initially anticipated.

I successfully implemented a data view in the console section, but I faced difficulty in displaying the data directly within the visual output. My primary areas for improvement include finding a solution to display data in the visual output and refining the motion of the objects to accurately simulate the planetary orbits. And the part of the code I am particularly proud of is given below. This is something I learned newly by doing this project.

console.log(`Name: ${name}, Mass: ${mass}`);

 

Reading Reflection: Week 4

I appreciated the way the author narrowed down the essential characteristics of good design to discoverability and understanding. While these are undoubtedly crucial, there are many other vital characteristics to consider, such as a clear purpose, simplicity, balance, consistency, clarity, and efficiency, among others.

When the author addressed complex designs and emphasized the quality of interaction, I wholeheartedly agreed. I believe that simplicity and complexity both have their beauty. A device or design that offers complexity can be just as captivating as a simple one because the process of discovering and learning its potential is a unique form of beauty. Each new revelation makes the user perceive the device as outstanding.

Reading about the challenges stemming from the lack of human-machine interaction highlighted the gravity of this problem. It underscored the importance of addressing these issues in design. Yes its a crucial concept in design, but the author made us understand the impacts it could create by giving examples. 

The concept of Human-Centered Design (HCD) fascinated me when the author emphasized the need for designers to focus on potential errors during the design process. I believe this is a critical consideration that every designer should keep in mind because it significantly impacts the end-user experience.

Computer Aided Vision 4 Artists n Designers.

Golan Levin’s article, “Computer Vision for Artists and Designers: Pedagogic Tools and Techniques for Novice Programmers,” introduces us to the world of computer vision, which involves computer algorithms that enable computers to understand images and videos. In the past, this field was primarily the domain of experts in fields like signal processing and artificial intelligence. However, things have changed, and computer vision is now becoming more accessible to regular people, especially students and artists, thanks to improved software tools and open-source communities. This accessibility has led to a surge in the use of computer vision for creating art and interactive experiences that bridge the gap between humans and computers.

One notable example mentioned in the article is the “SuicideBox” installation by Natalie Jeremijenko and Kate Rich. This installation serves as a thought-provoking exploration of technology, surveillance, and social issues. It was designed to measure the hypothetical “Despondency Index” of a location but inadvertently captured real data related to suicide jumpers from the Golden Gate Bridge. This project vividly illustrates the power of technology, particularly machine-vision-based surveillance, in revealing hidden aspects of society. It raises ethical questions about recording such events and underscores the unique role of artists in addressing sensitive, often overlooked issues.

What struck me most in the article was how computer vision, initially perceived as something artistic and cool, can be used to tackle complex real-world problems. “Suicide Box” serves as a powerful reminder of the intricate moral and ethical dilemmas that can arise at the intersection of art, technology, and sensitive real-world issues.

Levin also provides insights into the technical aspects of computer vision, explaining how components like Background Subtraction work. This ties in with the “SuicideBox” project, as it used this technique to trigger recording when a vertically moving object was detected while ignoring stationary objects. It piqued my interest in seeing how technical terms in the interactive world can be applied to solve real-world problems and make human life more manageable, which is the essence of what technology should achieve.