New
Art
City
Virtual Art Space
Help icon

Catalog view is the alternative 2D representation of our 3D virtual art space. This page is friendly to assistive technologies and does not include decorative elements used in the 3D gallery.

Catalog:

SoftErr-400

USC Media Arts + Practice IML400 Fall21 Opened December 17th, 2021 View 3D Gallery
Poster image for SoftErr-400

Statement:

Artist: Kyle Ang, Rane Bieker, Katie Liu, Angela Rong, Myrah Sarwar, Jonathan Tolentino, Angie Yang, Annie Zheng

↓ Curatorial statement co-written by Angela Rong and Qianqian Ye ↓

Softness could be a cloud / ephemeral form
Softness could be a dune / morphing landscape

Softness could be the rounded corner of buttons
Softness could be the gradient background on the screens
Softness could be the almost illegible font
Softness could be the tactility when petting the keyboard and mouse
Softness could be the dizzy comfort of welcoming red error messages

Softness could be the fuzzy edge of unknown feelings
Softness could be subtle frustration of wanting more
Softness could be a polite refusal of the right way
Softness could be the brave moment of oversharing
Softness could be the sudden zero-g after admitting your fear
Softness could be a safe place to land
Softness could be the hands that are there to catch us

Can software be … soft?

Softness can seem like an elusive quality in technology, a frivolous whisper in a gallery of glass screens. We want to know comfort, yet also fear being vulnerable in our moments of rest. But how might softness be more than just a temporary respite? As we mix and blur together lines of code, how might we reawaken, relaxed, to new possibilities of living, sleeping, and dreaming?

This exhibition invites visitors to experience the web-based artworks of artists and coders in USC Media Arts + Practice’s IML 300 and 400 classes, as we look beyond the sterile finality of definitions and labels. Cocooned inside brackets, braces, and parentheses, SoftErr is a group exhibition that resonates with the warm, welcoming embrace of our communities -- both digital and in-person. Out of focus, eye to eye, we emerge from the heady fog of coding, cradling our projects of being and becoming. We hope that SoftErr shines a light on the pearl that is your existence and envelopes you in the glowing presence of many. Rest your head for a while; we're making software soft. Let's err on the softer side, softly.

Instructor: Qianqian Ye
Student Assistant: Jay Borgwardt

Music credit: Harvey Moon

3D Environment Description:

A dark soft dune.

Artworks in this space:

Annie's Cybernetic Garden

Annie Zheng

My take on a cybernetic garden! Rearrange the images to create your "digital face". Find the Magic 8 ball that will tell you your fate.

Link to Cybernetic Garden

Handraw

Rane Bieker

Handraw, the website where you draw with your hand! Made using p5.js and ml5.js. Use different hand poses to draw, erase, or change colors! The tracking is pretty bad, though.

Handraw

Blow a Kiss

Katie Liu

Blow a kiss and say something! I trained two different poses and coded the canvas using p5.js.

Link to Blow a Kiss

please dont touch me

Katie Liu

Created on p5.js, this poster seeks to evoke discussions surrounding sexual assault. The words "Please Don't Touch Me" are displayed with two animations. When researching the phrase, I realized it was associated a lot with internet "meme" culture and I wanted to bring attention to the phrase and its relationship to sexual assault. I also read the experience with the phrase from April, a sexual assault survivor, and whose quote I used in my poster from the article she wrote. The first animation is on the word "touch." Touch is scrolling from right to left but never touches me. "Me" changes size from small and large. When deciding what size to make "me," I both thought me should be small because for victims of sexual assault the situation can make one feel small. However, it is also big because when a situation like that occurs, one's feelings and experiences are the most important. It is also pulsing like a heart.

Link

red scare/sinophobia

Angela Rong

