Online Live Performance

This project began as a response to COVID-19 where Yuguang Zhang and I started questioning what it means for live performances to be online; what do we gain or lose?

GAIN: mass-scale connection,
PROS: everyone is equal (no stage, no boundary) , lots of possibility for digital interaction (camera, mic, keyboard, mouse) How do we leverage on these?

LOSS: intimacy, presence, sense of space, spontaneity
CONS: delay, frame drops, resolution loss (everything is more coarse) How to we compensate for these?

CUT (1/3) showcased at Choreographic Interventions, ITP Spring Show 2020 and Movement Research

An interactive sketch for live performance where two camera feeds are CUT and switch-able by each participant. Sketch:

MASS (2/3) showcased at BOND Festival and CultureHub Downtown Variety

A scaled up version of CUT. Two live audience, who have never seen the performance before, are asked to join Yuguang and I. The brief is simple, “We ask you to pay very close attention to us and to each other, and try to connect with us. No words, no sounds, only through movement”

DISPLACED (3/3) showcased at the Center at West Park

As the lock-down eases up, we had the opportunity to integrate the physical environment – allowing us to experiment with the dynamic between physical space and digital space (output layout).

Full recording (session 1, session 2, session 3, session 4)

  • Scene 1 – Study of scale (5 performers in physical space, 2 online audience)
  • Scene 2 – Study of time and space
  • Scene 3 – Study of physical and digital space


Walking Club

Socially distanced, instructions driven.

Club page:
Shared drive:

Camera placements and physical layouts

ITP Camp Workshop

We hosted a workshop at ITP Camp (Summer 2020) to explore more on the question with others as well as to prototype on the ideas.


Living document:

Modes of interactions (algorithmic)

Live Cam (+mockups)



Layer by Layer, A Study of Scale

In a single split-moment, we experience the world in multiple layers, in different scales – not as an instant snapshot with a foreground and a background, but more as a long exposure photograph with ambiguous artefacts.

As I step out of my apartment, I experience my thoughts, one stride forward, my pace as I cross the street, the sudden sprint when the red light turns green, the avoidance of a stranger’s eye contact, or the gaze, the leafs that fall, noticing the sun rising later each day, noticing the moon becoming fuller, and vanishing, noticing the seasons change, noticing the shape of my face changing, my hairline, my relationships.

This is time and space. Fine-grained and sparse.

Layer by Layer is an experimental research in the form of choreography, composition and online installation to attempt to peel apart our physical experiences layer by layer.

Research themes:

Locating yourself – How you locate yourself reflects your relation to everything else. Your location is a moving point in space, not a spectrum, a multi-dimensional space that only you define and know.

  • locate yourself in space – where are you situated, which part of the chair, which part of the room, which part of the city, which planet 
  • locate yourself in time – where are you in time, can you move forward, which way is forward, can time stretch, can time contract, can you resist
  • locate yourself in respect to others – how far are you in the physical space, how far are you in the mental space, what is the distant determined by
  • your location is a moving point in space, not a spectrum, a multi-dimensional space that only you define and know

A minute is also a year – What happens in a minute also happens in a year, on a smaller scale. Now is not only the current moment but is part of your past and part of your future depending on where you’re positioned in time.

View this post on Instagram

Study of scale

A post shared by Nuntinee T (@nun.tinee) on

Moments versus time –Measured time is an abstraction of a natural cycle, can you sense time without a clock or a calendar?

What can we do to peel apart our physical experiences layer by layer?

Light / Shadow Calendar

Illumination Festival – October 22-24
Celebrating the opening of ‘Under the ‘K’ Bridge Park’

Idea: becoming attuned to light changes

  • We experience light in the moment. Each moment light influences us: brightness, shadows, color temperature, texture. 
  • Do we feel like going to the park or being indoors? Walking on this side of the road or the other side? Adjust our blinds, turn on LED light, turn on incandescent light, light a candle? 
  • All of these things change our environment and our behavior in each moment
  • Another thing that does it our schedule: time, calendar. However, that is fixed.
  • There is a fundamental difference between these influences – fixed and varying
  • One solution we’ve come to is ‘Daylight Savings’.
  • But that’s once a year even though this happens continually everyday. 
  • How do we become more attuned to the light changes? So that we’re able to adjust / appreciate it a little bit more

