An online 3D slot machine game.

Information

The game features a slot machine with three reels and four fruits, 🍒🍎🍌🍋. Fruit combinations reward the players with 🪙.

Features

• Fully responsive for desktop and mobile
• Players can spin the slot machine either by clicking on the Spin button or by pressing Space
• Number of coins visible
• Number or spins visible
• Spin button displays Spinning while the reels are spinning, informing players when they can spin again
• Orbit controls: clicking and holding mouse while moving the cursors allows players to change 3D view
• Help button that open the help modal
• Help modal that contains instructions and all winning fruit combinations
• Game logo

Winning fruit combinations

Fruits	Rewards
🍒🍒🍒	50 🪙
🍎🍎🍎	20🪙
🍌🍌🍌	15🪙
🍋🍋🍋	3🪙
🍒🍒	40🪙
🍎🍎	10🪙
🍌🍌	5🪙

Please note that slot machines only consider pairs a match if they are in order from left to right.

Instructions

In order to run the project locally you need to start

1. Install the project dependencies:

yarn

2. Start Vite:

yarn dev

Screenshots

Desktop

Mobile

Technologies

The core technologies of Cherry Charm are JavaScript, WebGL and WebAssembly (WASM). The following libraries and tools are used:

Name	License	Description
React	MIT	Component-based, front-end interface library
Three.js	MIT	3D graphics API for the web, based on WebGL
React Three Fiber	MIT	A React renderer for Three.js
Drei	MIT	Useful helpers for React Three Fiber
R3F-Perf	MIT	Performance monitoring
Zustand	MIT	State management
Vite	MIT	Frontend development tooling

Assets

All the assets used in Cherry Charm (3D models, textures, images, sound effects, music etc.) are either using Creative Commons / Public Domain or they were created by me and can be freely used for commercial purposes. The main factor for choosing and using them was the need to deliver a prototype in a short time. Some (or most) of them should be changed to more appropriate/professional ones for commercial releases of the product.

Software Used

A non-exhaustive list of all the software that was used during the development of Cherry Charm.

• Visual Studio Code
• Blender
• Adobe Illustrator
• Krita
• Inkscape
• Google Chrome
• Microsoft Edge
• Mozilla Firefox
• Figma

💖 Support the Project

Thank you so much for your interest in my project! If you want to go a step further and support my open source work, buy me a coffee:

License

Copyright (c) 2023 Michael Kolesidis
Licensed under the GNU Affero General Public License v3.0.

🍒