EasyPay Calculator

The calculator tool is contained in an iframe, so that it can be used on both the main site and in advertisements. I used postMessage to create some specific resizing and scrolling behavior the client requested for the main site.

The client asked for 'something exciting' to happen when a user clicked the calculate button, as they found the chart.js animations underwhelming on their own. I adjusted a confetti fountain I found on CodePen to suit their needs. I needed the confetti animation to wind down in a natural looking way, more like a burst from a confetti gun rather than a continuous fountain.

Because this is a client project, I can't link you to a github repository. However, you can use your devtools to see most of the source code here! (please note the styling is slightly off when the tool isn't in its iframe)

Skor Image Generator

AP specialties wanted to be able to show customers what their custom printed sneakers would look like, but they didn't want to have to manufacture and photograph every single shoe they designed. I created a tool that would let their artists upload an image, and then their image would be applied to the shoe model using Three.js. Snapshots from every angle and a rotating GIF would then be automatically downloaded.

The GIF is a bit grainy because of size constraints on Shopify, but it's so cool that Three.js lets you do things like that!

filter.js

While working at Level, I needed to create a input-based filter for a page that displayed an inordinately long list. I realized my code could easily be abstracted into a small plugin.

Filter.js will automatically display a list and search input from an array, then filter the list based on the user's input. It's also written in vanilla JavaScript to appease those purists out there who hate jQuery. :)

Definitely a blast from the past, but it's a great sample of some of my early work.