Kelly Chen

A UI/UX Developer who combines the technical aspect of coding with the creativity of design. Passionate in designing and coding websites and games.


Projects

The LIberry Website

- July 2025 -

Solo UI/UX Designer for a start-up company. Created a lo-fi and hi-fi prototype with Figma for an online library to help parents. The prototype is transferred over to WIX and coded using Velo and WIX IDE.

Shape it! Game

- February 2022 -

Won Best Education and UI/UX

Solo UI/UX designer and illustrator for a computer vision educational game created using PyGame. Uses OpenCV and NumPy in Canny Edge to detect the number of edges to determine different shapes. All assets of the game are designed using Procreate.

Arkhe Webpage

- MAY 2023 -

UI/UX designer and developer for the ARKHE webpage. Worked in a small team of four using Scrum and Figma to create a webpage for an RIT art installation. Helped to implement an interactive and responsive project carousel and image gallery.

StarCast Fishing Webgame

- April 2024 -

DESKTOP ONLY
Solo developer and illustrator for a web game created using Unity in C#. Created physics code for different types of forces (flee, seek, wander, and avoid) that control players' (ships) and objects' (fishes) movements. Game assets are designed using Procreate.

Kingdom of Doors Webgame

- March 2023 -

DESKTOP ONLY
Solo developer for a platformer web game created using HTML, CSS, and JavaScript. Used tile.js and parsed JSON to map out different tiles.

RIT Webpage Replica

- December 2024 -

Solo developer for the replica of the RIT webpage. It is created using the framework Vite, React.js, HTML/CSS. Used Modern UI for React components and fetches data from the RIT course online API.

Kawaii Collection Game

- June 2025 -

Developer and UI/UX designer for a VR game built in Unity (C#) that uses MediaPipe to detect hand signs, movement, and location. Tracks player's hand and allow the player to pick up items in-game and move/throw them around. Created by a small team of 8 students.

Successibility Add-on

- February 2024 -

Won Best Adobe add-on and best Education awards

Developer and illustrator for Adobe Express add-on. It is created within 24 hours using Adobe SDK, JavaScript, HTML, and CSS. Implemented retrieving information from the canvas using Adobe SDK to be parsed.


The LIberry Website


Goal: Design a website to support first-time parents in gathering information
Role: Solo UI/UX Designer

Intro:

Shape IT!


Goal: Create an educational app that teaches children about different shapes in a fun, creative, and accessible wayRole: UI/UX Designer + DeveloperDuration: 24 HoursTools: Figma, PyGame, Procreate, OpenCV

Users: Parents of children aged 2–5 who are concerned about their child’s cognitive development.Each year, an estimated 260 million children are denied access to fundamental education, limiting early development opportunities. In 2024, UNESCO reports that approximately 244 million children and youth globally are out of school due to conflict, poverty, or exclusion.Solution: Use computer vision to help parents support young children in learning and identifying shapes through play.

How Might We Integrate Shape It! into Children’s Education?

Helping children gain easy access to fundamental education through interactive learning.

Research shows that interactive learning helps children learn faster by enhancing engagement, comprehension, and retention. Students who participate in interactive activities retain up to 60% more information compared to passive learning methods. In addition, other studies show that e-learning can accelerate educational progress by 25-60%..Shape It! is an AI-guided educational app that uses machine learning to help children explore and learn shapes through hands-on interaction. Usage of digital tools allows for real-time feedback and a flexible learning environment.

issues faced

It is challenging to keep young children engaged without them quickly losing interest.

To address young children’s short attention spans, we introduced two gameplay modes. Practice Mode allows children to casually learn about shapes, giving them the freedom to explore and make mistakes without pressure. While in Challenge Mode, children can test their shape recognition skills under a timer, with a scoring system that tracks high scores for added motivation. Giving children a goal and a sense of purpose inspires them to push their limits and learn more in the process..In addition, we created an original mascot, Tessy the tesseract, to further appeal to children. The use of cartoon-style animations and playful actions creates a lively and enjoyable experience for young learners. Using a colorful color palette, along with complementary colors, helps capture the young children's attention..Because we had a 24-hour limit to code and design a functional app, we were limited to how much we could include in our final product. We plan on expanding our game by adding more than just shapes for a variety of learning materials. This includes adding colors, alphabet, and math equations.

Hoppy Hands


The power of guiding this frog is in your hands

Hoppy Hands is a 2D scrolling computer vision game that allows the player to use hand gestures as controls for the game. It is created using Python, OpenCV, and MediaPipe. The player plays as a frog traveling through lillypads while avoiding incoming obstacles to compete for a new high score.This game is created within 24 hours by my group (4 RIT students) during the Hackathon ‘WicHacks ‘23’ and won the best game award. We took inspiration from the offline dinosaur chrome game while waiting for the internet. I mainly worked on designing and finalizing the art pieces of this game from the start/end screen and tutorial illustration to the looping background, character (frog), and obstacles.

Successibility


Adobe Express Add-on

Successibility is an Adobe Express Add-on created to help guide people on creating accessible designs. It allows users to compare the main colors on their design to see if it is accessible for color blind people. This is created with Adobe Express API and SDK.This Add-on is created within 24 hours by my group (4 RIT students) during the Hackathon BrickHack X. It has won best Education and Most Creative Adobe Express Add-On hack. I worked on figuring out the code to grab the canvas on the website to allow for the comparison and formatted some of the web design using HTML and CSS. I also drew the app icon using procreate for pixel art and linearity for vector art.

Kingdom of doors


A castle full of Endless doors

Kingdom of Doors is a 2D platformer game I created using .I followed a tutorial by Chris Course and added my spin to it by coding an enemy class to implement enemies for players to jump over.The artwork and assets are not created by me.

Arkhe


Webpage for an art Installation at RIT

Arkhe is an art installation project created by RIT professors. I worked on this project with a small team during summer of 2023 to help build and launch a responsive webpage for this event. The team held daily meetings and used Scrum methodology to collaborate. Using a wireframe that is given to me, I helped block out a mock website with HTML and CSS flexboxes for test runs.We used bootstrap to help build a carousel to display the different projects in this event. One of the main parts that I worked on was implementing a zoom system for the images in the gallery. I also worked on a creating hamburger menu for the site which ended up being remove due to it not being as useful for a webpage.Our next steps is to add another webpage to this site which includes using three.js to create an interactive room that allows the user to explore the art installation online.

2D Game art

Character Design

Game Screens

Game Assets

Animations

Illustrations/Fanart

Kingdom of Doors: A webgl platformer that is created with javascript and html
Link to web game
Link to github

Weather Forecast: Using an API that grab forecast weather for a location when provided a latitude and longitude
Link to website

Online Order for Cafe:
Link to Website

About Me

Email: [email protected]
Phone: 646-881-0079

Hello! My name is Kelly and I graduated Rochester Institute of Technology '25 with a BS in Game Design and Development. I'm a UI/UX developer passionate about designing mockups with Figma, WIX, WordPress, and coding webpages and websites using frameworks (Next.js, Vite, Angular) and JS libraries (React.js, Alpine.js, Three.js). I enjoy experimenting with various creative ways to improve interactions between users and web elements.Outside of coding, I enjoy spending my free time on creative pursuits, including illustration, character design, and writing stories.