Machtobs - OBS Setup Assistant 🎥
A web app that configures OBS Studio around the user's hardware.
Machtobs is a web app that configures OBS Studio for the user's hardware. It analyzes the system, generates AI-backed streaming and recording recommendations, explains each setting, compares them with the current configuration, and applies the changes directly to OBS.
I built it as a more transparent alternative to OBS's automatic setup wizard. Before changing anything, Machtobs shows what will change and why, lets the user edit the recommendation, and explains the impact again. It also backs up the previous configuration so it can be restored at any time.
## Stack & decisions
- React 19 + Vite — I built the interface as a four-step guided flow covering connection, settings, detection, and scenes, including a preview of the stream output.
- OBS WebSocket (obs-websocket-js) — The browser connects directly to OBS on the same machine. Passwords, scenes, and configuration stay local and are never sent to external servers.
- Groq + Tavily + Vercel Functions — AI recommendations and external searches run through serverless functions. Only the necessary hardware specifications are sent, while private keys remain in Vercel's environment.
- Web APIs — The GPU is detected through WebGL and capture devices through mediaDevices. Exact CPU and RAM details are requested manually because of browser security limits.
- Zustand — It manages global state for the OBS connection, detected hardware, editable recommendations, and configuration comparisons.
- Vitest + TypeScript + linting — The project includes automated tests, type checking, and static analysis.
## What I built
- A guided flow for configuring OBS without prior knowledge of its advanced settings.
- A visual comparison between the current and recommended configuration before changes are applied.
- Automatic backup of the previous configuration with one-step restoration.
- Editable recommendations followed by a new AI explanation of their impact.
- A local recommendation engine used as a fallback when AI is unavailable or the usage limit is reached.
- Support for console setups by detecting capture cards and using their real capabilities to recommend the capture chain.
## Keep exploring
A more visual and direct website redesign for an Argentinian restaurant.
A recreation of the scroll effect from Rockstar Games' official website.