•
3 min read
Neptune: Waves of Wonder

Overview

At my time with House of How, I contributed to a slot machine game developed for DraftKings called Neptune: Waves of Wonder. The game was an underwater themed slot machine game with traditional slot mechanics including big symbols and scatter symbols, which could lead to free spins.

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 - Apr. 2021 - Mar. 2022
  • Platform - Web Browser
  • Genre - Casino / Gambling / Slots
  • Tech Stack - TypeScript/JavaScript, Python

Click on the images to view them in a lightbox.

Mechanics

Slot games are inheritly flashy and this one followed suit. Several celebatory celebrations including 6 different videos, a Posiden character animating across the screen, scatter wins, free spins, etc… Lines are drawn each winning spin, with a cool animated sparkle running on the line. CSS was utilized to include further highlighting and background elements (e.g. bubbles & fish)

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.

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.