Portfolio » PlayFab

Senior front-end web developer, 2015-present

Concept design for Game Manager

About

PlayFab is a backend-as-a-service startup for games. They provide an easy API for player authentication, inventory, leaderboards, push notifications, and server hosting. When your game is featured on the App Store, you’ll be able to handle the crush of users if you’re using PlayFab.


Game Manager

I was hired in May 2015 to maintain and upgrade their Game Manager product, the user interface for game developers to create an economy, manage player data, and monitor events. It was written in Microsoft ASP.NET MVC 5 and used Knockout and jQuery on the client.

After several months of bug fixes I completely overhauled the front-end architecture.

  • Prepared the site for localization and added proper MVC routes to every page
  • While it wasn’t a single page app, the Game Manager did need client-side redirection, so I built a system to deliver .NET routes to the client and keep the front-end and back-end in sync
  • I also developed an easy way to run all model validation on the server and deliver the results via AJAX, highlighting any fields the user filled out incorrectly
  • Created a unified navigation and breadcrumb system and made it simple to call from the layout

Working with the backend team, we implemented the ability to have beta features available to specific customers, as well as migrated the site to a proper roles & permissions security model.


Public website

PlayFab’s public website went through many technology stacks. First it ran on Drupal, then WordPress. To save on server costs, I was authorized to port it to Hugo, a static site generator.

Fortunately there exists a WordPress-to-Hugo exporter so I didn’t have to copy and paste all 150 blog posts. From there I built a Gruntfile to compile and minify the TypeScript, SASS stylesheets, then prettify the code and remove any stragglers. We’re now hosting the site on S3 for almost nothing.


Documentation site

In preparation for our announcement with IBM’s Watson team, I redesigned our public website and documentation site. These properties now share a front-end codebase, my best mobile-first stylesheet designed with highly semantic code and minimal JavaScript interaction. I scrapped the old home page and made something truly user-focused.