I wanted to make a poster that captured how the Red Scare never disappeared -- it persists and continues to mutate in the form of sinophobia. Interested in the aesthetics of newsprint and broadcast television, I chose a font that simulated the block font of breaking headlines, which can dilute entire histories into sensationalist headlines. I also implemented a background of shifting letters that respond to mouse interaction. Pausing the poster only allows the words to multiply in number, suggesting that Western journalism does not care for material analysis, but ultimately serves the ruling imperialist class to manufacture consent for war.

p5.js sketch

myrah's cybernetic garden

Myrah Sarwar

A digital archive delving into my personal growth and relationship with the internet. The user is able to move through three different phases and drag around the elements on the page.

go to project

Slitscan

Rane Bieker

A slitscan p5.js sketch. I think this is the funniest thing I've ever made, and I've spent a lot of time fooling around with it.

Slitscan

Customize Your Face!

Annie Zheng

This camera filter allows you to customize the emojis on your eyes, nose, and ears. Play around and have fun!

Link to Customize Your Face

Cybernetic Garden

Rane Bieker

My website inspired by "All Watched Over By Machines Of Loving Grace." My idea was a robot eden with AI gods. And what do you do with gods? You pray. Think of it like a magic 8-ball type of website.

Otomania's rereleased version of "Ievan Polkka" is playinig.

Cybernetic Garden

Launchpage

Rane Bieker

My launch page. A pretty true representation of my aesthetics. Background video is a Project Diva: Arcade PV feature a model I modded.

Hachiouji-P's "Sweet Devil" is playing.

Launchpage

Wonky Slit Scan

Annie Zheng

Manipulate various slit scans of yourself that run at the same time! Move your mouse up and down or side to side on various parts of the screen to see what changes!

Link to Wonky Slit Scan

Digital Care Website

Rane Bieker

A website expressing my personal idea of digital care: calming background, funny music to cheer you up, and a chatbox where messages disappear and everyone is anonymous.

Digital Care

Spoken Modified Snake Game

Annie Zheng

This is a p5.js sketch that is controlled by the voice commands "up, down, right, left, clear." Move the line through the blocks to change its color.

Link to Spoken Modified Snake Game

Slit Scan

Kyle Ang

this was really fun to mess around with. I found that the first slit scan rotates a little. Then I overlaid a second slit scan on top. The top one in front overlaid aims to capture the eyes of the person sitting on the webcam. I was supposed to make it horizontal, but for some reason it turned out like this instead. I set a variable for each slit scan (Slit Scan A and B) to create two of them. The Copy function still is a little confusing to me, even though I know it's supposed to be video (source), then x1, y1, width and height copying to the source of the video.

Link to Slit Scan
Slit Scan

Hate Is A Virus

Kyle Ang

//tutorial by Colorful Coding, How to make a flow field in p5.js As the year of 2020 broke through, we've faced a lot of racial violence, and especially within the Asian community. With the outbreak of the coronavirus, I wanted to take the phrase, "HATE IS A VIRUS," and use this animated poster to depict the way hate spreads through a flow field animation on p5.js. The more hate, the more we blur the picture of what our world needs to be. The more we spread hate, the more our communities suffer.

Link to Hate Is A Virus

Painting By Ear

Annie Zheng

A collective digital care space! Experience this with your friends by getting them to load the webpage at the same time! While you draw, you'll hear your own notes at the same time as your friend's notes. Try to duet them while painting something together!

Link to Painting By Ear

Multidraw Website

Rane Bieker

A website that uses node.js and socket.io for a multi-person drawing experience. Users will always see their own drawings as rainbow and other users' drawings as grey.

Link to website

Seeds From the Starving Mind

Annie Zheng

An experimental look at the artist's thoughts and experiences with body dysmorphia and related insecurities. The website has little to no instructions, so click around with your mouse or even raise your wrists to explore.

Link to Seeds From the Starving Mind

Camera Filter

Kyle Ang

