>_ DevTrendses

Idioma

Inicio

Lenguajes

Secciones

Frontend Backend Móvil DevOps AI / ML GameDev Blockchain Embebidos Seguridad
C-plus-plus

Cómo mostrar limpiamente las entradas de teclado y gamepad en tu stream de OBS Studio

logo

Cuando grababa mis primeros screencasts desglosando atajos de teclado en mi editor de código, no podía dejar de pensar: los espectadores no tienen ni idea de lo que realmente estoy presionando. Tenía que decir en voz alta cada combinación como Ctrl+Shift+P, o dibujar manualmente pistas visuales durante la edición. No es ideal, especialmente cuando el video dura media hora.

Los gamers y speedrunners enfrentan esto aún más a menudo. Mostrar la temporización de las pulsaciones del gamepad o los mecánicas de bunny-hop en un shooter sin una superposición visual es prácticamente imposible.

Por lo general, estas tareas se resuelven con soluciones alternativas: lanzar una utilidad de terceros en una ventana separada y capturarla a través de OBS usando Window Capture con clave de color. Esto consume recursos adicionales de CPU y se ve desordenado. El plugin input-overlay del desarrollador univrsal resuelve esto de manera diferente. Se integra directamente en OBS Studio como una fuente nativa.

Qué puede hacer este plugin

El proyecto está escrito en C++ y se ejecuta en versiones de 64 bits de Windows y Linux. Su tarea es sencilla: interceptar la entrada de los dispositivos y dibujarla sobre la escena en tiempo real con latencia mínima.

Los dispositivos compatibles incluyen:

  • Teclados estándar (con soporte para cualquier distribución y modificadores)
  • Ratones (seguimiento de botones, rueda de scroll y movimiento del cursor)
  • Gamepads y controladores (Xbox, PlayStation, DirectInput/XInput universales)

En lugar de un primitive log de texto, el plugin utiliza texturas y sprites personalizados. Tomas una imagen de un gamepad o teclado, la divides en estados (botón liberado / botón presionado) y enlazas los gráficos con los eventos del sistema.

Qué hay dentro: arquitectura y dependencias

El código base del proyecto contiene varias soluciones interesantes. Para evitar reinventar la rueda para cada tipo de dispositivo, el autor incluyó bibliotecas probadas de bajo nivel.

Para la interceptación global de teclado y ratón, utiliza libuiohook. Esta biblioteca funciona a nivel de hooks del sistema operativo, lo que hace posible escuchar la entrada incluso cuando la ventana de OBS está en segundo plano o un juego se ejecuta en modo pantalla completa.

Los gamepads son manejados por SDL2. Esto garantiza una excelente compatibilidad con controladores de diferentes generaciones sin meterse con descriptores de dispositivos sin procesar.

La integración de mongoose merece atención especial — un servidor web ligero embebido. ¿Por qué necesitaría uno un plugin de captura de teclas? Si estás transmitiendo desde dos computadoras (una para gaming, la otra como codificador de streaming), puedes enviar eventos de entrada a través de la red local desde la PC de gaming directamente a la instancia de OBS en la máquina de streaming. Una característica muy inteligente que elimina el desorden de cables.

Cómo construir tu propia superposición

La configuración del plugin consiste en dos archivos: una textura gráfica PNG y un archivo de diseño JSON.

Anteriormente el proyecto usaba el formato .ini, pero eventualmente cambió a JSON. Para que no tengas que calcular coordenadas de píxeles para los botones en un bloc de notas, el autor publicó un editor visual web llamado Config Creation Tool (CCT).

Subes tu sprite sheet en el navegador, colocas cajas delimitadoras sobre los botones, los enlazas a códigos de teclas y exportas la configuración terminada:

Después de eso, simplemente agregas una nueva fuente "Input Overlay" en OBS Studio, le indicas el JSON y el PNG, y el widget está listo. El plugin renderiza las texturas a través del pipeline gráfico de OBS, por lo que la sobrecarga de renderizado es prácticamente cero.

Dónde resulta útil para los desarrolladores

Podría parecer una herramienta estrictamente para streamers. Pero para contenido técnico es igual de útil:

  1. Grabar screencasts educativos. Demostrar atajos de teclado en Vim, Emacs, Blender o VS Code ayuda a los espectadores a replicar acciones sobre la marcha sin distraerse con las pausas.
  2. Probar gamepads y latencia de entrada. Si estás desarrollando un juego indie o emulador, la superposición te permite verificar visualmente las pulsaciones del controlador con las reacciones del personaje en pantalla.
  3. Presentaciones y demos de equipo. Durante escenarios complejos de UI o tutoriales de utilidades de terminal, los espectadores ven inmediatamente los modificadores y las teclas de función.

Matices y limitaciones

La documentación en el repositorio es concisa, por lo que los principiantes necesitarán dedicar media hora a entender la estructura de los sprites. Crear un skin pulido desde cero requiere habilidades básicas de editor gráfico.

Ten en cuenta también la privacidad. Dado que los hooks interceptan la entrada globalmente, durante un stream o grabación de video la superposición mostrará fielmente cualquier pulsación de tecla si empiezas a escribir contraseñas o datos privados. Para estos casos, es mejor configurar una tecla de acceso rápido para ocultar la fuente en OBS de antemano.

El plugin también está enfocado en Windows y Linux x64 — las compilaciones para macOS no son oficialmente compatibles.

¿Vale la pena probar?

Si necesitas una forma limpia y con buen rendimiento de mostrar la entrada de dispositivos en OBS sin soluciones alternativas de navegador y caídas de frames, input-overlay es una de las opciones más confiables.

El proyecto ha estado activo desde 2017, ha recopilado más de 4,000 estrellas y aborda una tarea específica sin inflar el código. Los binarios precompilados están disponibles en la pestaña Releases en GitHub, y los presets listos para usar para gamepads y teclados se pueden encontrar en los foros de OBS Project.

Proyectos relacionados