Tired of my previous website design, I built version 2.0! I wanted to include more playfulness to the front-end and have the aesthetic reflect my personality more.

A web application used to conduct research in fields of linguistics and cognitive psychology with high school students and freshman college students. It features a content management system that includes web forms to create web pages, upload content, add surveys, hyperlinks and forum discussion boards.

An interactive map that visualizes the New York Department of Sanitation's [DSNY] public trash bins across all 5 boroughs. Frustated by the amount of litter on NYC streets, I wanted to create a tool to help me locate the nearest trash bin.

A multiplayer game server that allows users to play tic-tac-toe with anyone online anonymously. It is built to support over 3 million simultaneous online game rooms. The personal goal of the project is to explore web sockets and backend development with APIs.

A web app that allows users to become their own dancing pumpkin character by using ml5.js Posenet model to detect your body from your webcam and move the character on the canvas. The character scales according to the distance between the user and the camera by measuring the distance between the user's eyes. I reduced the noise introduced by the webcam by linear interpolation of the key points. Therefore, there is a slight lag in the responsiveness in order to make the movements look more smooth.

Generative Art is a website and tool that allows users to generate art out of text. Each image that is produced is unique and irreproducible. To begin, users enter sentences or words on the text box on the right. As users type new letters, new shapes are drawn on the canvas. When the user is done typing, they have the option to clear the canvas or save the resulting image by clicking the appropriate buttons. There is also the option to customize the colors of the background and the shapes that are drawn. The default background color is black and the default shape is white.

In this sketch, I created a happy, girl character with flowing hair. When you click and drag your mouse over the head from side to side, you can control the tilt of the character’s head. Each strand of hair acts as a pendulum swinging back and forth until it is at rest. I created multiple strands of hair by building a Hair class and instantiating multiple objects. To add a whimsical touch, I made the facial expression change while you are tilting the character’s head.

I made a 4-tone mirror that uses your webcam and varying text symbols as pixels! For best results, make sure you have bright lighting and a light background.

Life in Color is a composition of 6 projects where I use the same color palette. ZigZag is a program that utilizes algorithmic design. It randomly draws lines on the canvas and keeps looping forever. Over time, the canvas becomes more and more dense with lines.

Life in Color is a composition of 6 projects where I use the same color palette. Friendly Caterpillar is a program where the user controls a caterpillar on the screen. The caterpillar follows the mouse cursor around the screen. When the user clicks down on the mouse, it munches on the leaves in the background.

Life in Color is a composition of 6 projects where I use the same color palette. Scrambled Letters is a program that allows the user to type into the canvas by using their keyboard. The program creates an illusion that the letters are falling onto the screen and piling up as more keys are typed. When the user clicks on the screen with their mouse, the existing letters are erased from the screen.

Life in Color is a composition of 6 projects where I use the same color palette. Foliage is a program that is designed to resemble a collection of leaves in an abstract way while also implementing algorithmic design. As the user clicks on the canvas with their mouse, more circles randomly appear on the screen.

Life in Color is a composition of 6 projects where I use the same color palette. Spotlight is a program that encourages the user to explore the canvas. It starts out with a spotlight and a message that reads “Look Around!” The spotlight moves along your cursor as you navigate the canvas. Once you find a word, it appears on the screen. Once all the words are located, the program reads “Discover Yourself. Don’t be afraid to explore!”

Life in Color is a composition of 6 projects where I use the same color palette. Hollow is a program that uses 3-D shapes to create an abstract moving image. There are floating torus shapes that are rotating on various axises. The user can move their cursor to orient the light in the space as well as drag/zoom around the environment.