Installation: interactive time-lapse calendar

30 days by time —> audience use slide to change time of day

30 days by brightness —> audience use slide to change level of brightness

Projector installation with a tablet on podium for control
Projection: calendar view of each day
Tablet: control interface, choose to align videos by ‘time’ or by ‘brightness value’


  • Possible to install a camera under the bridge soonest?
  • ITP floor
    • How to set up digital ocean to save all images?
    • Time to use better camera?
    • Would fixed controls work? or auto?
    • Technically doesn’t have to be live… unless have another control being ‘current time’?
    • What’s the best way to do this?

Recreating the Past

Final thoughts:

  • impossible to find a visual artist i like (it’s mostly performance artists / choreographers / composers that i can think of – see below)
  • a new program for graphic design – tear up the syllabus and write your own RTP?
  • so i did a little reflection
  • main thing – the idea of “form driven content” // get to know your materials // why do it

My own takeouts / thoughts from each class:

pattern (vera monar)

  • hand computation vs computer
  • plotter aesthetics
  • how to use eyes better and not be restricted by default parameters and linear change

geometry (john and james whitney)

  • threshold of perception*
  • how to derive feelings from geometry
  • sine wave as change engine

typography (muriel cooper)

pixels (ken knowlton)

  • pixel kernels (for blurring and sharpening) / dilation, erosion
  • dithering
    Screen Shot 2563-07-22 at 23.26.36.png
  • image making technology*

image (jason salavon)

  • videos / series of images / sorting images
  • images as information* (titanic average frame color)
  • averaging / mod

body (myron krueger)

  • virtual body, reduced body
  • what interaction does digital bodies allow?
  • manipulation of time (delay) / space (scale)



Final reading:

This is how one pictures the angel of history. His face is turned towards the past. Where we perceive a chain of events, he sees one single catastrophe which keeps piling wreckage and hurls it in front of his feet. The angel would like to stay, awaken the dead, and make whole what has been smashed. But a storm is blowing in from Paradise; it has got caught in his wings with such a violence that the angel can no longer close them. The storm irresistibly propels him into the future to which his back is turned, while the pile of debris before him grows skyward. This storm is what we call progress.

—Walter Benjamin on Paul Klee’s Angelus Novus from Theses on the Philosophy of History, 1940

“What new cultures are emerging through the use of these media? What does it mean to be “socially” distant? And in a socially distant society, where does the burden of social responsibility fall and fail? How will media technology, and/or the related arts, change as a result of this halt?”

Implementation from class:

Artists I’d like to study:

Pending relating to class:

  • learn about jpeg*
  • windows of new york – generative building composition
  • screen print layers (how to separate layer?)

More from class:

*important points


If I must choose: Anne Teresa De Keersmaeker


Structure and choreography



Glitch / Deformation (Rosa Menkman / Steina and Woody Vasulka)

An Informal Catalogue of Slit-Scan Video Artworks and Research. Compiled by Golan Levin.

3D timelapse slitscan

Screen Shot 2563-07-15 at 13.53.48.png

selected sentences from reading –

“Beneath our eyes there is being solved the most complex problem of culture: utilitarian form becomes pure creative form.”

A glitch is a mess that is a moment, a possibility to glance at software’s inner structure, whether it is a mechanism of data compression or HTML code.

A glitch is stunning. It appears as a temporary replacement of some boring conventional surface; as a crazy and dangerous momentum (Will the computer come back to “normal”? Will data be lost?) that breaks the expected flow.

more reading – Rosa Menkman ‘A Vernacular of file formats’:

lines (try to work with web GL) :

Screen Shot 2563-07-16 at 11.18.03

delay (save frames) :

Myron Krueger

Reading:  dinner with myron


The point is…

Screen Shot 2020-07-09 at 12.10.22 PM

I got as far as detecting contours but wanted to do live interaction (between two people, using glitch).

My rendition (video by Pichet Klunchun):
At first wanted to do posenet but didn’t work.

Thai dance = high art // what if pop?

(how to make the colors pop?)

The important part is… getting a clear background

Screen Shot 2020-07-09 at 12.09.44 PM

code examples:

video source:

Jason Salavon

Created using frames from videos created using GANS. Original video with real humans×1080/

