RippleEdit

RippleEdit is a native macOS SwiftUI editor for product demo videos. It is designed for placing animated click or tap ripple overlays on top of screen recordings, adjusting their timing visually, and exporting a finished video.

The UI follows a Mac-native editing layout:

• large video preview in the center
• timeline at the bottom for ripple timing
• collapsible Format & Style inspector on the right
• shape picker and export actions in the top toolbar

Features

• Import MP4, MOV, AVI, and M4V clips
• Preview animated ripple overlays directly on top of the video
• Add ripple shapes:
  • rounded rectangle
  • capsule
  • circle
• Drag and resize ripples in the preview
• Adjust ripple timing visually in the timeline
• Edit ripple parameters per object:
  • ripple layers
  • layer spacing
  • color
  • propagation distance
  • ripple width
  • edge fade mode
  • edge fade width
  • saturation decay
  • spread speed
  • opacity
  • rounded rectangle corner radius
• Export a new MP4 with the ripple animation burned into the video

Tech Stack

• SwiftUI
• AVFoundation
• AVKit
• AppKit
• XcodeGen

Project Structure

• Sources/RippleEdit: application source
• RippleEdit.xcodeproj: generated Xcode project
• project.yml: XcodeGen project definition
• Package.swift: Swift Package entry for local builds

Getting Started

Open In Xcode

Open the project file:

open RippleEdit.xcodeproj

Then choose the RippleEdit scheme and run the app.

Build From Terminal

git clone https://github.com/shuhari04/RippleEdit.git
cd RippleEdit
swift build
swift run

How To Use

1. Launch the app.
2. Click Import Video and choose a screen recording or product demo clip.
3. Click the + button in the toolbar and add a ripple shape:
   • rounded rectangle
   • capsule
   • circle
4. Drag the ripple in the preview to position it.
5. Resize it from the selection handle.
6. Drag the ripple marker in the timeline to adjust when it appears.
7. Select the ripple and open Format & Style to fine tune its appearance.
8. Click Export to render a new MP4 with the ripple overlay burned into the video.

Inspector Controls

Each ripple can be adjusted with:

• ripple layers
• layer spacing
• ripple color
• propagation distance
• ripple width
• edge fade mode
• edge fade width
• saturation decay
• spread speed
• opacity
• rounded rectangle corner radius

Requirements

• macOS 13 or later
• Xcode 15 or later recommended
• Swift 5.10 toolchain recommended

Notes

• The project currently targets macOS 13+.
• Export is implemented as MP4 output with ripple overlays composited into the video.
• The app is currently optimized for a single-track ripple editing workflow rather than full nonlinear editing.

License

MIT