Michael Shiplet

Oct 2020 - ongoing

Running For My Rank is a distributed, virtual, asynchronous Cross Country (XC) competition.

Through a patented algorithm, runners from around the United States can normalize times they've run on their home courses into a single, common constant.

This allows for direct comparison between running on a course in The Bronx and one in San Diego.

It's a revolutionary technology in the running world, and this is the first event of its kind to use it.

It's built in VueJS and Go, and is hosted on Netlify and Shopify.

May 2020 - ongoing

Coma Physics is a DOM-based phsyics engine I'm building because I've always wanted to build one.

It's open source, and built in TypeScript, but I hope to release versions of it for other frameworks as well.

I'm also blogging about the learning & development process at shiplet.dev.

January 2020

This explores ANSI escape codes and stdout performance by creating the same multiple-progress-bar output in 3 different languages: Python, Rust, and Go.

Each implementation strives to produce the same output as the others, and to do so as quickly as possible.

This was the subject of a meetup I led on Rust, specifically highlighting syntax, compilation, and performance relative to other languages, including performance bottlenecks.

March 2019 - ongoing

PaceTargets is a standalone ecommerce application designed to support the ongoing mission of On Course Rating Systems, LLC, namely: to help people run better races. Whether in Cross Country, Track & Field, or eventually even road races, one of the core mysteries of racing is knowing how to convert a time on one course into a time on another course.

PaceTargets implements a patented technology that allows you not only to know the overall time conversion, but also how each segment of one course translates to another. It's a revolutionary approach to racing strategy and pacing.

Publicity for PaceTargets and On Course Rating Systems (OCRS), can be found on MileSplit.com (paywall).

It's built on VueJS, Go, Auth0, Stripe, Postgres, Redis, Jenkins CI/CD, and AWS, to deliver a scalable, low-latency, high-uptime application experience.

May 2017 - April 2018

The Fan Art Showcase provided fans of Riot Games' primary property, League of Legends, an opportunity to officially publish their work on a Riot platform. It was moderated by Rioters who acted on the orders of Senior Producer, Thomas Vu, to ensure that only the best work got published, so to see your piece on the Featured row was a feather in any artist's cap.

I was the Lead Developer on this property from May of 2017 to the end of its development cycle in April of 2018. On top of many quality-of-life improvements and bug-fixes, I was primarily responsible for adding a robust caching schema to improve global server response times from 12-20 seconds to between 150-300ms.

I also improved client performance by leveraging the IntersectionObserver API and a custom-built polyfill to prevent slowdowns when viewing hundreds of images simultaneously; and I'm responsible for enabling portrait and landscape image orientations, in addition to the original squares.

The site is built on Django, Django Rest Framework , and Angular 1.4.

It's served via Nginx on load-balanced AWS EC2 instances, uses Varnish HTTP-acceleration, Redis in-memory caching, and Cloudflare DNS-level caching.

December 2016 - January 2017

Each year, the world's best League of Legends eSports teams come together to battle each other in two to three championship tournaments - All-Star, Mid-Season Invitational, and the World Championship - which can draw 80,000 live spectators and several hundred thousand streams, each.

To get the word out, Riot asked me and my team of 2 developers to build the event announcement site. We built the site over a period of about 6 weeks, from December 2016 to early February 2017.

The site is built on ReactJS, ThreeJS/WebGL, and heavily leverages custom, dynamic SVG treatments of the Beaufort font family. It makes significant use of SVG animations, ReactCSSTransitionGroup, and has appropriate fallbacks for mobile and older browsers. It also features audio-backed interactions, fullscreen inline videos, a spherical-coordinate-based homepage interaction, page state transitions, and text glitching animations.

The site and all relevant titles and animations have also all been set up to support over 15 different languages, which can be swapped on the fly.

January 2017 - June 2017

Rockford Fosgate is an industry-leading manufacturer and distributor of high-end mobile audio. Work began in 2016 on a complete overhaul of their corporate site, with a focus on direct-to-consumer sales, without losing touch with the dealerships and shops already in their network.

Development on the site began in January 2017, with me and two other developers at the helm. I became Lead Developer on the project in late February 2017, and continued in the position until June 2017.

A writeup on the site's rebuild can be found at Twice.com.

The site is built on Django and Oracle.

August 2015 - September 2016