Unable to average the frames, I ended up drawing the frames on top of each other with very high transparency. Mathematically this should yield a similar result? If transparency level == number of frames.

I’ve worked with a similar technique in the past trying to replicate a pinhole camera image i.e. creating a digital pinhole (long exposure) image with a video.

There are digital artefacts that end up looking like paper texture in what is supposedly empty spaces (the background).

snap webcam every time button is pressed, then average:
snap every 60 frames from video,  then average:

download - 2020-07-02T122843.405.png

Muriel Cooper

Sentence from The Shape of Words reading  – “A poem only communicates if read slowly: only then does it have time to create a state of mind in which the images can form and be transformed.”

Other artists mentioned in class: Jacqueline Casey, Ralph Coburn, Dietmar Winkler, Aaron Marcus

Interesting points on Muriel Cooper from this Google Talk by David Reinfurt –

Screen Shot 2563-06-10 at 23.51.13

Screen Shot 2563-06-10 at 23.42.46

Screen Shot 2563-06-10 at 23.49.14


The article “Words, Images, Tools and Ideas” would try to fulfil the following criteria:

  1. It would make use of the tools, processes and technologies of graphic arts media as directly as possible and the tools would be integrated with concept and product. Many of these are in the workshop. In this case, they include a heavy use of all forms of photography and our computer graphics system for both images and typography
  2. The author would be the maker contrary to the specialisation mode which makes the author of the content the author, the author of the form the designer, and the author of the craft the typographer / printer
  3. Visual and verbal representation of the ideas would be synthesised rather than separate
  4. Time would remain as fluid and immediate as possible, leaving room for feedback and change

Notes and questions regarding concept:

  • Emphasise on process
  • Mix digital and analog; print room next to dark room
  • What does it mean now that we’re on screen? How do we emphasize on process?
    • How do we think in code when code isn’t visual?
    • Do we approach it with the abstraction? e.g. What’s an ‘if’ statement? What’s a for loop? What are the mathematical paradoxes? // Or do we draw/sketch out first?
    • Media is always influenced by medium? // Infinite loop between our perception and medium?
  • Muriel Cooper influence on David Reinfurt – Doing the work and being aware of doing the work; interrogating what it means to be doing the work — questions assumptions that exist

Notes and questions regarding technical parts:

  • How to get fill of each character? Calculate midpoint between all points?



e08e4629c4eac317677b60c278cb77ecdownload - 2020-06-10T184832.522



download - 2020-06-10T184040.305

download - 2020-06-11T100711.230

Rite of Spring cover can only be seen from far away

Screen Shot 2563-06-11 at 13.00.41

Screen Shot 2563-06-11 at 13.00.41

More reading:

Screen Shot 2563-06-11 at 08.37.24Screen Shot 2563-06-11 at 08.38.23


Other recommended websites and studios:

This week’s reading:


Vera Molnár

CONCEPTS (copied from class notes)

Recreating her past- 

Constructivism. During this period, she also took the work of Piet Mondrian and Paul Klee as starting points for her own investigations.

Rules –
#combination #permutation #purposefullyrandom #aestheticshock

For her, art was not about starting over or making a break. It was about pushing it forward into new areas of perception. Basic to this investigation was the relationship between the line and mathematics — what kind of rules could be used to make a drawing? Rules, of course, are central to three-point perspective and to Islamic geometric design. Josef Albers worked according to rules to learn how color interacted. LeWitt set up rules so that others could make his drawings.

Mystics > rationalists- 

The journey she undertook is dazzling. Although there is nothing in the show to indicate Molnar’s beliefs, other than her devotion to establishing and following a strict set of rules, I was reminded of the opening statement in Sol LeWitt’s Sentences on Conceptual Art (1969): “Conceptual artists are mystics rather than rationalists. They leap to conclusions that logic cannot reach.” The fact that she was a pioneer in the use of the computer and, by LeWitt’s definition, can be considered a conceptual artist gives us a glimpse into the unique terrain that Molnar occupies.



This week’s homework is to recreate some of her work. I especially enjoyed the rectangle series because of their bold and minimalistic qualities. The composition (position and rotation), size, color saturation become very apparent when there is less to look at. As a result I chose to create the studies below.

For this first week I used p5.js

