01 Purpose
Architect is how PhreeLabs makes games on Webs: drawing, animating, scripting, and testing in one place, then packaging the result.
Intended user: a game author working on Webs, starting with PhreeLabs’ own projects.
02 Problem and Constraints
A Webs game needs art, animation, hitboxes, stages, and scripts that match the engine exactly. A preview that runs a separate simulator drifts from the real game.
- The preview must run the engine’s own match code, not a second simulator.
- Projects are real files (.wbs) with backups and revision conflicts, not browser storage.
- Scripts are checked in the engine’s sandbox before each test.
- Existing editors are reused where they already work, with their licenses kept.
03 What Was Built
- Animation, Collision, Effects, Audio, and Code workspaces in one window, with Pixel and World workspaces embedded.
- PNG import: drop artwork onto an empty canvas to create the first frames.
- Code editing with the Monaco editor; real Webs Lua is validated before the test match restarts.
- Scene testing: static orthogonal stages compile and run in the native Webs engine from inside the app.
- Game packaging: a saved scene or menu screen becomes a standalone Mac app with the Webs player, compiled characters, stage art, and license notices.
- Menu audio: choose looping music and sounds for entering a screen, focusing a button, and activating it. The sounds are included in the packaged game.
- Saved settings and progress: menu scripts store small values across launches. Volume was checked after reopening a packaged game, and a damaged save file is set aside safely.
- Throw authoring: mark a move’s attack as a throw that beats guard and misses airborne targets, using the engine’s existing hit behavior.
04 Design and Engineering Decisions
- 01
Native Shell, Web Workspaces
An AppKit shell owns windows, files, and packaging. The workspaces are React running in WebKit, each with its own private data store.
- 02
One Simulation, Not Two
The C++ preview uses the same match, input, frame, and hitbox code as the Webs player, so what you test is what plays.
- 03
Python Owns the Document
Python handles .wbs persistence, validation, and export, keeping file rules in one place for the app and its tests.
- 04
Reuse Proven Editors
Pixel art runs StudioX, PhreeLabs’ pixel tool built on the MIT-licensed Stretchy Studio. The World workspace embeds a build of the open-source Tiled map editor (1.12.2) as a native view, with only small boundary code added around it.
- 05
Packaging That Never Overwrites
Packaging writes a new app at a location you choose. Existing apps are never replaced, and a failed build leaves nothing behind.
05 Architecture
06 Verified Results
| Measure | Result | Context |
|---|---|---|
| Engine tests | 22 of 22 passing | CTest on the committed source of the bundled player, 4 November 2026 |
| Document persistence and export | 189 of 189 passing | Python test suites that run without the packaged app, 4 November 2026 |
| Editor workflow against the engine | 12 of 12, with 54 native tick and facing comparisons | Browser-driven workflow test, 14 October 2026 |
| Packaged app acceptance | 11 of 11 suites, 158 checks | Scripted runs of the built app, 4 November 2026 |
| Saved settings | A volume setting survived two launches | A built game moved away from its project, with a corrupt-file recovery test, 4 November 2026 |
| Menu audio | Peak level 0.37 measured at the game’s mixer | Software measurement at the game’s mixer with the output device muted |
| World map codec | 248 strict checks passing, also under AddressSanitizer and UndefinedBehaviorSanitizer | 15 October 2026 |
07 Third-Party Components
Stretchy Studio (MIT, © 2026 Nguyen Phan) as the base of StudioX; Tiled 1.12.2 and Qt in the World workspace; the Monaco editor; React, Zustand, Immer, Lucide, and JSZip; FreeType for screen text in packaged games. Runtime license notices ship inside packaged games.