An online 3D slot machine game.
This software is free (as in freedom). If you use any part of this code, you must make your entire project's source code publicly available under the same license. This applies whether you modify the code or use it as it is in your own project. This ensures that all modifications and derivative works remain free software, so that everyone can benefit. If you are not willing to comply with these terms, you must refrain from using any part of this code.
For full license terms and conditions, you can read the AGPL-3.0 at: gnu.org/licenses/agpl-3.0.html.
The game features a slot machine with three reels and four fruits, 🍒🍎🍌🍋. Fruit combinations reward the players with 🪙.
- 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 indicator
- Number of spins indicator
- Spin button displays Spinning while the reels are spinning, informing players when they can spin again
- Orbit controls: click and drag to rotate the 3D view
- Help button that opens the help modal
- Help modal containing instructions and all winning fruit combinations
- Game logo
- Add music and sound effects
- Improve button functionality
- Add winning effects and animations
- Add slot machine casing
| Fruits | Rewards |
|---|---|
| 🍒🍒🍒 | 50 🪙 |
| 🍎🍎🍎 | 20🪙 |
| 🍌🍌🍌 | 15🪙 |
| 🍋🍋🍋 | 3🪙 |
| 🍒🍒 | 40🪙 |
| 🍎🍎 | 10🪙 |
| 🍌🍌 | 5🪙 |
The slot machine only considers it a match if the fruits appear consecutively from left to right
To run the project locally, follow these steps:
- Install the project dependencies:
yarn
- Start Vite:
yarn dev
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 |
All the assets used in Cherry Charm (3D models, textures, images, sound effects, music etc.) are either using Creative Commons or in the Public Domain or they were created by me and can be freely used for commercial purposes. They were chosen primarily to enable rapid prototyping. Some (or most) of them should be replaced with more appropriate or professional assets.
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
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:
Copyright (c) Michael Kolesidis
Licensed under the GNU Affero General Public License v3.0.
🍒