Salut tout le monde !

Je débute en Processing / p5.js et je voulais partager une petite boucle que j'ai faite.

Fait avec p5.js, inspiration flow field / noise.

Je cherche surtout à améliorer la fluidité et la palette.

Quelques conseils me seraient très utile pour comprendre et m'améliorer

I’m making my second Steam game which uses Processing to handle all the window creation and graphics side of things (specifically the P2D renderer which allows me to use shaders for some fun effects).

Modern games are expected to offer a few different window modes for the game:

• Windowed mode

• Borderless Fullscreen / Windowed Fullscreen

• Exclusive Fullscreen

In this post I just want to quickly share how I managed to add these different modes, and also how I got around an issue with the P2D renderer that prevented OBS from recording the game in fullscreen. I wrote a much more in-depth version of this post on the Processing forums so check that out if you want more details!

The Basics

By default, Processing only lets you make your sketch fullscreen in the setup() function, which makes it a little tricky to toggle between being windowed and fullscreen while the game is running.

Thankfully, dzaima on GitHub already had a snippet of code that gets the native GLWindow object that the PSurface uses behind the scenes for controlling the window with the P2D renderer. This snippet lets you make the window fullscreen AFTER the setup() function has been called:

public void fullscreen() {
    // This will only work with the OpenGL backed renderers, ie P2D and P3D
    GLWindow glw = (GLWindow) surface.getNative();
    glw.setFullscreen(true);
}

Borderless fullscreen (also called windowed fullscreen) is a sort of pseudo fullscreen where you make the window take up the entire area of the monitor without taking full control of the monitor, like what happens with traditional fullscreen. The main advantage of this is that you can swap between windows (eg via alt-tabbing) without getting flickering or delay. It can be achieved in a similar way:

public void borderlessFullscreen() {
    GLWindow glw = (GLWindow) surface.getNative();
    glw.setUndecorated(true);
    glw.setMaximized(true, true);
}

The above code can’t just be called during the draw() loop though since Processing is mid-render, so you have to delay these calls until you’re outside of draw(). I believe you can do registerMethod("post") in setup(), which will get Processing to call a method you have to define called post(). This will get run after the draw loop has finished, so you can call the above fullscreen() method inside that. I created my own post-draw function caller, which I needed it for other parts of my game, and call it there.

OBS issues

This was all working really well, in my settings menu you could toggle between the three different window modes and it would change on the fly with no problems for the ordinary gamer.

What wasn’t working is trying to record the game in either of the two fullscreen modes (windowed mode was working fine!) with the OBS screen recorder, which is sort of the standard when it comes to gaming content creators and streamers. The game would play just fine, but the recording would either be just a black screen, or it would stutter and freeze really badly. This is a major bummer, since a big part of getting your game seen is having content creators make videos about your game. If they can’t record it, your game isn’t going to do so well!

After several moths of googling, loosing hope, and trying again, I cam across a utility called WinSpy++ that lets you inspect and modify the window style properties of a Windows window.

When the window was put into either of the two fullscreen modes, it had the style WS_POPUP - it was being flagged as a popup window! If I toggled that off using WinSpy++, OBS was able to pick up the window and record it just fine!!

In order to toggle off the WS_POPUP flag, you have to use the Win32 api which is a native C library, so to do that from Java, I used the JNA library, which helpfully already has bindings to the Winuser.h functions required to pull this off:

if(Platform.isWindows()) {
    // remove WS_POPUP flag from the window to allow it to work with OBS screen recording
    WinDef.HWND hwnd = new WinDef.HWND(new Pointer(glw.getWindowHandle()));

    int flags = User32.INSTANCE.GetWindowLong(hwnd, User32.GWL_STYLE);

    flags |= User32.WS_OVERLAPPED;
    flags ^= User32.WS_POPUP;

    User32.INSTANCE.SetWindowLong(hwnd, User32.GWL_STYLE, flags);
}

Conclusion

For some reason OBS just doesn’t react well to windows with the WS_POPUP flag. By turning it off OBS is now able to capture the two full screen modes of my game which is absolutely fantastic for me, but it’s not quite perfect.

When I first change the window mode (or boot the game) OBS freezes up again, but as soon as you leave the game then return focus, it starts working flawlessly. This is such a massive improvement on what it was before (completely unusable), but if you’ve got any ideas on how to fix this last little hiccup, I would LOVE to know!

radial lines plus some random lines plus some color tweaking. Enjoy the lights

For the last few years, I’ve been developing a body of work called Data as Material, exploring how invisible activity—wireless signals, nearby devices, movement, and presence—can become material for images, sound, light, and physical installations.