this code takes the pixels of the video from your webcam and maps out a grid with the circles. It has two for loops that draw the circle and is interactive when you move in the x direction to make the circles smaller or larger, making the video clearer or more abstract. I learned better what the map function does with the start and stop bounds, and how the nested loops work for initiation, condition and incrementation. //tutorial and help came from Jeff Thompson

Link to Camera Filter

Posenet sketch

Rane Bieker

A p5.js sketch using PoseNet. It draws circles on every point of the skeleton, with size and color being determined by the music's amplitude.

"The Grave" by Black Tiger Sex Machine is playing.

Link to sketch

Cybernetic Garden

Kyle Ang

This Cybernetic Garden is an illustration of how I perceived and interpreted the poem, "All Watched Over By Machines of Loving Grace" by Richard Brautigan. I felt that there was a kind of ominous tone, and the idea of recreating the natural in the digital world is an interesting one, where the flowers here in the work are glitchy and flickering — not completely transparent, and truly imperfect. The idea of machines and organic matter such as us humans and our natural environment ever living in harmony is an interesting yet idealistic idea. This cybernetic garden depicts that feeling.

Link to Cybernetic Garden
Cybernetic Garden

Make A Wish

Kyle Ang

Make A Wish is inspired once again by radical digital care. Enter the scene to play with a shooting star cursor, and then make a wish. Once you make a wish, you can see if others are making a wish as well when you see trailing colors of shooting stars. Only your wish is visible to you — with the age-old idea of, "Don't say your wish out loud or else it won't come true!" I went along with that to inspire this work.

Make A Wish

Collaborative Drawing

Kyle Ang

Collaborate and draw with your friends using words. This is a creative and fun way to chat with others as a means of digital care. With technology becoming more controversial as a tool or as a weapon, the practice of digital care becomes apparently here in this fun little glitch.me site.

Link to Collaborative Drawing
Collaborative Drawing

PoseNet

Kyle Ang

I pretty much just played around with Coding Train's example. I wanted to add some interactivity so the colors of the points change depending on where the position of the mouse is. I added the lines that connect the dots because I think it adds more of the skeleton look, and I enjoyed just posing with it too and seeing how it tracked the parts of my body.

Link to sketch
PoseNet

Dance With Kandinsky

Kyle Ang

Often, when we use tech to express ourselves, the idea of motion is often overlooked. In this project inspired by Wassily Kandinsky's art, the use of body and motion are highlighted as a way to convey emotion and express sound. As a synesthete, (A person with synesthesia, a condition in which the normally separate senses are not separate. Sight may mingle with sound, taste with touch, etc. Other synesthetes hear colors.) Kandinsky's senses interwove sounds with shapes and colors. With hopes to give this experience to others with no synesthesia, I created this project to allow expression with both body movement and creating art with sound.

Link to Dance With Kandinsky

Dance with Kandinsky Landing Page

Kyle Ang

Often, when we use tech to express ourselves, the idea of motion is often overlooked. In this project inspired by Wassily Kandinsky's art, the use of body and motion are highlighted as a way to convey emotion and express sound. As a synesthete, (A person with synesthesia, a condition in which the normally separate senses are not separate. Sight may mingle with sound, taste with touch, etc. Other synesthetes hear colors.) Kandinsky's senses interwove sounds with shapes and colors. With hopes to give this experience to others with no synesthesia, I created this project to allow expression with both body movement and creating art with sound.

Link to Dance with Kandinsky

Gender Wage Gap Game

Katie Liu

Created by Katie Liu, "The Gender Wage Gap Game" seeks to be a game to provoke and teach viewers about the gender wage gap that exists in America. According to the 2019 Census Bureau data, women earned on average 82 cents for every $1 earned by men. This gap is even more significant for women of color.

Link to Gender Wage Gap Game

Cactus Garden

Katie Liu

Welcome to my cybernetic garden. Hover over the "yikes" to read some of my cringiest texts. Don't get poked by the cactus or the cringeworthy-ness of my texts.

