Derp Image Deck

The Derp Image Deck is the pack's centerpiece, and it's a different animal from the other derp nodes. It's a Deck Pressure hub: other derp nodes and whole stacks can be docked onto its edges, so instead of a loose pile of sliders and toggles drifting around your canvas, you get one tidy UI surface with your controls pinned to its sides. And as its name suggests, it also displays images. Part of xcp_derp-UI (search "xcp_derp-UI" in ComfyUI Manager, by lordwedggie), under derpNodes/ControlDeck.

Why you'd reach for it

Two distinct jobs, both worth having.

First, the gallery. It takes an optional images input of type IMAGE - wire your Save Image / Preview output into it and it acts as an image deck: a gallery that collects what your workflow produces, with the node's title bar appending "Image received at HH:MM:SS, Res: WxH" as images arrive. There's a SAVE IMAGE button that lights up when the current image hasn't been saved yet, and gallery navigation through the batch. It's marked as an output node, so it always runs and shows you results in place.

Second, and this is the interesting bit: docking. Grab other derp nodes - sliders, toggles, loaders, seeds - and dock them to the deck's left, right, top, or bottom edges. Once docked they behave like a single node; the deck becomes a hub with control panels hanging off its sides. The docs describe it as "fast and easy custom build UI surfaces for all your workflow needs," which is the pack's whole thesis in one sentence: complex setups stay readable because the controls live in one place and the workhorse nodes live somewhere else entirely.

How it works

The Python side is honest about its job: it takes the optional IMAGE input, converts each frame to a PNG in ComfyUI's temp directory, and returns {"ui": {"images": ...}} so the frontend displays them. No MODEL or LATENT logic here - the mechanism is simple.

The decking/docking behavior is the JS layer's territory. It's built on the pack's Fatha framework, and the visual result is a resizeable frame: the four outer edges of the Deck Pressure frame resize the docked stacks (single-axis), while the corners resize the hub itself. You can literally drag the seams between docked nodes to rebalance how much room each control gets. If no stack covers an edge, the edge behaves like the hub's own edge, so you're never fighting invisible resize handles.

Install

cd ComfyUI/custom_nodes
git clone https://github.com/lordwedggie/xcp_derp-UI-Release

Restart ComfyUI. No pip requirements, no npm install (dependencies are vendored), no model files. Manager users: search xcp_derp-UI.

The honest caveats

This is the most complex node in the pack, and complexity shows. The changelog is dense with docking fixes - seam resize hitboxes, deck graph indexing, per-frame performance passes - which tells you two things: the feature is actively worked on, and it's not exactly battle-tested by a huge community. This pack has near-zero third-party documentation at the time of writing, so if docking feels fiddly, you're not doing it wrong; you're on the bleeding edge of a small pack's flagship feature.

Practical advice: start by docking just one node (a Derp Toggle or Slider) to one edge before building a full instrument panel. And when you do hit the seam-drag resize handles, remember the corner vs. edge distinction - corners resize the hub, edges resize the attached stacks. Get that wrong and you'll wonder why your sliders are suddenly tiny.