Software Project Portfolio

Writing software is my passion. Building web applications, websites, tools, utilities, or artsy code sketches is what I do in my free time and want to do for my career as well. Here is a collection of the notable software projects that I've undertaken and published. The list isn't comprehensive and is always growing.


CSG.JS Rust + WebAssembly Port

Jul. 2024 - Aug. 2024

I ported the CSG.js Constructive Solid Geometry library created by Evan Wallace (github.com/evanw/csg.js) to Rust and integrated it with other mesh processing and manipulation code I use as part of my browser-based 3D projects. I experimented with performance improvements and other modifications to the library with the goal of producing manifold meshes with minimal triangle counts as output.

A screenshot of a mesh produced as the output of subtracting a torus from a cube.  There is a semi-circular gouge in one face of the sphere which appears to be smooth and seamlessly connected.  The mesh is shaded using `MeshNormalMaterial` from Three.JS which makes it appear in a variety of pastels depending on the angle between each point on its surface and the camera.

3D Mesh Deformation + Normal Calculation

May 2024 - Jun. 2024

I developed a code pipeline for subdividing 3D meshes, programmatically deforming + manipulating them, and computing accurate normals for both shading and displacement. This included a deep-dive into the Blender codebase to figure out how they computed normals for smooth-by-angle shading.

A side-by-side comparison of pre and post deformation versions of a scene rendered in Three.JS against a pure black background.  The scene consists of a gray rectangular platform with several geometric shapes hovering over it, colored with a gray stone or concrete-like material.  The left shows mostly rough and simple forms, while the right is much more organic-looking with lots of curves, warps, and shadows visible.

three-hex-tiling

Nov. 2023 - Nov. 2023

I created a library that extends built-in Three.JS materials to support infinite, non-repeating, seamless texture tiling. The hex tiling algorithm itself is ported from a Shadertoy by Fabrice Neyret and extended with my own changes to optimize performance and and customize the look of the tiling. The library can be added to almost any existing Three.JS project and includes several config options for the tiling.

Screenshot showing comparison between a repeating seamless texture with and without three-hex-tiling.  The image is divided in half horizontally by a gray bar.  The left side is labeled "baseline" and shows a gray rock-like texture that clearly repeats, resulting in an artificial grid-like pattern.  The right side has the same gray rock texture but without any visible tiling and is labeled three-hex-tiling.

3D Stone Level

Sept. 2023 - Oct. 2023

A 3D scene built in Three.JS which makes use of multiple other 3D projects I've worked on in the prior months: Volumetric fog, procedural LOD terrain, and decorations generated using geodesic paths. The scene itself features gray stone walls and terrain and has an objective where the player must collect totems hidden around the level to unlock the exit.

A screenshot of the cave level rendered with Three.JS.  It shows a large gray stone wall with a door in the bottom, illuminated by an eerie green light.  The player is standing on a shiny stone walkway/bridge which crosses over a depression in the terrain which is filled with blue volumetric fog.

Mesh Wrapping via Geodesic Paths

Oct. 2023 - Oct. 2023

I developed a system of generating and wrapping meshes around other meshes using geodesic paths. I compile the code for it (including both Rust and C++) into WebAssembly and use it to create procedurally generated decorations for my 3D scenes. I also created an accompanying blog post detailing the process and the math behind it.

A screenshot of a deformed torus rendered in Three.JS with an array of thin shiny metallic curlicues wrapping around part of it

LOD Terrain System for Three.JS

Sept. 2023 - Oct. 2023

A system for rendering large procedurally generated terrain in Three.JS efficiently. It splits the terrain up into segments and renders distant segments at a lower level of detail to speed up rendering. The system handles building 3D terrain from heightmaps generated on a web worker and textures provided by the user, making sure that segments render without gaps or seams as they're swapped in and out.

A screenshot of a debug view of the LOD terrain system.  It shows some procedurally generated terrain rendered as a wireframe with different colors representing different levels of detail.

