Comfy Controller - The extension to build custom GUIs on each workflow! [1.4] [WIP 1.5]

[LukeG89]

Alpha Updates: 1.4

Beta Updates: 1.4.1 on dev | Working on 1.5! 🔧

🚧 1.5 - ☑️Batch support (see the full Milestone)
🚧 1.4.1 - ☑️Improved snapping - ☑️Fit view to group - ☑️Progress bar on Preview Image
✅ 1.4 - Progress bars - Scrollbar options - Resize by dragging edges - Snap windows
✅ 1.3 - Group tabs - Bypass group - Live generation preview in Preview Image
✅ 1.2 - Multiple floating windows
✅ 1.1 - Independent floating window

Comfy Controller (cg-controller) is developed by @chrisgoringe, the same developer of cg-use-everywhere

1.4 preview 👀

Help us improving Comfy Controller! 🚀

New feedback and user-experiences are needed for the upcoming releases!

Join Discord

Check the Discussions

See the Milestones

Open a Bug report or a Feature request

How to install:

Alpha releases:

You can install and update the main stable version through the Manager. Search "Comfy Controller" 🔎

Beta releases:

Installing using git

After you installed the stable release, you can:

• Go to your custom_nodes/cg-controller folder
• Open terminal
• Use this command to install dev branch:

git switch dev

OR

• Use this command to install 1.5 branch:

git switch 1.5

And then, use this command to update the branch you choose:

git pull

Manual installation

If you don't have git installed, you can:

• Go to the dev branch OR 1.5 branch
• Click on Code -> Download ZIP
• Extract it and place it in your custom_node folder

Tip

After the installation, you can update the Beta Controller through the Manager!

Important

Update ComfyUI and all custom nodes before testing and reporting issues!

[JorgeR81]

Proof of concept !

This is NOT a mockup.

It's just a screenshot taken while using the dev branch

This version allows multiple controller instances.
With multiple controllers, the user could assemble a whole custom GUI, on top of the graph canvas, for each workflow.

And we can hide this GUI, in with a toggle button in the Top Bar ( next to the Manager ), or via keybind: c

But for you to build a whole GUI, it would only be practical to do so, once we have panel "snapping" ( chrisgoringe/cg-controller#228 ), witch may happen in version 1.3 ( https://github.com/chrisgoringe/cg-controller/milestone/26 )

---

This is the default workflow.

---

Here the Image Preview controller is collapsed, so that we can see the workflow.

You can see the collapsed controller panel, in the top left corner of the graph canvas area.
It's also possible to interact with the workflow in this configuration.

---

One downside of completely covering the graph canvas is not seeing the workflow progress.
But we can enable the rgthree's progress bar.

[rollingcookies]

Guys, look at how it's already implemented in Invoke AI, I've been using it for a while and the Workflows tab is how the UX in ComfyUI should look like and be organized. And it's drop dead convenient!

The panel on the left is all the assigned fields in separately selected nodes (not the whole node, just the individual fields) and also in the panel for a particular field you can specify a different name. In this way a Dashboard of specific workflow controls is assembled.

The right side of the screen is occupied by the workflow or a big picture of the generation process. This state is easily toggled with a button. The generation process on the fly shows what is happening in the sampler, so that you can stop the process in the early stages of generation. Or this area can also be used to preview images from a gallery of already generated images.

Thus, we get a simple and convenient uniform interface, where everything is always in its place. And whatever workflow we open, it doesn't take long to figure out, because there is a “Dashboard” mode with the control panel on the left and the output image / series of output images on the right in an area that takes up most of the screen.

[JorgeR81]

@LukeG89, in the images we can see that @rollingcookies, already has the Manager.

If the Controller was installed via Manager, maybe the easier way, is to use git switch, once we have a "cg-controller" folder.
There is no need to delete folders or use git clone

[JorgeR81]

@rollingcookies, now we only have main and dev branches. The others were removed.

• In the main branch, we can add multiple floating windows ( it was the previous 1.2 branch )

• In the dev branch, we have Group Tabs - Bypass Group - Live generation preview in Preview Image ( previous 1.3 branch )

---

To check your current branch, run: git branch --show-current

Like this:

[rollingcookies]

Everything works guys, thanks!

[LukeG89]

@rollingcookies Yay! 🎉
New feedbacks are welcome!
If you encounter any bugs or you have a suggestion, please open a new issue here!

[rollingcookies]

@LukeG89 Of course they will 😄, I've long wanted a solution inside ComfyUI that avoids resorting to the glitchy and ugly SwarmUI 😄!

[JorgeR81]

Some development updates:

Here is a 3 stage workflow, with FaceDetailer and ControlNet.

All nodes have the image on top of the widgets, so that all images are the same level.

---

Here I added a Load Image node, to another Controller, to show a larger preview of the final image.

---

The generation preview from of all the samplers in the previous stages, will be shown in this large Image area.

The in-progress preview in the Preview Image node, is working only in branch 1.3, so is still experimental.

---

If I colapse the Controller for the large image area, you can see the whole workflow.

That small blue group at the right, is used to feed the large image area.
It has an Image Preview node, with a darker grey color ( the same color shown in the large image area ).

[JorgeR81]

Group Nesting was just added to ComfyUI ( Comfy-Org/ComfyUI_frontend#1416 )

Now we can have groups within groups !

And it seems to work very well with the Controller.