Link to Cactus Garden
Cactus Garden

Cactus Garden: texts

Katie Liu

Part 2: Welcome to my cybernetic garden. Hover over the "yikes" to read some of my cringiest texts. Don't get poked by the cactus or the cringeworthy-ness of my texts.

Link to Cactus Garden
Cactus Garden: texts

Sing Together!

Katie Liu

Sing together with your friends! There are some classics on the left to inspire you or sing your own song. Try with another person! Your voice will make circles on your own screen and your friend(s) voice will make squares on your screen! Sing louder to make larger shapes!

Link to Sing Together

The Abstract Collective

Jonathan Tolentino

Create drawings using a generative pattern. You are able to upload your drawing as a saved "collective" using the power of Firebase.

The Abstract Collective

3D Riddle

Jonathan Tolentino

animated poster using WEBGL This p5.js "poster" uses WEBGL to create 3D shapes. The mouse turns the "camera" of the panel to reveal the answer to the riddle.

Cyber Garden

Angie Yang

My cyber garden with seeds made up of moments from my memory.

Cyber Garden

Collective Digital Care

Angie Yang

Make up the funniest stories with your friends depending on the emoji provided!

Collective Digital Care

Slit Scan

Angie Yang

One of a type scanner!

Slit Scan

Wilder

Angie Yang

This project is created based on a poem called Wilder by Rupi Kaur. It is short but powerful for it promotes self-love and encourages individuals to be confident about themselves. I love the words in this poem and decide to give it a special twist for users to read the poem through creative coding.

Wilder

door asset - Jonathan Tolentino

part of environment

A recursion of a dandelion

Jonathan Tolentino

Visual interactive poem that uses a recursion tree in p5.js to simulate a blown dandelion.

A portrait of you

Jonathan Tolentino

Experimental narrative using ml5.js, BodyPix. Based off a poem about self identity. The sketch uses the "frameRate(24);" script hence the choppy look; decided to keep it in. The BodyPix distorts from my code and delays the original outline of your body, leaving behind a silhouette of yourself.

Clockwise slit scan

Myrah Sarwar

p5.js sketch that overlaps and inverts two slit scans to create a final image.

view sketch

how i'm feeling

Myrah Sarwar

Interactive emotion visualizer that uses speech input and real-time hand detection.

go to project

storm of tears!

Myrah Sarwar

This face filter creates a rain cloud above your head with falling raindrops that double as teardrops.

open filter
storm of tears!

Collective Desktop

Myrah Sarwar

This multi-user experience explores collective digital care through the idea of a modern-day shared desktop. Invite your friends and play around as live customizations on one desktop affect all other active sessions!

go to project

a weekend outing

Angela Rong

A shareable weekend outing. Cooped up inside and wish you could hang out with your friend? Watch the weekend unfold together in this meditative, communal outing.

feet on grass, nature sounds.

go to site

a cybernetic community garden

Angela Rong

This website plays on the idea of a community garden -- computer desks replace individual plots of land. I solicited these photos from friends, with the idea of us still being connected via our computers despite physical distance. With the context of a community garden, we transform the narrative of individualized disparate screens into a new display of interconnectedness and community.

view project

searchlight, spotlight

Angela Rong

I was interested in creating a color viewfinder, as the camera filter itself is already an abstraction of form and color through noise. Move the cursor around to move the pixel viewfinder around. Play hide-and-seek, discover new parts of yourself.

p5.js sketch
searchlight, spotlight

your journal room

Angela Rong

for all its touted relaxation purposes, journaling can be hard. finding appropriate stationary, organizing your thoughts, the physical act of writing. your journal room removes those extra steps, utilizing your computer microphone to write down anything you have to say and think about the space you exist within. none of your words will be saved, unless you yourself would like to save a page. let your words flow in a stream of consciousness. there's power in speaking and submitting your thoughts to existence.

view project