https://github.com/arcomage/arcomage-hd
Web-based, free and open source, remastered 3D clone of 3DO/NWC's 2000 card game Arcomage. 14 languages. Desktop or mobile Android iOS. Online or offline PWA. Against AI or Multiplayer (P2P, no server). 🧝👾🃏 (ts+react+redux+rxjs, CSS-based anim, WebRTC)
https://github.com/arcomage/arcomage-hd
3do arcomage card-game game game-clone might-and-magic minigame multiplayer nwc pwa react react-game redux redux-observable remaster rxjs tower-defense typescript typescript-game webrtc
Last synced: about 1 month ago
JSON representation
Web-based, free and open source, remastered 3D clone of 3DO/NWC's 2000 card game Arcomage. 14 languages. Desktop or mobile Android iOS. Online or offline PWA. Against AI or Multiplayer (P2P, no server). 🧝👾🃏 (ts+react+redux+rxjs, CSS-based anim, WebRTC)
- Host: GitHub
- URL: https://github.com/arcomage/arcomage-hd
- Owner: arcomage
- License: mit
- Created: 2021-03-31T18:04:54.000Z (over 4 years ago)
- Default Branch: main
- Last Pushed: 2025-03-17T19:30:25.000Z (8 months ago)
- Last Synced: 2025-09-12T07:58:35.970Z (2 months ago)
- Topics: 3do, arcomage, card-game, game, game-clone, might-and-magic, minigame, multiplayer, nwc, pwa, react, react-game, redux, redux-observable, remaster, rxjs, tower-defense, typescript, typescript-game, webrtc
- Language: TypeScript
- Homepage: https://arcomage.github.io
- Size: 58.5 MB
- Stars: 157
- Watchers: 4
- Forks: 36
- Open Issues: 23
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE.md
Awesome Lists containing this project
README
ArcoMage HD - Open Source Card Game
**ArcoMage HD** is a web-based, free and open source, remastered 3D clone of 3DO and New World Computing's 2000 PC card game, _Arcomage_, which was featured in the _Might and Magic_ RPG series.
This non-profit fan remake brings the classic tower defense and resource management fantasy game to modern platforms, and is developed by [@tomchen](https://github.com/tomchen) using TypeScript, React, Redux, redux-observable, RxJS, CSS animations, and WebRTC (see [§ Development](#development)). If you enjoy the game, please support me by starring the repository or following me on [GitHub](https://github.com/tomchen).
ArcoMage HD is available in 14 languages: English, French, German, Simplified Chinese, Traditional Chinese, Spanish, Italian, Russian, Czech, Polish, Brazilian Portuguese, Japanese, Ukrainian, and Arabic (with RTL support). ([§ Translation Credits](#translation-credits))
It's compatible with the latest versions of 
and other modern [browsers](troubleshooting.md#browser-support).
The game is fully responsive, supporting desktop, tablet, and mobile devices 🖥️💻📱. [As a PWA, you can install it and play offline](#play-offline-pwa). It is fully controllable with [mouse](gamecontrols.md#mouse), [touch device](gamecontrols.md#touch-device), [keyboard](gamecontrols.md#keyboard), or [gamepad](gamecontrols.md#gamepad) 🖱️📱⌨️🎮, and includes comprehensive [accessibility features for users with disabilities](#game-controls--accessibility).
By default, you'll play against the computer AI 🤖 in Single Player Mode. You can also switch to [Multiplayer Mode 🧑🤝🧑](#multiplayer-mode).
## Gameplay
Click to view the game rules in text format
> Victory conditions vary per tavern. Build your tower, destroy your opponent's tower, or collect enough resources before your opponent does.
>
> Large yellow numbers in column are the productions. This is how many new units of a particular resource you will receive on your next turn. Small black numbers in column are the resources. This is how many units you have available to spend on your current turn.
>
> Cards: Each have their own cost to play, indicated in a small circle in the lower right corner of the card. The cost will be deducted from your resources according to the color of the card. Left click on a card plays the card. Right click on a card to discard without playing.
>
> Red represents your Quarry Generator which produces your Brick 🧱 resources, blue represents your Magic Generator which produces Gem 💎 resources, green represents your Dungeon (aka. Zoo) generator which produces Recruit (aka. Beast) 🐲 resources.
## Play Offline (PWA)
The image and sound files, along with your card and language settings, are automatically stored in your browser. Additionally, you can install this "Progressive Web App" (PWA) on your computer or smartphone. For installation instructions, please refer to [Google Chrome's guide](https://support.google.com/chrome/answer/9658361) and [Mozilla's guide](https://developer.mozilla.org/en-US/docs/Web/Progressive_web_apps/Installing).
Depending on your browser, you may need to press Ctrl + F5 to clear the cache and reload the [arcomage.github.io](https://arcomage.github.io) webpage to ensure you're using the latest version of the game.
## Game Controls & Accessibility
The game is fully controllable using either a **[mouse](gamecontrols.md#mouse)**, **[touch device](gamecontrols.md#touch-device)**, **[keyboard](gamecontrols.md#keyboard)**, or **[gamepad](gamecontrols.md#gamepad)** (click these links to view detailed instructions).
The game is fully compatible with and easy to use with a [screen reader](https://en.wikipedia.org/wiki/Screen_reader). You can also disable animations in the graphics settings if desired.
## Multiplayer Mode
### How to Use Multiplayer Mode
https://user-images.githubusercontent.com/529949/115864733-941cbd00-a437-11eb-955d-f6a341c8ea64.mp4
1. Both players enable "Multiplayer" Mode (click the gear ⚙️ icon in the game to open the "Preferences" window)
2. Bob 🧝 must copy and **share his ID with Alice 👧 via Discord, forums, etc.**
3. Alice 👧 enters Bob 🧝's ID and connects to him
4. Alice 👧 becomes the host 🏠 (her computer deals the cards), and Bob 🧝 is the guest 💼
**Note:** Multiplayer Mode may not function if both players are behind symmetric NAT. You can [test if you're behind "bad", symmetric NAT](https://tomchen.github.io/symmetric-nat-test/).
Click to show technical details
### Technical Details
In Multiplayer Mode, the game establishes a direct Peer-to-Peer (P2P) connection with the opponent, eliminating the need for a central server. However, it still relies on free public [STUN](https://en.wikipedia.org/wiki/STUN) servers (provided by Google and others) and a signaling server (via [PeerJS](https://peerjs.com/docs/)) for peer discovery and exchanging connection details. Once the connection is established, players communicate directly without requiring any servers.
The game doesn't use any servers, so there isn't a central "list of online players" for easy matchmaking. Instead, you must share your ID with your opponent through platforms like Discord.
For more details, see [WebRTC (Web Real-Time Communication)](https://developer.mozilla.org/en-US/docs/Web/API/WebRTC_API) and [PeerJS library](https://peerjs.com/).
Currently, since the game doesn't use a [TURN](https://en.wikipedia.org/wiki/Traversal_Using_Relays_around_NAT) server, it cannot connect two users who are both behind symmetric NAT (a rare scenario).
## Troubleshooting
If you're experiencing performance issues while running the game, or if the game doesn't run at all in your browser (likely an older or non-major browser), you can refer to the [troubleshooting guide](troubleshooting.md). It includes a [list of tested browsers](troubleshooting.md#browser-support) that are known to run the game without major issues. Additionally, you may consider installing the Windows [Desktop Version](troubleshooting.md#desktop-version) of the game ([click to download](https://github.com/arcomage/arcomage-hd/releases/download/v1.0.0-beta.26/ArcoMage.HD.Setup.1.0.0.7z)), though please note that the current desktop version is not recommended in most cases.
If you encounter any issues, please [open an issue](https://github.com/arcomage/arcomage-hd/issues).
## Development
The stack :
(Used in ≤1.4.x but not in 2.0+: 
)
[TypeScript](https://www.typescriptlang.org/) + [React](https://reactjs.org/) + [Redux](https://redux.js.org/) + [redux-observable](https://redux-observable.js.org/) + [RxJS](https://rxjs.dev/). [PWA](https://web.dev/progressive-web-apps/) (using [Workbox](https://developers.google.com/web/tools/workbox)).
The game doesn't use [rAF](https://developer.mozilla.org/en-US/docs/Web/API/window/requestAnimationFrame) (except for a few cases), [WebGL](https://developer.mozilla.org/en-US/docs/Web/API/WebGL_API), or `` at all. Instead, it relies on DOM and CSS-based animations, which can improve SEO and accessibility, while making it feel more like a "standard web app." While CSS animations may not perform as well as ``, they still provide excellent performance on Blink-based browsers on modern devices.
With [WebRTC](https://webrtc.org/) (using [PeerJS](https://peerjs.com/)), the game features P2P Multiplayer Mode without a server, utilizing only [STUN](https://en.wikipedia.org/wiki/STUN) servers and a signaling server (via [PeerJS](https://peerjs.com/docs/)) for peer discovery and connection establishment.
It also supports stereo sound, WebP and SVG images, with images upscaled using [Real-ESRGAN](https://github.com/xinntao/Real-ESRGAN-ncnn-vulkan). Card text is extracted using the OCR library [tesseract.js](https://tesseract.projectnaptha.com/).
Developer scripts and tools are located in the [`tools` folder](https://github.com/arcomage/arcomage-hd/tree/main/tools). For more details, see the [development notes](https://github.com/arcomage/arcomage-hd/blob/main/DEVELOPMENT.md), [changelog](CHANGELOG.md), and the `scripts` section in [`package.json`](https://github.com/arcomage/arcomage-hd/blob/main/package.json).
Google Lighthouse score
## Translation Credits
- **[Cards](https://github.com/arcomage/arcomage-hd/tree/main/src/i18n/cards)**: Extracted from _Might and Magic VIII_ & _VI_ original games (or translated/retranslated) by:
- English (`en`): [Black Rabite on GameFAQs](https://gamefaqs.gamespot.com/pc/929601-arcomage/faqs/44131)
- Russian (`ru`) (retranslated): [rayburn](https://github.com/TombOfVARN)
- Simplified Chinese (`zh-Hans`): (extracted) [Liar-zzy](https://github.com/Liar-zzy/Arcomage/blob/master/Arcomage.cpp), (fixed/retranslated) [Tom Chen](https://github.com/tomchen)
- Polish (`pl`) (retranslated): [acidcave](https://www.arcomage.acidcave.net/czerwone_karty.html)
- Czech (`cs`): Yym
- Brazilian Portuguese (`pt-BR`) (translated): [mateuscv](https://github.com/mateuscv)
- Ukrainian (`uk`) (translated): [troyane](https://github.com/troyane)
- Japanese (`ja`) (translated): [Tom Chen](https://github.com/tomchen) with help from [Google Translate](https://translate.google.com/) & [DeepL](https://www.deepl.com/translator)
- Arabic (`ar`) (translated): [Tom Chen](https://github.com/tomchen) with help from [Google Translate](https://translate.google.com/)
- All others: [Tom Chen](https://github.com/tomchen) with OCR tool [tesseract.js](https://tesseract.projectnaptha.com/) & [other scripts](https://github.com/arcomage/arcomage-hd/tree/main/tools)
- Traditional Chinese (`zh-Hant`): Converted from `zh-Hans` by [Tom Chen](https://github.com/tomchen) using [his scripts](https://github.com/arcomage/arcomage-hd/tree/main/tools/zhconvert) and [opencc-js](https://github.com/nk2028/opencc-js)
- **[Main](https://github.com/arcomage/arcomage-hd/tree/main/src/i18n/main)** string translators (some from the original games):
- Russian (`ru`): [rayburn](https://github.com/TombOfVARN)
- Polish (`pl`): (partially by) Plamcia
- Brazilian Portuguese (`pt-BR`): [mateuscv](https://github.com/mateuscv)
- Ukrainian (`uk`): [troyane](https://github.com/troyane)
- All others: [Tom Chen](https://github.com/tomchen) by himself and/or with help from [Google Translate](https://translate.google.com/) & [DeepL](https://www.deepl.com/translator)
- Traditional Chinese (`zh-Hant`): Converted from `zh-Hans` by [Tom Chen](https://github.com/tomchen) using [his scripts](https://github.com/arcomage/arcomage-hd/tree/main/tools/zhconvert) and [opencc-js](https://github.com/nk2028/opencc-js)
- **[Taverns](https://github.com/arcomage/arcomage-hd/tree/main/src/i18n/taverns)**: Extracted from _Might and Magic VIII_ & _VI_ original games by [Tom Chen](https://github.com/tomchen) using [his script](https://github.com/arcomage/arcomage-hd/tree/main/tools/i18n-extraction). Except for:
- Brazilian Portuguese (`pt-BR`) (translated): [mateuscv](https://github.com/mateuscv)
- Japanese (`ja`) (translated): [Tom Chen](https://github.com/tomchen) with help from [Google Translate](https://translate.google.com/) & [DeepL](https://www.deepl.com/translator)
- Arabic (`ar`) (translated): [Tom Chen](https://github.com/tomchen) with help from [Google Translate](https://translate.google.com/)
- Ukrainian (`uk`) (translated): [troyane](https://github.com/troyane)
_See also [I18N Issue Page](https://github.com/arcomage/arcomage-hd/issues/9)_
## Arcomage Original Game
Arcomage was initially developed by Stickman Games and later sold to The 3DO Company (3DO). The game appeared as a mini-game in _Might and Magic VII: For Blood and Honor_ (MM7) and _Might and Magic VIII: Day of the Destroyer_ (MM8), the seventh and eighth games in New World Computing (NWC)'s _Might and Magic_ (MM) series. (It's similar to _Gwent_ in _The Witcher_.) NWC and its parent company, 3DO, also released a standalone version in 2000, which can be played in single-player or multiplayer mode. The original standalone Arcomage has a resolution of 800 x 600 pixels and works in 16-bit color mode on Windows 10, but the graphics are unstable.
## Copyright
The code for the ArcoMage HD game: MIT License (c) [Tom Chen](https://tomchen.org/).
The assets, text, appearance, and other copyrightable elements of the game: (c) 2001 The 3DO Company.
See the [CREDIT.md file](CREDIT.md) for a detailed presentation of the copyright status, licenses, and credits for the game's components.
## Links
[](CHANGELOG.md) [](CREDIT.md) [](LICENSE.md) [](DEVELOPMENT.md) [](gamecontrols.md) [](troubleshooting.md)
[](https://arcomage.github.io/) [](https://github.com/arcomage/arcomage-hd) [](https://github.com/arcomage/arcomage-hd/issues) [](https://github.com/tomchen)