Volumetric Fog Shader

Sept. 2023 - Sept. 2023

A relatively feature-rich volumetric fog shader for Three.JS. It raymarches a density field generated using noise functions, rendering dynamic fog in real time. It integrates into the pmndrs postprocessing system and has many configuration options. It uses analytical gradient-based techniques to implement lighting with dynamic light sources.

Screenshot of a scene rendered using Three.JS using the volumetric fog shader I developed.  The ground is made out of black rock and has hills in a checkerboard pattern. Gray-white fluffy fog is present in the low parts of the terrain, and there is a bright pink light shining on the fog's surface in one of the squares.  There is a stone wall surrounding the terrain, and the perspective of the scene is from on top of this wall.

3D Cave Level

Sept. 2023 - Sept. 2023

Part of my 3D work in Three.JS, this scene consists of a large cave and serves as a transition level. It was built using a mix of procedural and hand-made techniques for the cave, textures with triplanar mapping, and decorations consisting of stalagmites and stalactites. I also spent time making improvements to the base game engine like adding sound effects, a pause menu with settings, and a standardized postprocessing pipeline.

A screenshot of the cave level.  Shows a dark, narrow cave composed of gray striated rock.  There are large, prominent stalagmites and stalactites in the foreground.

3D Smoke Level

Aug. 2023 - Aug. 2023

A continuation of my 3D work with Three.JS. TSome highlights include heavy volumetric godrays and procedurally generated 3D Vicsek fractals (the large cubes visible in the screenshot). This scene served as a sort of warm-up project as I got back into 3D work after several months spent working on other things.

A screenshot of the smoke level.  Shows intense orange fog and godrays, floating fractal structures composed out of large dark cubes with stone-like texturing and patterns, and four orange/yellow lights glowing in the distance supported by long poles.

Bonsai Networks

May 2023 - Aug. 2023

I developed a method for training Bonsai Networks - extremely sparse computational graphs produced by training and pruning RNNs - using Tinygrad. They provide an interpretable view into the solutions learned by networks for simple logic problems, breaking out of the black box neural networks typically reside in. I wrote up a detailed blog post with several embedded interactive visualizations showing the networks in action.

A graph representation of a Bonsai Network showing the connectivity of neural network components that make it up, rendered with graphviz and colored corresponding to the current value passing through each node.

Sample Library Embedding Browser

Apr. 2023 - Apr. 2023

An experiment for generating embeddings from an audio sample library and a UI for visually exploring the sample library in 2D space. The samples processed with MFCC for feature extraction, the embeddings are generated using UMAP, and the UI is built with Svelte + D3.The tool is integrated into the sample library module of my web synth project.

A screenshot of the sample library embedding browser.  It shows a 2D scatter plot of the embeddings of a sample library.  The samples are colored by category as estimated by the sample name, and are roughly organized into clusters by color.  There is a label along the bottom of the embedding showing information about the hovered sample, which is from a Fox Stevenson sample pack.  There is a search bar at the top.

Signal Analyzer for Web Synth

Mar. 2023 - Apr. 2023

A combined spectrogram + oscilloscope module for my web-synth project. It integrates into web synth and can be used to analyze any signal. The visualizations are built using lots of cool modern web tech including SharedArrayBuffer, Atomics, OffscreenCanvas, Rust compiled to WebAssembly + Wasm SIMD, and more.

A screenshot of the signal analyzer module in web synth.  It shows a spectrogram rendered as a white line on top, and an oscilloscope rendered as a magenta line on the bottom.  The spectrogram shows a complex spectrum with lots of harmonics, tapering off into the higher frequencies. The oscilloscope shows a distorted supersaw waveform.

llama.cpp AVX-512 Support

Mar. 2023 - Mar. 2023

I added support for AVX-512 to the popular llama.cpp LLM project. This sped up inference by a bit on processors that support it. The work was quickly obsoleted by other optimizations to the rapidly evolving project, but it was a fun experience to contribute to that effort.

