PocketFX

Standalone PixiJS particle editor for authoring VFX packs.

Commands

• npm run setup: install all dependencies from the lockfile.
• npm run dev: start the local authoring server.
• npm run build: typecheck and build the app.

Setup

Install Node 22 LTS or newer first. Then run the command for your machine.

Mac terminal:

cd ~/Desktop/PocketFX && npm run setup

Windows PowerShell:

cd "$env:USERPROFILE\Desktop\PocketFX"; npm run setup

After setup, start PocketFX with:

npm run dev

Local Libraries

• Effects are saved as JSON in public/config/particle-data/effects.
• Imported texture files are stored in public/assets/particles.
• Effect JSON mirrors the GrassGame particle schema: emitter mode, modules, emission, shape, velocity, color gradient, size, rotation, renderer, billboard, and mesh settings. PocketFX adds billboard.textureId for texture-backed particles.

Artist To Developer Flow

1. Create or tweak an effect in the editor.
2. Import PNG, JPEG, or WebP textures into the texture library.
3. Assign textures to emitters from the Appearance panel.
4. Save the effect.
5. Use Export Pack to download a .zip with:
   • pocketfx.json
   • effects/*.json
   • textures/*
   • runtime/pocketfx-loader.ts

The exported manifest includes a PixiJS Assets bundle so developers can load only the textures referenced by the effect.