Touch Me (Not)
Interactive webpage
2022
Javascrip, HTML, CSS, WebSocket, Node.js
Touch Me (Not) is a communal experience hosted on a webpage. Here, visitors will encounter and communicate with one another through the simple act of typing, as usual.
However, instead of reading textual digits word by word, you are presented with the transcription of typing as a movement from the other side.
Rather than plain text, feelings and emotions are delivered onto the screen, while mirroring your own typing fingers.
Concept
While the eyes are fixed on the screen where letters pop up, the expression is exported via the taps of fingertips. An ambiguous intimacy lingers between the tangibility of the substantial keyboard and the non-physical communication of two minds. Words are present beyond pixel-formed text. We read each other and ourselves in an intimate silence where language resides in our touch.
"Touch Me (Not)" extracts the sense of touch as a form of expression in digital communication to examine the machine as a physical agency of intimacy that silently partakes in the way we connect.
Development
This project was initially inspired by the indicator bubble in iMessage that indicates "someone is typing". It looks like this:
a dialogue;
a monologue;
a mirror;
the unseen words;
…
Linguists refer to instances like this as "awareness indicators." While the typing awareness indicator commonly evokes a sense of anxiety in real-time messaging, it undoubtedly serves to pace our written conversation.
My interest lies in the subtext during our screen-based written communication, especially in real-time. However, I don't mean the textual information like emojis and the novel use of punctuation; rather, I want to focus on pace, which essentially resides in our typing movement and physical contact with the keyboard.
In such cases, pace is multifaceted. It encompasses personalities, emotions, tone of speech, and typing habits. In a nutshell, it illustrates a character who is unique, vivid, and present, connecting us with the other side through a translated body language.
However, these layers are not present in typing awareness indicators, which function as a toggle between two modes: typing and not typing. This binary mechanism is not enough to translate a spectrum of body movements.
So why don't I expand on this indicator?
To expand from a binary mechanism, I increased its options by bringing all keys to awareness, instead of summerizing them as a unity. At this point, I am essentially displaying the live input of each key being pressed.
I prototyped this idea by juxtaposing a video of hands typing on keyboard (playing on screen) with my real keyboard to explore a non-reciprocated sense of touch.
However, the hands attract too much unnecessary attention as they easily associate a specific identity behind the screen, deviating from the subtlety I tend to achieve. Additionally, in an interactive context with the hands are present in the image, the discontinuity between each letter when triggered can make the visual appear unnatural and disassociative.
If not viewing from "above," why not from the "bottom"?
The soft texture of the "keyboard skin" under my fingers inspired me. The keyboard skin is, in fact, a silicone-based dustproof protector for keyboards. Its material is semi-translucent, allowing each tap on it to be visible from the bottom. Visually, the direct transcription of the tactile contact also creates a sensorial illusion and intimacy.
Alphabet from Touch Me (Not)
As I lay out the alphabet, it became clearer to me that the pace has now embodied as an illusion of tactile impression but transmitted from a real touch.
To enhance this sense, I combined the visitor's keyboard input with the other one's input onto the same keyboard. The intention is to build an intuitive inertia for the visitor by having the keys on the screen respond to their own keyboard interaction. In this case, when the other person's input comes in, the visitor will be confused by it, thinking it's their own. However, this confusion will then lead to curiosity about the other side.
Workflow
When a visitor enters the webpage, they will be greeted with a keyboard on the screen and a brief instruction to get started.
The upside-down keyboard on the screen indicates a potential interlocutor who is on the other side of the screen, opposite to the visitor's first-person perspective.
The keyboard will display the finger tap impression of the key being pressed by either the visitor or the interlocutor.
I divert attention from the received textual message because I want visitors to focus on non-verbal language.
However, to prevent the visitor from confusion and to indicate the presence of another real-time interlocutor, I turned the browser tab into a message box to display the textual message and a typical typing awareness indicator. When one is typing or sends a message, the other's tab will display the corresponding state via the streaming of websocket. In addition to this indication, I also assigned different tapping sounds for self and the other's keyboard input.
However, the protagonist is still the tactile illusion.
Touch Me (Not) also presents itself as an interactive installation. It was on view at the Wuhan Biennale 2022 and BAProject.
Touch Me (Not)
Video Installation
12.35 x 8.62 x 0.71 in
Macbook Pro 13', projector, Madmapper
In the installation form, the typing imprint of the keyboard from the other side is projected onto the visitor's physical keyboard, overlaying digital fingertaps onto the visitor and their keys.
