interactive art, webgl experiment, tone.js project, human body visualization, generative sound art, digital empathy, experimental web experience
BehanceYoutubePinterestInstagramDribbleFacebook
ServicesWorksAboutContact

Why Should You Care – An Interactive Audio-Visual Reflection on Human Fragility

Why Should You Care is an interactive digital artwork where human forms and trees merge into fragile silhouettes suspended in space. Built with Three.js and Tone.js, the piece invites you to click and drag body parts, generating both sound and text — a randomized constellation of ailments that appear and fade away. As the animation unfolds, fragments of the human body detach, float, and recombine — echoing our own physical and psychological disconnection. The experience concludes with a simple but piercing question: “Why should you care?” This work explores the tension between body, data, and empathy — transforming code into a meditative environment about vulnerability, care, and attention. This is an interactive, symbolic web art application created with Three.js for 3D graphics and Tone.js for audio. Initial State: It starts with a black screen and a simple message: "Click to Start Audio and Animation". Main Experience: Once started, the application presents an endless, 3D fly-through experience. The user travels through a dark space filled with 20 minimalist, stick-figure-like silhouettes that resemble a cross between a human and a tree. An ambient, low-pitched drone sound plays in the background, creating a contemplative atmosphere. The experience is timed to last for 30 seconds. Ending Sequence: After 30 seconds, the animation automatically stops and the 3D scene fades to black. It is replaced by a final message on a white background that asks, "WHY SHOULD YOU CARE?". Shortly after, a list of medical ailments, which were generated by the user's actions, fades in on the screen one by one. What the User Does The user's interaction is central to the application's theme. Initiation: The user begins the experience by clicking the start message. Interaction: During the 30-second animation, the user can interact with the silhouettes using their mouse: Hover: Moving the mouse over a body part (head, arm, leg, branch) highlights it in grey and plays a soft, musical note. Detach Parts: The main interaction is to click and drag any part of a silhouette. When a user "pulls off" a body part, two things happen: A distinct "pop" sound is played. A random medical ailment corresponding to that body part (e.g., "Sciatica" for a leg, "Migraine" for a head, "Tendonitis" for an arm) briefly appears in a random location on the screen and then fades away. Rebuild and Modify: The user can drag the detached part and attach it to the trunk of another figure, creating new, hybrid silhouettes. An "attach" sound confirms the action. If the part is released in empty space, it simply floats on its own. Essentially, the user's act of dismembering and reassembling the abstract figures directly generates the list of concrete human ailments that are revealed at the end, creating a link between the interactive experience and the final question.

Explore Why Should You Care, an interactive WebGL experience merging art, sound, and anatomy. Detach human-tree figures, reveal ailments, and face a haunting question: Why should you care?

No items found.

Why Should You Care is an interactive digital artwork where human forms and trees merge into fragile silhouettes suspended in space. Built with Three.js and Tone.js, the piece invites you to click and drag body parts, generating both sound and text — a randomized constellation of ailments that appear and fade away. As the animation unfolds, fragments of the human body detach, float, and recombine — echoing our own physical and psychological disconnection. The experience concludes with a simple but piercing question: “Why should you care?” This work explores the tension between body, data, and empathy — transforming code into a meditative environment about vulnerability, care, and attention. This is an interactive, symbolic web art application created with Three.js for 3D graphics and Tone.js for audio. Initial State: It starts with a black screen and a simple message: "Click to Start Audio and Animation". Main Experience: Once started, the application presents an endless, 3D fly-through experience. The user travels through a dark space filled with 20 minimalist, stick-figure-like silhouettes that resemble a cross between a human and a tree. An ambient, low-pitched drone sound plays in the background, creating a contemplative atmosphere. The experience is timed to last for 30 seconds. Ending Sequence: After 30 seconds, the animation automatically stops and the 3D scene fades to black. It is replaced by a final message on a white background that asks, "WHY SHOULD YOU CARE?". Shortly after, a list of medical ailments, which were generated by the user's actions, fades in on the screen one by one. What the User Does The user's interaction is central to the application's theme. Initiation: The user begins the experience by clicking the start message. Interaction: During the 30-second animation, the user can interact with the silhouettes using their mouse: Hover: Moving the mouse over a body part (head, arm, leg, branch) highlights it in grey and plays a soft, musical note. Detach Parts: The main interaction is to click and drag any part of a silhouette. When a user "pulls off" a body part, two things happen: A distinct "pop" sound is played. A random medical ailment corresponding to that body part (e.g., "Sciatica" for a leg, "Migraine" for a head, "Tendonitis" for an arm) briefly appears in a random location on the screen and then fades away. Rebuild and Modify: The user can drag the detached part and attach it to the trunk of another figure, creating new, hybrid silhouettes. An "attach" sound confirms the action. If the part is released in empty space, it simply floats on its own. Essentially, the user's act of dismembering and reassembling the abstract figures directly generates the list of concrete human ailments that are revealed at the end, creating a link between the interactive experience and the final question.

interactive art, webgl experiment, tone.js project, human body visualization, generative sound art, digital empathy, experimental web experience

Download App here/

Why Should You Care – An Interactive Audio-Visual Reflection on Human Fragility