Banyan Tree (from the internet) White marker on printed paper
Further exploration on sensors 🪩
This week, the atelier went through a more in depth workshop on Arduino and attended, expanded on the various experimenst and reflected on the progress of my making thus far.
① Arduino Workshop
During the first workshop, the atelier was introduced to the different components of an Arduino kit and the resources available online to get started in arduino.
We were then introduced to the different components such as motion sensor, light sensor, etc, and the one that I found partcularly simple and straightforwatd was the servo motor.
Introduction to Arduino workshop by Andreas Schlegel 11 Oct 2024
Arduino, Potentionometer, Breadboard and Jumper Wires 11 Oct 2024
Set up connected to Arudino IDE 11 Oct 2024
-
Simple Set Up for Potentionometer (input) to light bulb (output) 11 Oct 2024
-
Set Up x3 light bulbs *party mode*!!! 11 Oct 2024
-
② Buying my first Arduino!
Going to an electronic store can be intimadating so the best I could do was to prepare a shopping list. Sunlight @ Sim Lim Tower at Rochor, Singapore, has pretty good staff that are willing to assist in your questions.
After shopping for close to an hour, while googling and making assumption of the compenents, I got seven items which amounted to $86. The experience was a tiny bit scary, expensive but everything felt a little better after I was greeted by a heart from the Arduino.
Shopping List 16 Oct
Goods from electronic store ‘Sunlight’ @ Sim Lim Tower, Singapore
Left to right: Breadboard, Arduino, M/F and M/M Jumper wire, Tower Pro Micro Servo 9g SG90 (motor), small bulb and LDR
My Arduino First Light Greeted by a heart
③ Incorporating sensor into fake hand 🔎
Keeping things simple, the first thing I tried was to get the motor moving. It opened Arduino’s website to get a sample code for motor and within 30mins I got the motor to move.
Servo Motor example – Arduino IDE
-
My first time getting a Sevo Motor to move 11 Oct 2024
- Next, I explored how I can incorporate the pulling mechanism of the prototype to the servo motor. My first idea was to makeshift a coiling mechanism for the string. So, the first iterations included chopstick, tapes and wallplug.
- One of the major component in this set-up is the importance of keeping both the motor and prototype stucked to the surface. Although the tape worked for the prosthetic, the tape holding down the motor kept breaking off each time it moved. The coiling method did not work either. Neither did simplifying the coiling prototype helped.
Tools to create a coiling mechanism – Chopstick, Wall Plug, Blade (provided w Servo Motor) and Tape
First coiling protoype - failed
Testing - Failed
-
Second coiling protoype - failed
-
Feeling frustrated I asked Tammy for help and she suggested why don’t I just tie the string into the holes of the motor blade. To solve the tension problem between motor and prototype, I decided to make use the table and more tapes to provide better support.
-
This set up was successful and some of the key factors were (1) building good tension between motor and prosthetic and (2) tying knot straight onto the provided blades of motor.
Tying knot on to blade itself
Table edge as a support for better tension between prosthetic and motor
-
Video testing - success!
-
Greeting fake hand 16 Oct 2024
-
Reflection:
The prototype is successful however it did not have the same intimacy as before. The first prototype felt more intimate as there was an input and output by human efforts. This prototype only has an input and output that is pre-determined. Hence, my next iterations would involve another sensor as input.
④ Interviews 🔎
After this, I was curious about what people wanted to meet hands with - like “what is something untouchable that people want to touch?”. Providing simple context and video reference, I asked people around my age group what is something untouchable you want to touch?
-
"I want to touch people's heart" Chunying, 24
-
“I want to touch people’s mind, heart… and just things that out of this world lah” “…I want to touch stars!” Jane, 24
-
“But, every particle of every thing on earth are simply stardusts. We are already touching them” Anna, 24
- so, my interpretation of Anna's interview was a suggestion to use dusts as a material for touching stars. cool. i didn’t know i was so close to being one w the stars.
Self-portrait Taken by Anna
-
Reflections:
The interviews were helpful in knowing people around my age have the desire to form emotional connection with the natural (physical) world.
Holding hands are intimate for humans. Science has an explanation called the 'oxytocin', often called the "love hormone" or "bonding hormone as it evokes a sense of security and closeness. Throughout history, humans have always engage in their sense of touch for survival, relying on close physical proximity to form social bonds and ensure protection within groups.
'Nature is Intimate' Week 2 CPJ Header Picture
-
However, the idea of physical closeness blurs as we enter a digital age where our senses and
perception are constantly shaped and altered with technological devices.
Acknowledging the good and bad of electronic devices between humans, my question lies with the non-humans. In what ways might sensing machines (or electronic devices) mediate social bonds between humans and non-humans, raising questions about the nature of mutual protection and intimacy in interactions like physical touch or holding hands?
④ Otherwordly Expressions 🔎
Reflecting on Week 7's attempt at an online 'hybrid generator', I had a burning passion to redeem myself by reinventing the 'Tracing roots' activity to live.
-
So, I first went on to P5js to look for a drawing pad JS code which led me to user;fffiloni. After testing his basic code, I realised I needed a ‘undo’ button. So, that began my journey utilising ChatGPT 4.0 to assist my vision.
-
Through multiple iterations asking Chat questions like “how can i add this code into a HTML website?” and “can i change the background to an image instead?”, I was able to create a website where users can draw over an background image. Disclaimer: This was also only possible with basic HTML and p5JS lessons that I received at LASALLE College of the Arts for over 6 months, seperately.
Original Code from P5js user;fffiloni – link
Chat first question to “Add undo button"– zoomed
Qustion: “Can I change the background to an image instead?” - referring to the canvas of the drawing pad
First few iterations of the website
-
The website went through an initial round of user-testing to check for the performance. The drawing pad operated smoothly as expected however as I was reviewing the outcomes, I was curious to see users’ creations without the background image.
-
So, I asked chatgpt to assist me in adjusting the code of the ‘save’ button such that it only captures users’ drawing. I have a few reasons for that decision. Firstly, I wanted users’ to see, and possibly be surprised by, their creations to encourage a sense of agency over their expression online.
User-testing– Keshi, 20, Design Student
SUser-testing Outcome – jpeg file
Asking Chat 'How to allow users to save their drawings without the background image'. – link to view chat
-
Next, I decided on an aesthetic that didn’t look too serious. I kept the styling (CSS) simple to reflect the attitudes of a ‘cozy web’. Cozy web refers to an intimate, small-scale internet experience where users connect in close-knit, personalised online spaces. Platforms like Tumblr and neocities that priortises fostering community and warmth.
-
– in contrast to the vast and impersonal mainstream platforms. One of the key proponents of this concept is Laurel Schwulst, who wrote an influential essay titled "My Website is a Living Thing" in 2019.
Root Watching – link to try
-
The user interface is kept simple. I avoided explaining too much about my objective of fostering relationship between humans and nature. Rather, I chose to encourage users to imagine the otherwordly scenes.
-
This goal aligns with Morton’s “Ecology without Nature” where he argues that artists, or anyone who imagines our environment, one should consider how it’s reflects human acitivities. The act of users’ simply imgaining life forms that are out of the norm contributes to the bridging of the nature and culture divide.
Step1: Draw
Step2: Save
Step3: Be surprised at your creation
-
Another component to the UX is linking an Are.na channel for users to upload their creations. This was
inspired by designer, Elliott Cost, where he collected park videos using are.na channel for his website
called One Minute Park. The component of allowing users to upload their
creations aim to foster a sense of community where they can express themselves and interact with other
users.
One Minute Park by Elliott Cost
'Root Creatures' – Link to Are.na board
-
Refletcion:
Reflecting on the user experience, the idea of drawing/tracing as an expression between the roots and the user felt like a friendship that could need more 'life'.
④ An experimentation of bringing more life to expressions on the web 🔎
Reflecting on users' outcomes, I wanted to experiment with different ways to incorporate movement into the creatures. Using p5js, I experimented different ways to incorporate animation into the creator’s drawings such as, Bouncing Images and Image-to-Points, which then led me to learning about Conway’s Game of Life.
-
Starting off, I uploaded the results onto a seperate page called dreamscape creatures. Where I introduced an animation script that allows these drawings to float about.
-
Bouncing Images
-
Next, I was curious to see them in 3 dimension. So, I brought it to p5js to explore image to point animation. Each version pushes the concept of “dimension” altering the original state.
-
First Dimension – Link to P5js
-
Second Dimension – Link to P5js
-
Third Dimension – Link to P5js
-
Reflection:
Reflecting on the exercise, I recalled Week 9's sharing from ‘Feelers Feelers’ where we were introduced to us their concept of a ‘Greener Screen’. One of the key theory to for a sustainable web is to opitmise and minimise the jpeg files to reduce energy consumption and cognitive power of the uesrs. -
If the goal of this experiment is to build better intimacy between humans and non-humans through a website. Can there be a process where no images have to be uploaded? How can I bring more life to users while expressing online?
'I asked Chat how to bring more life to pixels' – they gave me a cellular-automata code
'I asked Chat to incorporate Game of Life to drawing pad' – Link to Chat
-
Game of Life' Drawing pad – Link to P5js
-
Cornway’s game of life was quite a discovery. Originating from the theory of cellular automaton where math meets tech, the dynamic and evolving patterns allows users to interact with 'life' made from the simple rules of life and death.
John Conway and the Game of Life – The complex system of Cellular automata
-
Sticking to the idea of a drawing pad, could the act of placing or removing pixels on a grid symbolise the creation process? and the system of finding neighbouring cells represent life?
-
Buttons to control the activation of cellular-automata – Link to P5js
-
The idea of a drawing pad / game of life was so applicable for anything. I tried it over the the image of the roots and introduced a new rule where the pixels do not turn postive. The result look like a bonsai root getting into eaten by pixels HAHAHA.
-
Buttons to control the activation of cellular-automata – Link to P5js
Feedback 😮
It wasn't much of a feedback but more of a appreciation for my creative journey and expression. I was then introduced to a online seminar of 'A Knowing Wrongness' by Fraser Muggeridge - a graphic designer who did his PHD thesis on unconventional approaches and 'interuptive' methods. I was also told that this approach is a risk because I do not know where this exploration will end up as but I was encouraged to keep exploring various senses and sensors. It was also implied that I should watch the online seminar and recosider the trajectory of my reserach.