Miscellaneous<!-- --> | Ray Hsiao
Ray Hsiao // Game Designer & Engineer

Miscellaneous

Here's some other stuff I've done and want to share! You can also check out my itch.io page.

A gif of a clicker game featuring a large radish to click on. The buyable upgrades include cat farmer, farmer, taffy, Charlie the parrot, almond, lobster, and Powell cat.

raddish clicker!

This clicker game was developed as our extra feature for Computer Science 130: Software Engineering, with three other students. This version I have online is mostly meant to demonstrate my contributions to the frontend and is disconnected from the backend. I designed the game elements, designed and implemented the webpage, and drew the art assets.

Timeline: May - June 2024 (1.5 weeks)

Tools: JavaScript, HTML/CSS, MediBang Paint

Run it in your browser on this webpage. The frontend display branch can be seen here on GitHub.

This gif swaps between several photos. They include a wooden character piece of a yellow gecko sitting on a tree wearing a purple wizard hat. The gecko, dubbed Fizz Buzz the Wizard Lizard, has an associated character card and character information sheet, along with cards and tracker tokens.

Fizz Buzz the Wizard Lizard

A character with abilities designed for a group board game, developed solo for Design | Media Arts 157: Game Design at UCLA, taught by Professor Sam Malabre and TA TJ Shin.

This gecko thinks he's gifted with magical powers. Nobody has the heart to tell him the truth of his mundanity, so they play along with his antics. When Fizz Buzz falls below an energy threshold, he loses his wizard hat, and with it, the ability to cast spells (wizard cards). Fizz Buzz's spell cost can be decreased if there are character adjacent to him (believers) helping to convince him of his wizardry. The energy, believer, and threshold tokens are placed on the character sheet to track their respective quantities. The wizard hat can be removed from the character piece to show that Fizz Buzz can't cast spells.

Timeline: January - February 2024 (3 weeks)

Tools: Adobe Illustrator, physical fabrication techniques (laser cut, glued, and painted wood)

Class documentation page.

This gif swaps between several photos of a board game. This board game is made up of 4 staircases, colored red, blue, yellow, and green, that converge to a white platform. The character pieces placed on the staircase are students carrying plates, and there are clay tokens of different shapes on their plates.

Much on My Plate

This board game project was developed solo for Design | Media Arts 157: Game Design at UCLA, taught by Professor Sam Malabre and TA TJ Shin. Additionally, Professor Eddo Stern advised me on the project as part of Design | Media Arts 199: Directed Research.

Much on My Plate is drawn from my own experiences as a student struggling to balance everything I need to do and entering a positive feedback loop of feeling more and more overwhelmed and stressed. Players accumulate tokens on their character piece's plate and are punished for losing tokens by gaining more stress tokens. Sometimes, I actively choose to make tradeoffs (such as choosing to work on this project instead of picking up my medication), but other times, it feels like my mental state prevents me from making the choice I want (like when I feel too stressed to eat). To communicate this, some cards provide the player a choice while others have their effects determined by the player's number of tokens. Player points are determined by the number of tokens they have, but players must attempt a final challenge of placing their pieces on a springy step before the game concludes, which is meant to punish players who have too much on their plate.

I fabricated all of the physical elements of the projects. I spent a lot of time building staircases, painting, and making the paper spring for the middle platform.

Timeline: February - March 2024 (3 weeks)

Tools: Adobe Illustrator, Adobe InDesign, physical fabrication techniques (laser cut, painted, and glued wood; painted cardboard box; crafted paper spring and boxes; molded and painted clay tokens)

Class documentation page. This project was temporarily transformed into an art piece representing becoming completely overwhelmed: I Give Up

This gif moves around in a pink, cloudy world. There is a blob-shaped tree 3D model and a 2D animation of a sleeping leopard on a cloud. As the camera moves closer to the leopard, it becomes startled, changing its animation to be alert and clouds forming around its spots. The camera moves away from the leopard.

Nebulosus Reverie

A VR experience in which you explore a dreamy world full of sleeping animals, developed solo with music by Alvin Liu, my friend and creative collaborator. This project was developed for Design | Media Arts 172: Virtual Reality and Worldbuilding at UCLA, taught by Professor Jenna Caravello and TA Antigoni Tsagkaropoulou.

Timeline: Jan - March 2024 (10 weeks)

Tools: Unity 3D, Visual Studio Code (C#), Git/Github, MediBang Paint, Blender, Figma

Play the game on itch.io and check out the GitHub repo! The project is configured for HTC Vive and Oculus, but I also uploaded WebGL, Windows, and Mac builds using a first-person controller to make the project more accessible.

A gif of a frog jumping on a mushroom in an environment of red mushrooms and frogs. It zooms in on the frog, then zooms out to see a corgi is running circles around the frog.

Corgo in Wonderland

This animation was developed for Computer Science 174C: Computer Animation, taught by Professor Demetri Terzopoulos and TA Zhi Li, with three other students.

Timeline: February - March 2024 (5 weeks)

Tools: JavaScript, WebGL, tiny-graphics.js

Run it in your browser on this webpage (sound on!) and check out the GitHub repo! The README has a breakdown of who did what work in the project.

A gif of two Beyblades spinning around on a marble platform with a background of spinning fire.

Beyblades

This Beyblades simulation was developed for Computer Science 174A: Introduction to Computer Graphics, taught by Professor Ashish Law and TA Chenda Duan, with two other students.

Timeline: March 2023 (2.5 weeks)

Tools: JavaScript, WebGL, tiny-graphics.js

Run it in your browser on this webpage (sound on!) and check out the GitHub repo!

A gif that swaps between three frames. The first frame is a digital illustration of an Alolan Exeggutor designed as a Monster Hunter monster, formatted like a page out of a book. The second is a digital painting of a Flareon curled around a Torchic, sleeping on a pile of blankets. There is a heart made of fire above them. The final frame contains 3 digital drawings in a polygonal style. The one on the left is a shiny Rayquaza on a black background. The one on the top right is a Krokorok with sunglasses, arms crossed under the desert sun. The one on the bottom right is an Empoleon pointing at the viewer with a wing, with a background of geometric ice shapes.

radishark art

I have fun making art that I post under radishark art (Instagram:@radishark_art, previously @raddishradish). I post pretty sporadically, but I mostly create fanart in the form of digital illustration. More recently, I've been trying to do simple animations and also molding air dry clay!

Timeline: December 2018 - present

Tools: Adobe Photoshop or MediBang Paint for digital illustration