Inspiration

We were inspired by strategy card games like Love Letters and Yu-gi-oh. We wanted to incorporate the small-hand strategy of Love Letters with concepts like playing defensive cards in Yu-gi-oh. We are also recent fans of shows like the Apothecary Diaries anime and the Shogun series. These were the inspiration for the visuals and setting.

What it does

2 to 6 players meet around a deck of cards. VR players can play with the virtual cards and the CustomUI screens while non-VR players can play using the CustomUI screens. Since everyone is around a six-sided table, it is possible to look around and read social cues.

How we built it

The project was built with TypeScript using VS Code. Images were created with the help of AI. Design work was done in Figma. Simple models were created in Blender and with the aide of Meshy.ai. Later in the project, Meta added generative AI for meshes so we used that as well. Audio was provided by the Horizon Worlds asset library.

Because this is a fast paced card game with a mobile focus, we put the majority of our design time into the cards and CustomUI panels. We wanted to make sure they stood out, were legible on various screen sizes and engaging. We love how the cards look. The world's design was centered around getting players into a round quickly. Our spawn point faces the central card table, with the instructions in view just behind. This was intentional as regular players will run straight to the table, while new players will want to consult the rules.

To keep the pace of gameplay going, there is a turn timer and every round ends with a button to quickly start another round. To avoid the frustration of joining a game already in-progress, once a round starts we follow the Horizon Worlds documented best practice of closing the world for match-making. However, we do allow 18 players in the world, even though the table only supports 6. This is because many party games are best played with spectators. We wanted to let each player have 2. When a round is over, if the "End Game" button is pressed, the world re-opens for match making.

Challenges we ran into

We ran into quite a few challenges related to CustomUI and Component initialization. We wanted all 6 screens to have some state that is shared, but other state that is both player AND panel specific. We ended up creating a central registry of Bindings that the panels and core game logic could attach to. This allowed us to get around the world load lifecycle as our central registry would be instantiated before other components in the world could be interacted with.

Accomplishments that we're proud of

Designing the system so that VR players can use the virtual cards while mobile players can use the CustomUI panels was the biggest accomplishment here. The feeling of throwing a face down card into the table well and seeing the plume of smoke is great. The ability for VR users to have a tactile experience alongside mobile players who get to play with the CustomUI panels is exactly what we were hoping for. We are also really happy with our specific implementations of the animated modal panels as well. This is really helpful for reading full card details or quickly checking on who has played what cards.

One other thing we REALLY love is how we implemented the game instructions on mobile. Our instruction screens were too big to fit on a single phone screen. To solve this, we created a CustomUI component that we could position over different portions of the instruction walls. This allows players to zoom into different parts of the instructions on mobile.

What we learned

We learned that we needed to test on multiple devices WAY earlier. We had a showstopper in our original CustomUI code that cost us a lot of time right before the Feedback Festival. We had to rethink everything with our bindings. In the end, we learned a lot about how CustomUI bindings work and ways to push them further. We have more gameplay ideas for the CustomUI that we are excited to try in the future.

What's next for Cloak and Katana

We've been working on improving gameplay, card interactions, world design and bug fixes. We would like to take the core of our turn-based card game engine and make a Customizable Card Game in the flavor of Yu-Gi-Oh, Pokemon, Magic, Hearthstone, etc. We could imagine offering card drops for regular players as well as the ability to buy card packs using the in-game purchase capability. Also, we have some interesting ideas for using CustomUI panels for gameplay surfaces.

Built With

Share this project:

Updates

posted an update

Lots of progress on our internal build this weekend!

  1. We were able to work through the CustomUI issues mentioned in the original draft post. I put an update in the Meta discussion board with my findings. You can read those here: https://communityforums.atmeta.com/t5/Creator-Questions-Discussions/Custom-UI-Images-Not-Showing-for-2nd-User-in-World/m-p/1312116/highlight/true#M1017
  2. Fixed the Red Mask issue.
  3. Fixed turn management. The issue was that I was using the end of an animation to trigger the "next player selection". This was causing each player in the world to trigger "next player selection".
  4. We now have modals for card details AND plays made during the current round.

Next up, focus will be on the VR card playing. I want VR players to have a tactile experience interacting with the "virtual physical cards" as much has possible.

NOTE: I have not updated the Cloak and Katana build linked in this project as I don't want to change what was submitted to Meta for the Feedback Festival.

Log in or sign up for Devpost to join the conversation.