Nike Zero is Nike's global internal news & events platform. The site's central hub acts as an aggregator for Nike Global HQ and each of its major regional divisions: Brazil, Eastern & Western Europe, China, and Japan; as well as particularly large teams within the organization, such as Nike Tech and Nike HQ Expansions.

I was a Junior Developer on the project from August 2015 to November 2015, and became Lead Developer in December 2015. I continued in this role until September 2016, in that time overseeing a massive expansion of the capabilities of the platform, the incorporation & migration of several new teams and countries, and the ground-up build and launch of both the internal 2016 Olympics site, and Nike's new communications hub for corporate accountability initiatives.

The site is built on PHP, Wordpress 4, Angular 1.4, a custom API layer that allows for RESTful comunication between Angular and Wordpress (pre-Wordpress-API), and MongoDB-backed request caching.

It's hosted on RHEL 7, and is only accessible via Nike's VPN.

September 2016 - November 2016

Big AL is an interactive quiz-based vending machine concept, deployed by Experticity to events like the Outdoor Retailer's Conference and other private corporate functions. Through admin-defined questions, users take quizzes and are awarded tiers of prizes based on their results.

I was responsible for rebuilding the original quiz platform, transitioning away from an app built with Visual Studio, C#, and XML, to an app that uses more widely available, open source components.

The vending machine itself features an onboard micro-PC running Windows 10. The quiz app is built on a Django backend, ReactJS frontend, and is deployed natively via Electron. The backend interfaces with the onboard vending protocols via a custom serial connections library written in C#, and a custom Python/Iron Python wrapper which exposes the vending library to Django.

It also has an onboard WiFi router and DNS server to allow remote SSH connections to the admin interface.

December 2016

The Arc Scrubber is a concept I built initially as part of the 2017 League of Legends Championship Announcement site. It features a user-interactive diamond that scrubs along an arc where the position of the diamond corresponds to a spherical coordinate system. The sphere in question would have been the WebGL globe that's featured on the event site.

Due to conflicts with event locations, the number of events in 2017 dropped from three to two, which rendered the arc scrubber unnecessary. However, I believe it has potential to be a fun and intuitive UX/UI feature, so I have preserved it and intend to release it as an open-source library with user-definable configurations.

The linked example is built in plain HTML, CSS, and JS, to emphasize the concepts at work in its functionality. The math involved is derived from linear algebra, trigonometry, and statistical normalization.

March 2018

I've always wanted to know the fundamentals behind giving gravity and momentum to interactions, so this is a proof of concept of gravity that I put together in March 2018.

My initial goal was to simulate gravity's observed acceleration of 9.8 m/s² as closely as possible, but I quickly discovered a number of obstacles:

1. Converting pixels to meters is extremely difficult, bordering on impossible, without much greater access to a device's screen information & dimensions.
2. More importantly, 9.8 m/s² is just too dang fast on a computer screen.

To overcome this, I modified my formula to include a "gravity multiplier" that would allow the programmer to determine an acceleration that feels more natural. 100 - 1500 is pretty slow. 1500 - 5000 feels like a slow-to-fast video game. 10,000 - 15,000 is getting closer to natural gravity, but still a long ways off. 150,000 is too fast for most screens. 1,000,000 is indistinguishable from natural gravity on a 27" screen.

Like the Arc Scrubber, Gravity is built with HTML, CSS, and JS to highlight the underlying concepts at work. The math is derived from linear algebra and physics.

August 2018

I'd seen people talking about Conway's Game of Life for years before I decided it was time to dig in and see what I was missing. And I've gotta say, it was a ton of fun. It's got a beauty all its own, and it opens up a bunch of areas to explore: optimized solutions, performance, Functional vs OOP, and on and on.

This is a configurable implementation I put together with JavaScript and Canvas2D. It uses a two-dimensional array to construct the cells of the grid based on a desired "pixel" size, seeds it with a random initial state, and lets loose from there.

To recap how it all works - each "cell" is either dead or alive, and the following rules determine whether it continues into the next "generation":

1. If a cell has fewer than two living neighbors, it dies (underpopulation).
2. If a cell has exactly two or three living neighbors, it lives (ideal population).
3. If a cell has more than three living neighbors, it dies (overpopulation).
4. If a dead cell has exactly three living neighbors, it comes back to life (reproduction).

Each successive generation of cells gets built by running the prior generation through these rules, and because life uh... finds a way, it can go on infinitely.

Also, make sure you keep an eye out for the various still-lifes, blinkers, and gliders!