•
4 min read
Just Kitten Around

Overview

At my time with House of How, I contributed to a slot machine game developed for DraftKings called Just Kitten Around. The game was a cat themed slot machine game with traditional slot mechanics including big symbols and scatter symbols, which could lead to free spins.

Disclaimer

This project was developed by House of How for DraftKings. All rights to the game and assets belong to DraftKings.

Information

  • Client - DraftKings (via House of How)
  • Role - Front-End Developer
  • Timeline - Jun. 2021 - Feb. 2022
  • Platform - Web Browser
  • Genre - Casino / Gambling / Slots
  • Tech Stack - TypeScript/JavaScript, Python

Click on the images to view them in a lightbox.

Contributions

My role focused on front-end development, specifically responding to real-time game state changes provided through server responses. I also assisted in some vfx animations using Adobe Animate.

  • Implement slot spin animations using tweening libraries, while optimizing performance across multiple devices.
  • Implement vfx animations using Adobe Animate for big win events using assets provided by the art team.
  • Implement game state changes based on server responses to update the UI and game logic.
  • Optimized animations and UI performance for smooth gameplay on mobile devices.
  • Created fluid transitions and effects, such as spinning reels, animation queues, and dynamic UI updates.
  • Collaborated with backend developers to consume APIs and integrate real-time game data.
  • Developed mobile-responsive layouts, ensuring consistency across screen sizes and orientations.
  • Debugged and improved animation rendering performance, reducing lag and increasing engagement.

Mechanics

Slot games are inheritly flashy and this one followed suit. Several celebatory celebrations including 6 different videos, a large cat disrupting the reels, scatter wins, free spins, etc… Lines are drawn each winning spin, with a cool animated rat running on the line. CSS was utilized to shake the slot panel when a bonus win occurred.

Challenges & Solutions

  1. VFX Development & Integration.

Solution: The vfx were developed on a rather dated technology (Adobe Animate), which would export raw JS files that would have to be imported for integrating into our framework for queueing up animation triggers. We had to devise a solution when minifying the code for production and having the raw, external js files to communicate with the minified code.

  1. Optimize game animations, especially on mobile devices.

Solution: Poor game performance found on older devices lead to a combination of asset optimization, comprimises made to limiting VFX, while testing the performance results and finding any memory leaks.

  1. Video VFX performance issues.

Solution: At first the game had too much visual effects ambition and not enough testing to see if it could be handled. After some performance testing using the browsers debug tools, we were able to reduce the size of the videos to become more performant.