Wavetable Editor for Web Synth

Feb. 2023 - Mar. 2023

A small utility added to web synth to allow users to build their own wavetables by adding in harmonics individually. This builds on the existing wavetable support for the FM synth, allowing users to build their own wavetables in addition to importing them from files.

A screenshot of the web synth wavetable editor.  Shows many sliders to control adding in harmonics as well as controls to move through the wavetable and adjust playback.  There is a box on the top showing a relatively complex waveform rendered in red.

Web Synth Enhancements

Nov. 2022 - (current)

I picked active development of web synth back up with the goal of producing "real music" using the tool. I prioritized filling some gaps in features as well as polishing up the application as a whole. Some of what I worked on includes building an OTT-style multi-band compressor, a mixer UI with level visualization, revamping the MIDI editor to support multiple tracks, adding a welcome page, building a custom dynamic bandpass filter, moving MIDI scheduling to the audio thread, adding time-tracked automation tracks, and fixing tons of bugs.

Combined screenshots of the Web Synth application showing the graph editor for the audio patch network and a part of the synth designer UI with envelope generators, param controls, and the FM synth modulation matrix

3D Rainy Scene

Oct. 2022 - Oct. 2022

A continuation of my 3D work with Three.JS. This scene was inspired by the "Rainy Apartments" level from the game Yume 2kki. Everything is modeled by hand in Blender and rendered with Three.JS, using lots of postprocessing for a distance blur effect. Integrates with web synth for rain sounds.

A screenshot of the rainy scene.  It is a dark gray scene with a black railing and some concrete pillars, like a long balcony that is part of an apartment complex.  There are many dark concrete skyscrapers in the background, blurring into the background as they go further back into the distance.

three-good-godrays

Oct. 2022 - Oct. 2022

A collaboration with @N8Programs, porting his godrays shader for Three.JS into a library that integrates with the pmndrs postprocessing library. The shader is a high-quality volumetric lighting effect that generates very cool looking godrays in any Three.JS project, with lots of controls for configuring the effect.

A screenshot of the three-good-godrays demo showing a scene with volumetric lighting and godrays.  A bright pink light shines through a vertical array of black slats set in the side of a huge indistinct black structure in the background.  There are very prominent and intense godrays in the air, giving it the appearance of being very humid or smokey.  The ground is rock and there are black pillars casting long and stark shadows across it.

Spector.js Bugfixes for Large Scenes

Oct. 2022 - Oct. 2022

While working on my Three.JS projects, I used the Spector.JS tool to debug performance issues and was encountering some crashes when trying to load large scenes with it. I contributed some fixes to expand support to much larger scenes to the project, and speed up the extension significantly in some cases.

Seamless Texture Stitcher

Sep. 2022 - Oct. 2022

Web-based utility to combine multiple seamlessly tiling textures into a single larger texture. This is a useful alternative to expensive runtime methods like hex tiling. It works very well when using AI-generated seamless textures, and I used it in some of my 3D sketches. Written in Rust + compiled to WebAssembly.

A screenshot of the seamless texture stitcher tool showing the UI on the right and a preview of the stitched texture on the left.  The stitched texture is a concrete pattern and it consists of 4 different concrete textures blended together while maintaining the seamless tiling.  The UI consists of a matrix of squares for controlling each of the sub-textures including selecting the source texture to use, rotating, and offsetting.

3D Pinklights Scene

Sep. 2022 - Oct. 2022

Continuation of my 3D work with Three.JS and Blender. An alien-looking environment with bright pink animated volumetric lighting. Includes my first proof-of-concept integration with my web synth project to play some dynamically generated music.

A screenshot of the pinklights scene.  It shows a bright panel in the background with dark slats over it which is casting long horizontal shadows over a rocky-looking pixelated ground.  There are some hills around the area and the camera is placed in a small valley.  It looks kind of like if you were inside a terrarium.