My personal takeout from recreating her work:

  • It’s not the expected parameter to change because it’s not to achieve a perfect composition or symmetry
  • Wonder if she starts by hand / learning to look closer at what parameters make it feels like she did this by hand?





download - 2020-05-27T172453.221

Code (click for variations):

Surprising line of code (key ingredient?):

  • The random number of squares in each of the 9 squares
  • The difference in tightness between columns and rows

Feelings: shakey, vibration, buzzy, much like sound visualisation



download (71)


download - 2020-05-27T170450.380

Code (click for variations):

Surprising line of code (key ingredient?):

  • The perception of tightness comes from both sizes and positions, how to balance?

Feelings: abstracted waves, order in chaos, trying to make sense





download - 2020-05-27T212406.142

Code (click for variations):

Feelings: cracked, movement, unstable, trying to hold together





download - 2020-05-27T195640.631

Code (click for variations):

Feelings: overwhelming, pattern finding, lost, dizzy



Screen Shot 2563-05-28 at 10.10.38


Feelings (very different for each variation): 1 watching it fall, 2 chasing, 3 holding tight in position while the other falls, 4 falling together


Other experiments: having done a few copies I tried my own. Here I tried to visualise the feeling of a tight fit that is almost perfect. And the two squares trying to fit together.

This may have been better if the square was actually different from the hole?

More favorites:

Screen Shot 2563-05-27 at 21.40.51

Relationship between the left and right side? What if these were off slightly?

Screen Shot 2563-05-27 at 21.42.56

Very right. Different levels of tightness gives different feelings? Left: rigid, fitted, can’t move, perfect. Middle: calculated rightness, structural integrity. Right: breathable, crunched. (are these all just relative?)

Screen Shot 2563-05-27 at 21.52.58

How to create this sense of depth in 2D?

Screen Shot 2563-05-27 at 21.57.08

Perfect overlaps. Unexpected blend? The high contrast makes me more dramatic. I got started on this last one but realised it needed to be drawn with points for the perfect overlaps. How does blend mode work?


Computer Grass is Natural Grass:

Sentences from reading:

  • It may take a life-time to develop a computer program to make one new communicating pen line which is meaningful for us.
  • What my hand-eye draws is different from what the computer draws. A computer helps by offering new visual ideas. These ideas in turn enrich new hand work which generates additional ideas which extends my thinking about computer generated lines.
  • That it is possible to use mathematical formalism and pure geometry while attempting a humanistic exploration to us is one of the primary advantages of the use of the computer as a drawing medium.

1234, Tuning-In


“Music is the pleasure the human mind experiences from counting without being aware that it is counting.” Gottfried Leibniz

Peeling apart the layers between our sensorial experiences and our cognition.

Working with numbers I started being interested in the act of counting. It is one of the most basic forms of structure we take for granted. Did you know children have to learn to count in one to one correspondence? As if it isn’t obvious that counting is one to one.

1234 is an installation which asks people to count together. It is about deep listening.

So how does it work?

There are two groups: L and R, everybody is connected to the same sketch


The interface looks like this.

Screen Shot 2563-05-06 at 06.41.38.png

They can’t see each other’s screen. But they can hear each other. One ear Group A, the other ear Group B (optimised for maximum confusion).

Demo video (STEREO):

Last notes on fabrication (MAKE 8)

Milling to every bit of material I had on hand


Able to fit in threaded inserts with a little bit of super glue and sanding. I adjusted the holes to be closer to the middle, leaving more room for the edges.


Everything came together in the end!


I then assigned each participant a specific channel for the experience.


Delivered to people by foot (great break, great fun interacting with physical humans, even from a distance).


And the time is here!

Screen Shot 2563-05-06 at 06.53.34 copy.png


Screen Shot 2563-05-06 at 06.55.48.png

(tease) 0:00 – 1:05 // (end) 2:10 – END

This is after 5 tries:

It is about the interaction, do you choose to lead? Follow? Create a unison? Counterpoint? 

People usually stop when there is a distinct pattern of rhythm.

The response “Visceral, the stereo setup makes it very disorienting, you don’t know whose is whose, it’s restrained which amplifies the satisfaction when a pattern appears.”


masstuningArtboard 2.JPG

Thank you Ada, Wenjing, Louise, Jake, Matt, Noah, Arnab

More on slides: