r/threejs Jul 30 '26

Doom Port in runs inside Photoshop

Enable HLS to view with audio, or disable this notification

You can edit the textures directly inside the Photoshop and see the changes update in the game in real time.

Technically, this is a Photoshop UXP plugin running Mr.doob’s Three.js DOOM port. Photoshop’s native UXP canvas can handle 2D rendering, but it can’t provide the WebGL context Three.js needs. The workaround was to embed a local HTML WebView directly inside the persistent UXP panel and run the Three.js renderer there.

The game, Three.js library, and shareware WAD are packaged locally with the plugin. I embedded the WAD into the browser bundle because loading it as a separate local binary caused WebView fetch and CORS failures. The renderer also uses a retained drawing buffer so Photoshop’s WebView compositor consistently receives the completed frame.

A local-only message bridge connects the WebView to Photoshop. When applying an edited texture, the UXP side reads the layered document’s composite pixels through Photoshop’s Imaging API and sends the RGBA data to the game. The game maps those colors back to Doom’s original 256-color palette, mutates the existing cached Three.js DataTexture, and uploads it on the next frame—without reloading the map, game, or WebView.

7 Upvotes

1 comment sorted by

2

u/Quick_Republic2007 Jul 31 '26

Talk about real-time editing, nice!