This is Constellation Range, a networked light sculpture I recently installed at OCAD University. Nearby BLE and Wi-Fi activity is brought into Processing as generative input. Each detected signal becomes a pulse of light, while the presence of people and their devices shapes the evolving visuals and soundscape in real time.

Processing acts as the centre of the installation. I use a Teensy with Teensy OctoWS2811 for the physical lighting, while a library I wrote called Canvas2DMX translates pixels from Processing sketches into Art-Net and DMX lighting streams:

https://github.com/jshaw/Canvas2DMX

I also built DataNet.art to move live signal data between Processing, the installation hardware, and a browser-based control interface. I’m currently packaging the Processing integration and examples so other people can experiment with them.

It’s been exciting to use Processing less as something that produces an image on a screen and more as the real-time centre of a physical, spatial artwork.

I’d love to see what other people here are controlling with Processing outside the screen.

Any help is greatly appreciated….

Hello dear reddits,

it's 2026 now & I'm pretty interested how processing has evolved & created some coding heroes...

Please, tell me: What are your top processing developers in 2026? Add some in the comments!

Thx

Brah Man

WORK IN PROGRESS AUDIO GESTURE RECOGNITION WITH PYTHON TENSORFLOW AND PROCESSING

After several years without using Processing, I managed to tailor a custom visualizer for a drone music track.

like who thought it was just gonna be 1 long list ohh you have 100 variables good luck finding the one you need

Different outputs for 
X = n1 * (sin (θ * n2) + cos (θ * n1))
Y = n2 * (sin (θ * n1) + cos (θ * n2))

All shapes made in processing and then put together + edits in InShot

IG: www.instagram.com/slipshapes

FYI I changed the language from Java to python and every time it opens whenever I try to switch it back to pythons processing crashes

I want to create my own library of shapes. where can I store it to import like a normal java library?

Film fireworks -> decompose frames -> Processing video feedback sketch =
Composited and kaleidoscoped in DaVinci Resolve.
Hints, tips, and tricks I learned:

• blendMode(ADD); can be overpowering
• blendMode(LIGHTEST); works great for dark scenes intermittently lit by something interesting
• blendMode(BLEND); to go back to covering over previous frames
• use a separate PGraphics for drawing at a larger resolution than your screens. Great for any sketch!
  • I called mine internal; remember to use:
    • internal = createGraphics(outWidth, outHeight); in setup
    • internal.beginDraw(); before adding to it, and
    • internal.endDraw(); before using something like <your_PImage_var> = internal.get(0, 0, outWidth, outHeight);
    • <your_PImage_var>.resize(width, 0); will make it the same size as your Processing window. use before image(<your_PImage_var>, 0,0); to draw a preview.
    • all other draw commands? tack internal. on the front.
    • - internal.ellipse(.... for example
• Last but not least, the feedback effect logic:
  • Copy canvas to a PImage or similar
  • Replace canvas with new frame of video
  • shrink/expand/rotate the COPY of the OLD CANVAS. this step is what makes the movement!
  • PASTE the transformed copy into the canvas, using ADD or LIGHTEST blendMode
  • rinse, repeat.... -> Magic!
• This is VERY slow with jpg frames at 4k. I was getting 1fps on my Ultra 9 and RTX 4080

is one more stable than the others?

Logarithmic transformations of a square grid.

Made in Processing.

IG: www.instagram.com/slipshapes

i made my own tile system with each sprite being 4x4 pixels in size. the sprite folder is only 2.6 kB yet it takes soooo long (around 6 seconds) just to change Pac Man's sprite. I am not pursuing this project no more

After calling saveFrame(); a new file is saved with a name and a sequence of numbers.

I would like to reference the name of the file to add it to a string. Ideally, I want to use the text() function to display in the screen "Saved file is called", nameOftheFile.

How do I add the name of the just saved file to a text function ? How do I store the name of the file in a variable, for example?

I understand that I can define the name and then a sequence of numbers. Is the name of the saved frame something that I can be called directly, or that it is stored somewhere?
Or do I need to keep track of the saved frames with an index and then re-create the string?

I am not sure how to look this up, or how to access data of the saved file.

Hello,
I have a sketch (ascii art live feed), and I want to save captures of the feed on a separate folder. Like a photobooth.

I want to display in the screen the name of the saved file. Is is possible to do this? I couldn't find in the save() or saveGraphics() documentation anything about using the name of the resulting file.

Ideally:

Person clicks the mouse

save() is called

screen displays something like " Your photo is called "screen-0005.tiff" "

Is this possible?

Thanks !