3D Bridge Scene

Aug. 2022 - Sept. 2022

The result of a lot of experiments with Three.JS and Blender. Full first person controls with collision detection + physics, lots of custom shaders + textures, and web synth integration for sound effects. The scene itself consists of a bridge over a void with many floating monoliths and an alien-looking environment.

A screenshot of the bridge scene.  It shows a pastel-colored sky in the background with a yellow sun disc.  There are some floating geometric monoliths on the left, and some dark wall-like structures on the right casting prominent shadows.  The ground looks to be rocky with embedded metal that reflects golden in the light.

3D Sketches, Demos, and Experiments

Aug. 2022 - (current)

A collection of small interactive game-like 3D environments and demos. Somewhat inspired by games like Yume Nikki/Yume 2kki, Over the Void, and others. There is no overarching goal or theme, but this work may lead to a larger project in the future. The demos are all browser-based, rendered with Three.JS + WebGL and use 3D models I'm creating myself in Blender. Includes some work with procedural materials and custom shaders inspired by projects on Shadertoy.

A screenshot of one of the 3D sketches I created as a part of this project.  A golden arch made out of a metallic-rocky material stands on a concrete plinth.  It sits in what looks like a sort of shrine with curved stone arches.  There is a cobblestone floor and stone walls.  The graphics are reminiscent of PS2 games or similar style.

Neural Network Experiments + Research

Jun. 2022 - Aug. 2022

While working on an idea for an interactive visualization of RNNs, I ended up going down a rabbit hole of exploration and experimentation in the realm of neural networks, machine learning, and information theory. Work included developing a new activation function, using ideas from other research papers to estimate the Kolmogorov and boolean complexities of different functions, and reverse-engineering a neural network's clever solution to binary addition. This work culminated in a lengthy blog post full of interactive visualizations to illustrate the concepts involved.

A screenshot of a 3D wireframe cube with some areas filled in with colored voxels.  The cube's corners are labeled with input combinations like TTF, TFT, FFF

Interactive ML-Powered Anime Recommendation Tool

Apr. 2022 - May 2022

An anime recommendation engine powered by a custom-built neural network. Using a dataset of user profiles from the popular site MyAnimeList, the network was trained entirely in the browser via Tensorflow.JS. The whole thing is implemented as a SvelteKit app with predictions happening directly within the app itself using tfjs-node and a background thread. Additional post-processing is applied to work around imbalances due to large popularity differences. It also contains support for determining which ratings contribute most to each of the recommendations.

A screenshot of the anime recommendations page of the site showing the UI and several recommended animes

Interactive 2D Anime Embedding Visualization

Apr. 2022 - May 2022

In a similar vein to the Music Galaxy (a few projects down), this is an embedding visualization that is constructed based off of relationships between anime. A co-occurrence matrix is constructed from a large dataset of user anime rankings which is then used to construct a variety of embeddings using different algorithms (PyMDE + GGVec) and parameters. The embedding is then projected into 2D with t-SNE. The visualization itself is built with PIXI.JS and has the ability to search + fly to anime as well as load in user profiles from MyAnimeList to visualize where one's own anime rankings lie in the broader context.

A screenshot of the anime atlas embedding visualization showing the UI and a section of the embedding with labels and markers indicating which ones the user has watched

Browser-Based Neural Network Playground

Aug. 2021 - Apr. 2022

A browser-based tool for building, training, visualizing, and experimenting with neural networks. Written in Rust, compiled to WebAssembly with SIMD. It can learn arbitrary functions via randomly sampled examples, showing its progress on a 3D surface plot. There is support for changing all network parameters like the number of layers, the activation function for each layer, learning rate, and more. It also includes visualizations of individual neurons' responses to explore the internal workings of the network.

A screenshot of the neural network web application itself which shows the full UI, network response visualization, neuron output and response visualization, and costs plot

