Editor

El editor tiene cinco áreas: a la izquierda las pestañas Capas, Variables, Medios y Ajustes (además Bot de Ventoview en el bot del chat y Atajos en el módulo Atajos), en el centro el lienzo, a la derecha las propiedades de la capa seleccionada y abajo la línea de tiempo.

La pestaña abierta está abajo con su nombre y se une al área; las demás están encima como pequeñas casillas con icono – al pasar el ratón se ve su nombre. Junto a la pestaña “Capas” están las herramientas Abrir todo / Cerrar todo (grupos), Seleccionar todo, Deseleccionar y ✦ Efectos; si la columna es estrecha se juntan, reciben nombres cortos y al final pasan al menú “⋯”.

Capas

Capa	Para qué
Texto	Cualquier texto con variables, p. ej., Hora: {zeit}. Colores en el texto con [farbe=#ff0000]rojo[/farbe].
Imagen / Vídeo	Archivos propios (pestaña Medios) o imágenes de los módulos. Alt al arrastrar los tiradores recorta. Forma: rectángulo (esquinas también por separado), círculo/óvalo, hexágono, rombo, triángulo, estrella, corazón. El marco con ancho, color y estilo (línea, guiones, puntos, doble) sigue la forma. Desenfoque: tantos como quieras uno encima de otro (“+ Desenfoque”) – entero, borde (centro nítido), un lado (arriba/abajo/izquierda/derecha con alcance), punto focal (círculo nítido alrededor de un punto) o tilt-shift (franja nítida). Cada uno con intensidad, suavidad e “Invertir”.
Sonido	Suena desde su inicio en la línea de tiempo. Invisible en el overlay.
Panel	Rectángulo con color, degradado, esquinas y marco – p. ej., como fondo. “Solo borde” (junto al color del marco) hace transparente el panel.
Forma	15 formas (estrella, anillo, arco, flecha, corazón, bocadillo, onda …) con ajustes propios como picos, grosor o ángulo del arco. Aquí también hay “Solo borde”.
Grupo	Carpeta para varias capas, disponible en cada editor. Selecciona capas y “Agrupar” (Ctrl+G) – o arrastra capas al grupo en la lista. Un clic en un elemento selecciona todo el grupo: mover, alinear, copiar, ocultar y eliminar se aplican a todos. Solo un elemento: doble clic en el lienzo o clic en la lista. Ctrl+Shift+G o “Desagrupar” lo deshace. En “Transformar” el grupo tiene posición, ancho/alto %, rotación y opacidad propios – afectan a todo lo de dentro sin cambiar las capas (una capa sacada vuelve a estar como antes). Como una capa, el grupo también tiene efectos (se aplican a todas las capas adecuadas de dentro, p. ej., efectos de audio solo a sonido/vídeo) y keyframes: ◆ en cada valor o “+ Pista de keyframes” para opacidad, desplazamiento, tamaño, rotación y los controles de efectos. Sus pistas duran todo el diseño.
Plantilla	Incrusta un diseño guardado completo (módulo Link).
Barra, visualizer, confeti, marco	Vienen con módulos (Música, Stream-Chat, Alerts, Marcos …) y solo aparecen en el editor de ese módulo o en cuanto el módulo es fuente de datos.
Lista	Muestra las últimas entradas de una lista una debajo de otra – el Stream-Chat, las últimas teclas pulsadas (Basic) o cualquier otra lista de un módulo (en “Fuente”). Las más nuevas arriba o abajo, con cantidad y duración. “Por línea s” define cuánto se queda cada línea – contando desde la más nueva: “3, 2, 0.5” = la más nueva 3 s, encima 2 s, arriba del todo 0,5 s. “Ejemplo” son líneas que solo se ven en el editor mientras no hay datos reales.

En el lienzo

• Mover: arrastrar. La capa se ajusta a bordes y centros del lienzo y de otras capas (guías rosas). Alt = sin ajuste.
• Tamaño: con los tiradores. Las esquinas del texto escalan también la letra, las imágenes mantienen la proporción (Shift = libre).
• Girar: tirador redondo arriba, Shift = pasos de 15°.
• Escala % (a la derecha en “Posición y tamaño”, control + número): agranda o reduce toda la capa con contenido, marco y efectos – alrededor de su centro, sin cambiar ancho, alto ni tamaño de letra. Doble clic en el control = 100 %. Con ◆ también como pista de keyframes (p. ej., reaccionar a un valor).
• Capas superpuestas: un clic selecciona la de arriba. Ctrl + clic en el mismo sitio selecciona la siguiente por debajo – cada Ctrl-clic baja una más. Una capa seleccionada sigue seleccionada al arrastrar, aunque haya otra encima.
• Seleccionar varias: Shift + clic (en la lista de capas también Ctrl + clic) o dibuja un recuadro sobre el lienzo vacío. Luego muévelas, alinéalas o distribúyelas juntas.
• Bloquear dirección: encima del lienzo Libre / ↔ / ↕ – o Alt + G cambia en orden (libre → solo lateral → solo arriba/abajo → libre). Shift al arrastrar usa la dirección principal.
• Ajustar áreas: arrastra los separadores entre áreas, doble clic los restablece. La columna izquierda mide al menos 250 px.
• Zoom: Alt + rueda – hacia el ratón. El porcentaje encima del lienzo vuelve a ajustar. Un zoom propio se mantiene aunque ensanches una columna – la imagen no se mueve.
• Desplazar el lienzo ampliado: rueda, Shift + rueda o arrastrar con el botón central. Si no se ve todo, el lienzo tiene un discreto borde morado alrededor.
• Solo se puede hacer clic en lo visible: las capas que no están activas en el momento actual (timing, condición, disparador) no se pueden pulsar en el lienzo – en la lista de capas y la línea de tiempo sí.
• Capas fuera del lienzo también se pueden agarrar al lado y volver a meter.

Cuadrícula

Encima del lienzo “Cuadrícula” (tecla G). Dos tipos:

• px: tamaño fijo de celda en píxeles, p. ej., 20.
• Dividir: divide el lienzo en celdas iguales – cantidad en horizontal × en vertical. 2 × 1 da una línea justo en el centro, 3 × 3 tercios. Al arrastrar, el borde izquierdo, el centro o el borde derecho se ajustan a la línea más cercana.

Con cuadrícula también se ajustan los tiradores al cambiar el tamaño, Shift + flecha salta a la siguiente línea, Alt desactiva el ajuste un momento.

Variables

En la pestaña “Variables” están todos los valores de tus módulos. Un clic inserta la variable en el texto seleccionado – o crea uno nuevo. En “Ajustes → Fuentes de datos” añades más módulos para que sus variables estén disponibles en el diseño. Tus propias variables las creas en la app en “Keywords”.

Condiciones

Cada capa y cada grupo puede tener condiciones – construidas como la lógica en código:

• Condición: variable, comparación, valor – p. ej., {cputemp} mayor que 80. Comparaciones: es, no es, es uno de, no es ninguno de, contiene, mayor/menor que, al menos/como máximo.
• Y / O: entre dos entradas está el enlace – un clic lo cambia. Y = todas deben cumplirse, O = basta una.
• Bloque ( ): agrupa condiciones entre paréntesis, con su propio Y/O dentro. Los bloques se pueden anidar.
• Arriba una línea muestra cómo lo lee el editor, p. ej., (tipo = sub Y meses > 3) O (tipo = giftsub).
• Grupos: sus condiciones se aplican a todas las capas de dentro – además de las suyas propias. Así activas muchas capas a la vez.

Keyframes y valores que reaccionan

Junto a cada campo numérico de una capa hay un ◆: un clic crea una pista de keyframes para ese valor. Avanza con el tiempo, sigue un regulador o reacciona a un valor en vivo (música, temperatura, chat …). Todo sobre esto: Línea de tiempo y keyframes y Reaccionar a un valor.

Timing y animaciones

En “Timing” decides si una capa está siempre visible o solo desde–hasta. Para mostrar y ocultar hay fundido, deslizamiento, zoom, barrido en todas las direcciones, desde el centro, círculo, desenfoque, aparición, giro, caída y apertura. Para recorridos propios: keyframes.

Biblioteca de efectos

Al extremo derecho de las capas, “✦ Efectos” abre una columna justo al lado de las capas (el lienzo se aparta). Arriba una búsqueda, debajo las pestañas Favoritos y Todos, con las secciones Todos · Audio · Imagen · Animación:

• Imagen: blanco y negro, sepia, tono, saturación, contraste, invertir (negativo), claro ↔ oscuro (invierte el brillo, los colores se mantienen), brillo, sombra, aura (pulsante), contorno, luz, viñeta (imagen/vídeo), desvanecer (degradado) y desenfoque gradual – dirección en grados, inicio, longitud y curva (uniforme, primero rápido o primero lento).
• Animación: tambalear, pulsar, doble pulso, flotar, péndulo, girar, parpadeo, arcoíris, glitch – funcionan siempre. Con “Continuo” (a la izquierda del volumen) no saltan al final del bucle.
• Audio (sonido y vídeo): apagado (paso bajo), teléfono (paso alto), eco, reverberación, distorsión, estéreo. La reverberación tiene wet (reverberación) y dry (original) por separado, duración, pre-retardo, suavidad (de brillante a apagado), corte de graves, decaimiento y anchura estéreo. Los efectos de audio también van en la exportación de vídeo y WAV.

• ☆ a la izquierda de una tarjeta convierte el efecto en favorito.
• Los paquetes de efectos del hub (marco discontinuo) aplican varios efectos a la vez, p. ej., “Cinta VHS”.
• La papelera al pasar el ratón quita un efecto o paquete de la lista – puedes recuperarlo en el hub. Las capas que ya lo usan lo conservan.
• “Más en el hub” abre más paquetes de efectos.

Arrastra un efecto a una capa o grupo de la lista – o selecciona capas o un grupo y pulsa “+”. En un grupo el efecto se queda en el grupo y se aplica a todas las capas adecuadas de dentro sin cambiarlas. Después aparece sangrado bajo la capa; a la derecha en las propiedades lo ajustas, lo apagas o cambias el orden. ◆ junto a un control crea una pista de keyframes, p. ej., blanco y negro de 0 a 100 % en dos segundos o el eco con un regulador MIDI.

Cambiar un efecto: el nombre arriba en la tarjeta es una selección – otro efecto de la misma categoría lo sustituye, los controles iguales conservan valor y keyframes. Desbloquear una zona (candado en la tarjeta, en efectos de imagen): el efecto solo actúa dentro de un rectángulo – X, Y, ancho, alto (y en los filtros un borde suave), todo animable con ◆. Con “Seguir el elemento” la zona se mueve y escala con el elemento (valores en % de su tamaño) – p. ej. blanco y negro solo en la mitad inferior de una imagen, que se mantiene al mover o agrandar la imagen. Sin ello, la zona queda fija en el lienzo. En el lienzo un marco discontinuo muestra la zona: arrastrar la pestaña = mover, la esquina = tamaño.

Efectos

• Visible % con dirección de barrido y borde suave – corta la capa como una cortinilla, ideal con una pista de keyframes.
• Desenfoque para toda la capa.

Disparadores

En “Ajustes → Disparadores” creas reglas, p. ej., “noob 3× en 10 s”, “!hype” en el chat o un atajo. Las capas que asignes a un disparador solo aparecen cuando se cumple – su timing cuenta desde entonces. “Vista previa” lo reproduce en el editor, “Probar en el chat” también en tu software de streaming. Los atajos tienen su propia pestaña – ver Atajos.

Con el módulo Basic también hay pulsación de tecla y clic del ratón (de la visualización de teclas): cada entrada nueva de ese tipo activa, “Solo con” lo limita a teclas concretas (separadas por comas, vacío = cualquiera).

Animaciones activadas

Cada elemento – capa o grupo – puede tener sus propias animaciones: como animación de entrada o salida en Timing o iniciadas por una condición, mientras la línea de tiempo sigue con normalidad.

• Crear: a la derecha en “Animaciones activadas” o con el rayo en la fila del elemento en la línea de tiempo.
• Editar: “Abrir línea de tiempo” muestra una línea de tiempo solo para esta animación, de 0 s hasta su duración (en el campo de arriba donde suele estar “Duración del bucle”). Rango del bucle, cuadrícula, zoom e insertar tiempo funcionan como siempre. Con ◆ junto a cada valor creas pistas. Se ve y funciona como la línea de tiempo normal: el elemento como fila (la flecha despliega sus pistas), la barra es la animación – arrastrar el borde derecho cambia la duración, el izquierdo recorta el inicio. Todo lo demás se queda como se ve en ese momento. “Listo” vuelve atrás. Copiada o de la biblioteca, posición, rotación y tamaño se ajustan al nuevo elemento.
• Inicio: con un disparador (palabra en el chat, comando, atajo, pulsación de tecla, clic del ratón …), cuando cambia una variable, cuando se cumple una condición – o “sin disparador”, solo como entrada/salida.
• Entrada/salida: en elementos que no son “siempre visibles”, elige en Timing en “Entrada” o “Salida” una animación del elemento o una de la biblioteca. Su duración pasa a ser la duración. En los grupos está en su sección “Entrada/salida” – su tiempo va de la primera a la última capa.
• Junto con la línea de tiempo: si la línea de tiempo anima el mismo valor, actúan ambas: opacidad y tamaño se multiplican, desplazamiento, rotación y desenfoque se suman. Campos como el tamaño de letra y los controles de efectos los toma la animación. Al terminar, todo vuelve suavemente al valor normal dentro de “Vuelta” (segundos). Si el disparador vuelve, empieza de nuevo.
• Copiar y pegar: “Copiar” en la animación, luego elige otro elemento y pulsa Ctrl+V (o “Pegar” en el rayo). Si algo no funciona – p. ej. el tamaño de letra en una imagen – aparece un mensaje y no cambia nada. Si no, una ventana muestra qué se anima, qué efectos se añaden y si se usa como entrada, salida o con un disparador.
• Renombrar y eliminar: el nombre está arriba en la animación (a la derecha). La papelera de ahí – o “Eliminar” en el menú del rayo – la quita junto con sus keyframes; si estaba elegida como entrada o salida, después ya no hay ninguna transición ahí.

Biblioteca “Animaciones”: el botón con el rayo junto a “✦ Efectos” en las capas. Contiene animaciones listas de Ventoview (aparecer, surgir, entrar volando, pulso, oscilar, iluminar …) y las tuyas – con búsqueda, favoritos y los filtros Entrada · Salida · Con disparador. Arrastra a un elemento o pulsa “+” para insertarlas. Las tuyas las guardas con “Guardar” en una animación (nombre y para qué es); quedan en la app y sirven para todos los diseños (app de Ventoview 0.0.4 o más reciente). Las tuyas las borras ahí con la papelera.

Ejemplo: la plantilla Basic “Teclas y ratón” – sobre la línea de abajo está “Desvanecer (degradado)” con su propia zona, una animación hace aparecer suavemente la nueva línea con cada tecla (teclado y ratón por separado).

Repetir y ocultar

En “Ajustes” los módulos ofrecen comportamientos listos, p. ej., “Una vez por alerta” (el diseño se reproduce una vez por evento, varios uno tras otro) o “Ocultar cuando no suena nada”.

Probar

Si no hay nada seleccionado, el lado derecho tiene dos páginas: Diseño y Probar. En Probar simulas lo que puede pasar en el stream. Solo se ven las pruebas que encajan con el diseño – con el módulo del editor o una fuente de datos (p. ej., atajos solo si está Atajos). El centro se convierte en la ventana de prueba: ahí funciona el overlay real tal como aparece en el stream.

• Mensaje del chat: nombre y texto, p. ej., !elo. Aparece en el overlay del chat, dispara los disparadores de palabras y comandos, y el bot muestra lo que respondería (si quieres, escribe de verdad).
• Evento del stream: follow, suscripción, resub (meses), suscripciones regaladas (cantidad), bits (cantidad), raid (espectadores), puntos de canal – con nombre, nivel y mensaje.
• Atajo: lanza cualquier atajo de la app con un clic.
• Probar valores: pon cualquier variable en un valor de prueba, p. ej., rango o temperatura de CPU – solo en el editor, para comprobar condiciones y textos.
• Pruebas rápidas de los módulos (antes en Ajustes).

Los eventos pasan por la app como los reales – también en tu software de streaming. Los valores de prueba solo valen en el editor y desaparecen al recargar.

Plantillas

“Plantillas” arriba muestra las plantillas del módulo – las estándar y todo lo que hayas tomado del hub. Al pasar el ratón, × quita una plantilla de la lista (las estándar solo se ocultan). “Más en el hub” abre el hub directamente en las plantillas de este módulo – ahí también recuperas las quitadas. Un diseño vacío lo empiezas con “Nuevo”.

Medios

En la pestaña “Medios” están las imágenes, vídeos y sonidos de los módulos y los tuyos (sube, arrastra al lienzo – queda directamente como capa – o arrastra desde el PC a la pestaña “Medios” – solo va a tus medios). Cada sección se puede plegar desde su título. Los sonidos muestran su nombre, una forma de onda y un botón redondo ▶ para escucharlos (uno a la vez). El volumen se regula con el control 🔊 a la derecha encima de la línea de tiempo.

Guardar

“Guardar” (Ctrl+S) guarda el diseño en la app. Con el selector de arriba abres diseños guardados, “Nuevo” empieza uno vacío. Para compartirlo: Compartir plantillas.