~/proyectos/obsee

obsee - Asistente de configuración para OBS 🎥

Configura OBS desde el navegador aunque no lo domines: analiza tu hardware, te explica cada ajuste y aplica la configuración recomendada a OBS con un clic.

React 19 ★ — — commits updated —

obsee es una app web que configura OBS Studio por ti: analiza tu computadora, pide a una IA la mejor configuración de stream y grabación para tu hardware, te muestra qué va a cambiar y por qué, y la aplica a OBS con un clic. La idea no es reemplazar OBS, sino hacerlo más fácil de entender.

Me interesaba ir más allá del asistente automático de OBS, que funciona como una caja negra. obsee explica por qué cada ajuste tiene sentido para tu equipo, muestra la diferencia entre tu configuración actual y la recomendada antes de tocar nada, deja editar la recomendación —y la IA re-explica el impacto de tus cambios— y guarda un respaldo de tu configuración anterior para restaurarla cuando quieras.

## Stack & decisiones

  • React 19 + Vite — Construí la interfaz como un flujo guiado en 4 pasos —conectar, ajustes, detección y escenas— con vista previa en vivo de lo que verá el stream.
  • OBS WebSocket (obs-websocket-js) — El navegador se conecta directo al servidor WebSocket de OBS en la misma máquina: la conexión es 100% local y tu password, tus escenas y tu configuración nunca pasan por internet.
  • Groq + Tavily en Vercel — La IA corre en funciones serverless (Groq para recomendar, Tavily para búsqueda web); a la IA solo viajan specs anónimas del hardware y las claves viven únicamente en el entorno de Vercel, el frontend no contiene secretos.
  • APIs del navegador — Detecto la GPU vía WebGL y las capturadoras HDMI con permisos de cámara (mediaDevices); el modelo de CPU y la RAM se piden en un formulario porque el navegador no puede leerlos.
  • Zustand — Maneja el estado global del flujo en el navegador: conexión con OBS, recomendación editable y comparación de ajustes.

## Qué construí

  • Flujo guiado en 4 pasos —conectar, ajustes, detección y escenas— para configurar OBS sin saber de OBS.
  • Muestro un diff entre la configuración actual de OBS y la recomendada antes de tocar nada, con respaldo automático para restaurar la anterior cuando quieras.
  • Dejo editar la recomendación antes de aplicarla, y la IA re-explica el impacto de tus cambios.
  • Si la IA no está disponible (sin red o por límite diario), un motor de recomendación local genera la configuración de respaldo: la app nunca se queda sin respuesta.
  • Perfilo también consolas (PS5/Xbox/Switch): detecto la capturadora, leo sus capacidades reales desde OBS y recomiendo la cadena de captura completa.
  • Suite de tests con Vitest, además de typecheck y lint.

## Sigue explorando

ver todos ↗
🚀

Un chat con IA para practicar streaming antes de salir en vivo.

Astro
React
Tailwind
Clerk
🎮

Un clon de Twitch para practicar React, Astro y consumo de APIs reales.

Astro
React
Tailwind