From cde0797d735eb68266cc0442beebdcc340d1f2d8 Mon Sep 17 00:00:00 2001 From: samseen Date: Tue, 6 Jan 2026 01:54:54 +0530 Subject: [PATCH] refactor: rewrite README for conciseness, adding Quick Start, Features, and Documentation sections while removing verbose node descriptions. --- .DS_Store | Bin 6148 -> 6148 bytes README.md | 223 +++++++++++++++++++++++------------------------------- 2 files changed, 94 insertions(+), 129 deletions(-) diff --git a/.DS_Store b/.DS_Store index cadc55320c8acef4e1332a8b8ecb501ae19d85c4..4909dbaf4cc1cee8b5914130221e1f51cf978697 100644 GIT binary patch delta 132 zcmZoMXffEJ#uR(Jn1O+Tg+Y%YogtH Create stunning before-and-after transition videos directly in ComfyUI. + This repository provides two powerful custom nodes for ComfyUI to create stunning before-and-after transition videos. These nodes are designed for visual comparisons, transformations, and creative effects, supporting both standard and depth map-based transitions. -## Features +## ✨ Features -- **SSBeforeAndAfterVideo**: Create videos with fade and wipe transitions between two images. -- **SSBeforeAndAfterVideoWithDepthMap**: Create depth-aware transitions using a depth map for more immersive effects. -- High-quality output with customizable resolution, frame rate, feathering, and looping. -- Automatic handling of output directories and filenames. -- Progress bar for frame generation. -- Robust ffmpeg integration for video encoding. +- 🔄 **SSBeforeAndAfterVideo** - Create videos with fade and wipe transitions between two images. +- 🌌 **Depth Map Support** - Create depth-aware transitions (SSBeforeAndAfterVideoWithDepthMap) for immersive effects. +- 🎬 **Customizable Output** - High-quality output with custom resolution, fps, feathering, and looping. +- ⚡ **FFmpeg Integration** - Robust video encoding. +- 📊 **Progress Tracking** - Built-in progress bar for frame generation. + +## 🚀 Quick Start + +### Prerequisites + +- ComfyUI installed +- FFmpeg installed and available in system PATH + +### Installation + +1. Go to your ComfyUI custom nodes directory: + ```bash + cd ComfyUI/custom_nodes + ``` +2. Clone this repository: + ```bash + git clone https://github.com/SamSeenX/ComfyUI_SSBeforeAfterNode.git + ``` +3. Install dependencies: + ```bash + pip install -r ComfyUI_SSBeforeAfterNode/requirements.txt + ``` +4. Restart ComfyUI. + +### Basic Usage + +1. Add the node **SSBeforeAndAfterVideo** or **SSBeforeAndAfterVideoWithDepthMap** to your workflow. +2. Connect your `before_image` and `after_image` inputs. +3. Configure parameters (transition type, duration, FPS). +4. Run the workflow. + +## 📖 Documentation + +### Node 1: SSBeforeAndAfterVideo + +Creates before-and-after transition videos using classic fade and wipe effects. + +**Parameters:** +- `transition_type`: fade, wipe_from_left, wipe_from_top, etc. +- `transition_duration`: 0.5 - 10.0 seconds. +- `feather`: Softness of the wipe edge (0.0 - 1.0). + +### Node 2: SSBeforeAndAfterVideoWithDepthMap + +Creates transitions using a depth map, revealing images based on depth (e.g., back-to-front). + +**Parameters:** +- `depth_map`: Input depth map image. +- `transition_type`: back_to_front, front_to_back, middle_out. +- `easing_method`: Smoothness of the transition. + +## 🏗️ Project Structure + +``` +ComfyUI_SSBeforeAfterNode/ +├── ss_before_after_video.py # Basic node logic +├── ss_before_after_video_with_depth.py # Depth-aware node logic +├── requirements.txt # Python dependencies +└── README.md +``` + +## 🤝 Contributing + +Contributions are welcome! + +1. Fork the repository +2. Create your feature branch +3. Commit your changes +4. Push to the branch +5. Open a Pull Request + +## 📝 License + +This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details. + +## ☕ Support + +If you find this project useful, please consider supporting me: + +- ⭐ Starring this repository +- 🐛 Reporting issues +- ☕ [Buy me a coffee](https://buymeacoffee.com/samseen) --- -## Node 1: SSBeforeAndAfterVideo - -### Description - -Creates before-and-after transition videos using classic fade and wipe effects. Ideal for showcasing transformations, comparisons, or visual storytelling. - -### Supported Transitions - -- **Fade**: Smoothly blends from the before image to the after image. -- **Wipe**: Animated reveal from left, right, top, or bottom, with optional feathered (blurred) edge. - -### Parameters - -- **before_image**: The starting image (tensor). -- **after_image**: The ending image (tensor). -- **transition_type**: Choose from `fade`, `wipe_from_left`, `wipe_from_top`, `wipe_from_right`, `wipe_from_bottom`. -- **fps**: Frames per second (1-120). -- **width/height**: Output video resolution (64-4096 px). -- **output_path**: Output directory (default `/output/`). -- **filename_prefix**: Prefix for output video files. -- **transition_duration**: Duration of the transition (0.5-10.0 seconds). -- **hold_duration**: Time to hold before and after images (0.0-5.0 seconds). -- **feather**: Feathering amount for wipe transitions (0.0-1.0). -- **loop_transition**: If enabled, the video will loop back to the start. - -### How It Works - -1. **Resizes** both images to the specified resolution. -2. **Generates frames** for the hold, transition, and (optionally) loop-back phases. -3. **Applies the selected transition** (fade or wipe) with feathering. -4. **Saves frames** to a temporary directory. -5. **Encodes video** using ffmpeg. -6. **Cleans up** temporary files and returns the video path and a preview frame. - ---- - -## Node 2: SSBeforeAndAfterVideoWithDepthMap - -### Description - -Creates before-and-after transition videos using a depth map to control the transition. This enables advanced effects like revealing the after image from back-to-front, front-to-back, or from the middle outwards, based on scene depth. - -### Supported Transitions - -- **back_to_front**: Reveals the after image starting from the farthest (background) regions. -- **front_to_back**: Reveals the after image starting from the closest (foreground) regions. -- **middle_out**: Reveals the after image from the center depth outward. - -### Parameters - -- **before_image**: The starting image (tensor). -- **after_image**: The ending image (tensor). -- **depth_map**: Depth map image (tensor, same size as input images). -- **transition_type**: Choose from `back_to_front`, `front_to_back`, `middle_out`. -- **fps**: Frames per second (1-120). -- **width/height**: Output video resolution (64-4096 px). -- **output_path**: Output directory (default `/output/`). -- **filename_prefix**: Prefix for output video files. -- **transition_duration**: Duration of the transition (0.5-10.0 seconds). -- **hold_duration**: Time to hold before and after images (0.0-5.0 seconds). -- **feather**: Feathering amount for the depth mask (0.0-1.0). -- **loop_transition**: If enabled, the video will loop back to the start. -- **easing_method**: Transition easing ("none", "ease-in", "ease-out", "both"). - -### How It Works - -1. **Resizes** all images to the specified resolution. -2. **Normalizes the depth map** and creates a mask based on the selected transition type and progress. -3. **Applies feathering** to the mask for smooth transitions. -4. **Blends images** according to the mask for each frame. -5. **Handles looping** and hold frames as configured. -6. **Encodes video** using ffmpeg and cleans up temporary files. - ---- - -## Installation - -1. Place this folder in your `ComfyUI/custom_nodes` directory. -2. Install dependencies: - ```bash - pip install -r requirements.txt - ``` -3. Ensure ffmpeg is installed and available in your system PATH. - ---- - -## Usage - -1. Restart ComfyUI after installing the node. -2. Add the desired node (`SSBeforeAndAfterVideo` or `SSBeforeAndAfterVideoWithDepthMap`) to your workflow. -3. Configure the parameters as needed. -4. Run the workflow to generate your before-and-after transition video. -5. The output video and a preview frame will be saved to your specified output directory. - ---- - -## Troubleshooting - -- **ffmpeg not found**: Make sure ffmpeg is installed and accessible from your system PATH. -- **Missing dependencies**: Install all required Python packages listed in `requirements.txt`. -- **Output not appearing**: Check the output directory path and permissions. - ---- - -## License - -MIT License - ---- - -## Credits - -Developed by SamSeen. Inspired by creative visual storytelling needs in ComfyUI. - ---- - -## Contribution - -Pull requests and suggestions are welcome! +Created with ❤️ by [SamSeen](https://buymeacoffee.com/samseen) \ No newline at end of file