Mini 3D World in the Browser

Feb. 2022 - Mar. 2022

A small 3D world built using Three.js and Blender that runs in the web browser. Accompanied by a YouTube mini-series of short videos going over the process of creating it and explaining some of the background concepts.

A screenshot of the 3D world in the browser showing a floating island with clouds in the background, grass, low-poly trees, a mountain, texturing, and a FPS counter

Music Galaxy

Aug 2021 - Oct 2021

Music Galaxy is is the culmination of several months of work with artist relationship data from Spotify. It is an interactive 3D visualization of the relationships between over 70,000 artists, positioning them in such a way that artists with similar audiences are positioned closer together in space. It also supports connecting to users' Spotify accounts to visualize where their personal favorite artists exist in context of the greater musical universe.

A screenshot of music galaxy showing a zoomed-out view of the visualization with several labeled artists

Speeding up the `rnnoise` library with SIMD

Jul 2021 - Jul 2021

`rnnoise` is an open source noise suppression library based on a recurrent neural network. It is used in various software, and I use it myself on my desktop as a part of `pulseeffects`. I located a hot function in the application used for actually applying the neural network's weights which was taking up significant portion of its CPU time, and I realized it could be sped up significantly with SIMD. I converted the code to use SIMD intrinsics which yielded a huge reduction in CPU usage. I also contributed a pull request to the rnnoise repository with the changes.

A screenshot of the godbolt web interface showing the generated assembly from the code from rnnoise that I sped up with SIMD

rocket_async_compression

Jul 2021 - Jul 2021

A small library adding support for response compression to the Rocket web framework for Rust. It uses the `async-compression` library to provide support for gzip, deflate, brotli, and zstd compression.

Spotify Related Artists Graph Visualization

May 2021 - Jun. 2021

An interactive web-based visualization of related artists on Spotify based on data from the Spotify web API. It allows patterns in music styles and artists to be seen in a way that moves beyond traditional genre classifications. The visualization is integrated into my Spotifytrack project.

A screenshot of the spotify related artists graph visualization showing the network of my personal artists and their connections to each other based on user listening patterns

MIDI Editor Web Application

Mar. 2021 - (current)

A fully in-browser MIDI editor built as a part of my broader browser-based audio synthesis platform (see below). It's the second browser-based MIDI editor I've made, and fixes many of the issues from the first one. It's currently only available as a module of the web synth platform, but I plan to make it into a standalone webapp as well.

Audio Synthesis Research Notes + Documentation

Feb. 2021 - (current)

