Open source is at the heart of FrameFuseVid. Whether you are a developer, designer, or end user, there are many ways to help make this tool better for everyone.

Development Setup

FrameFuseVid is built with Electron 40, React 18, Tailwind CSS, and Vite. If you are familiar with modern web development, you will feel at home.

bash Terminal
# 1. Fork on GitHub, then clone your fork
git clone https://github.com/YOUR_USERNAME/framefusevid.git
cd framefusevid

# 2. Install dependencies
npm install

# 3. Start the dev server (Vite + Electron with hot-reload)
npm run dev
Tip

The app uses concurrently and wait-on to start Vite first and then launch Electron once the dev server is ready. Changes to React code hot-reload instantly; changes to the main process require a restart.

Project Structure at a Glance

src/ App.jsx (UI + 4 steps) main/main.js (Electron) main/preload.js (IPC) Config vite.config.js tailwind.config.js package.json CI / Docs .github/workflows/ docs/ CONTRIBUTING.md

Ways to Contribute

1. Report Bugs

If you find an issue, open a GitHub issue using the bug report template. Include your OS, Node.js version, and steps to reproduce.

2. Request Features

Have an idea for a new layout, format support, or workflow improvement? Open a feature request issue or start a discussion.

3. Submit Pull Requests

Ready to write code? Here is the workflow:

bash PR Workflow
# Create a feature branch
git checkout -b feat/my-awesome-feature

# Make changes, test with dev server
npm run dev

# Commit with a descriptive message
git commit -m "feat: add custom watermark overlay option"

# Push and open a PR on GitHub
git push origin feat/my-awesome-feature

4. Improve Documentation

Found a typo, unclear instruction, or missing guide? PRs to the docs/ directory are welcome. The documentation site deploys automatically via GitHub Pages.

5. Test on Your Platform

Try FrameFuseVid on different operating systems and Zoom recording configurations. Edge cases and platform-specific issues are valuable reports.

Code Style Guidelines

Code of Conduct

This project follows a Contributor Code of Conduct. By participating you agree to abide by its terms. We are committed to providing a welcoming and inclusive experience for everyone.

Read Full Contributing Guide