Overview

At my time with House of How, I contributed to a blackjack variant developed for DraftKings called Pick N’ Flick 21. The game is a blackjack variant with an unique mechanic allowing the player to choose their and the dealer’s second card. This choice comes at a required sidebet fee.

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 - Mar. 2024 - Dec. 2024
• Platform - Web Browser
• Genre - Casino / Gambling / Blackjack
• Tech Stack - TypeScript/JavaScript, Python, WebGL

Unique Mechanics

• A required, included sidebet, which gave player ability to choose their and dealer’s second card. Included a unique game state where the player has to confirm their second card selection. The card value indicators update in real time, and the card selection is then communicated to the player to lock in the decision. If the game is interrupted during the process, the game will fully restore once the internect connection is regained.

Contributions

My role focused on front-end development, responding to real-time game state changes provided through server responses.

• Designed event-driven animation triggers, ensuring visuals match backend game logic.
• Developed interactive UI components for betting, gameplay interactions, and win/loss displays.
• Created fluid transitions and vfx, such as glowing symbols/chips, win/losses effects, and dynamic UI updates.
• Custom design and development of card swap mechanic.
• Synchronized real-time game state updates with UI animations for a seamless player experience.
• Ensured smooth and engaging user interactions, from placing bets to reacting to game outcomes.
• Collaborated with backend developers to consume APIs and integrate real-time game data.
• Debugged and improved animation rendering performance, reducing lag and increasing engagement.

Challenges & Solutions

1. Design & develop the card pick mechanic for client approval.

Solution: The pick mechanic was done in JavaScript using a tweening library, which were triggered by input buttons. After the player picked a card, they could continue to swap between the two card options. The layout needed to accomodate the updated card value totals with each swap.

2. Design & develop the trap door sidebet mechanic for client approval.

Solution: Before the table’s cards were dealt the sidebet needed to be handled. To go along with the western theme we added a wooden trap door that would swallow the sidebet (never to be seen again). This was an animation cooked into the glTF file included by the artist. The animation just had to be triggered at the right time. We had fun finding a squeaky wooden trap door sound along with an occasional whilhelm scream (which was most likely removed before release).

3. Restoring the game state of a split hand and retaining the hand dealt order.

Solution: Restoring the game state of a split hand (if the game had to be refresh mid-hand) proved to be challenging due to the hand order not being included in the recieved game state. The hand information was included, however the order could be different than what the player was expecting and consistency is important with these types of games.