As I've delved deeper into audio synthesis and DSP programming topics, I've started recording my findings and creating a personal knowledge repository using Foam, a personal knowledge management and sharing system for VSCode (https://github.com/foambubble/foam). Topics range from FM synthesis to speech/singing synthesis as well as some documentation for my web synth project. I plan to continue expanding this knowledge base and possibly extend it into other areas that I spend time learning about in the future.

A network visualization of my Foam repository so far showing links between pages as edges

Wasm-powered FM Synthesizer

Dec. 2020 - Mar. 2021

An 8-operator frequency modulation synthesizer built in Rust and WebAssembly with SIMD that runs 100% in the web browser via WebAudio. Built as a standalone demo, it is also integrated into the full web-based audio synthesis and experimentation platform I'm building.

A screenshot of the FM synth demo webpage

Quavertrack

Aug. 2020 - Aug. 2020

Built in a weekend, this website does the same thing as my previous project osu!track (which took me months to build). It allows players of the rhythm game Quaver to track their progress and view how their stats progress over time as well as providing visualizations of their hiscore distribution and a few other features.

A screenshot of the Quavertrack interface showing a scatter plot for my hiscores

Circle Game

Jun. 2020 - ?

A little toy game I'm building for fun based off an old idea from years ago. It's a great opportunity to try out WebAssembly in the frontend, do some linear algebra and graphics programming, and do something creative. It's mostly a fancy tech demo right now and may never be anything more, but it's a ton of fun to work on.

A screenshot of the game showing pathfinding debugging and some dynamically added user-created barriers

SPF420 x SYNC^UP

Mar. 2020 - ?

I built and managed all of the tech for the revival of online concert series SPF420. This consisted of a fully custom streaming setup through which multiple artists could stream to my server and be displayed side-by-side on an output livestream and a website featuring a fully custom-built chat with moderation and interactive cursor trails + stickers. The first event on March 28 topped out at over 250 concurrent viewers and lasted nearly 6 hours. More similar events are planned.

A screenshot of the SPF420 x SYNC^UP website on which the concert took place.  Shows the livestream, custom chat, and interactive components.

Project Sync^Up Website

Jan. 2020 - Mar. 2020

I helped out a team of people organizing a set of three simultaneous concerts in San Francisco, New York, and Chicago connected by live stream and streaming online. I built the website (https://syncup.world) and handled the technical side of the livestream and web experience. The website was fully responsive with advanced styling to maintain the look of a poster on devices of all sizes and aspect ratios. However, all of the concerts were canceled due to COVID-19.

A screenshot of the Project Sync^Up Website that I built to announce the event and provide links to buy tickets for the participating venues

SpotifyTrack

Apr. 2019 - (current)

A Work-In-Progress site showing users' top songs and artists and listening patterns over time, providing a shareable link that they can use to show it off to friends. May include features for tracking the popularity or artists/songs/etc. over time as well.

A very early view of the SpotifyTrack user stats page

jantix

May 2019 - May 2019

A fully-featured TypeScript library defining a self-contained 100% type-safe Redux architecture. Jantix statically ensures the validity and cohesion of your actions/reducers/state and provides a very clean, 100% strictly typed interface through which to interact with them.

A screenshot of the VS Code text editor demonstrating the type inference provided by the Jantix library

react-control-panel

Sep. 2018 - Sep. 2018

A React port of the control-panel (https://github.com/freeman-lab/control-panel) library. I maintained 100% visual appearance and functionality parity with the original library while making it usable from React. I also added several additional features such as making panels draggable, making UI state external, and adding an Proxy-based interface for manipulating the UI state externally.

A screenshot of the react-control-panel UI showing two programmatically generated control panels using the light and dark color themes

.io-style Game

Jul. 2018 - Aug. 2018

A friend and I wanted to work on a game together, trying out some tech that we were interested in and building up all parts of a game from scratch. I handled the frontend and the physics while my friend focused on setting up the backend server. At the end, we came up with a networked physics engine based on a popular Rust physics framework that runs the same code on both the client and the server. A variety of techniques were used for handling network delay, synchronizing state, and keeping track of game data both internally on the client as well as on the server.

A screenshot of the .io-style game that I created, showing created "asteroids", a player entity with a rotateable beam, and a procedurally generated background.

Volumetric Rendering Experiment

Aug. 2017 - Aug. 2017

A small demo of volumetric rendering via raymarching in the web browser using Rust, Emscripten/asm.js, GPU.js, and Emscripten. It creates a matrix of 3D noise and then pans around it, rendering the results to a canvas. All of the raymarching algorithmic and linear algebra was implemented from scratch, and the idea for the project was for it to serve as an excercise forme to learn how the whole process works from start to finish.

A view of the volumetric rendering output showing the generated 3D noise projected onto a canvas

osu!track

Jul. 2014 - Feb. 2015

Site where players of the game osu! can track their progress and view the progression of others. Pulls data from the osu! API, storing time series data and creating a variety of charts, plots, statistics, and other visualizations for a variety of different metrics. An in-game chat bot and Discord bot were also written to allow users to update their stats from in-game. Thousands of players a month continue to use osu!track.

A screenshot of a user's osu!track profile, showing statistics about their account and a scatter plot showing the scores on their best plays over time.