¿Cómo crear imágenes reactivas de Discord?

crear imágenes reactivas de discordia

¿Qué son las imágenes reactivas?

Cómo crear imágenes reactivas de Discord

A continuación se muestran las dos formas de crear imágenes reactivas de Discord.

  1. Crea y agrega imágenes reactivas de Discord de Fugi
  2. Agregue CSS personalizado usando la superposición StreamKit de Discord

1) Crea y agrega imágenes reactivas de Discord de Fugi

  1. Inicie el Discordia aplicación cliente en su computadora; también descargue y abra OBS Studio, que es una aplicación gratuita que todos pueden instalar.
  2. En Discord, debes ir a Ajustes haciendo clic en el icono de rueda dentada situado junto a su nombre de usuario.
  3. Luego en el Ajustes ventana, ir a Avanzado desde el panel izquierdo, y luego en el Avanzado sección, habilite la palanca asociada con Modo desarrollador.
  4. Desplácese hacia abajo en la sección izquierda para llegar voz y vídeo, ir a Configuraciones de vozy seleccione el micrófono correcto. En Ajustes de video, cambiar Cámara a Cámara virtual OBS.
  5. Luego, vaya a reactive.fugi.tech y haga clic en Inicia sesión con Discord.
  6. Ingrese sus credenciales o escanee el código QR para iniciar sesión en su cuenta y luego haga clic en Autorizar.
  7. Serás redirigido a una página donde podrás configurar imágenes reactivas.
  8. Tomemos el ejemplo de un avatar, necesitas dos imágenes, una con la boca cerrada y otra con la montura abierta. Una vez que tengas estas imágenes, haz clic en el Más (+) ícono, luego cargue una imagen hablada y otra inactiva. Finalmente, haga clic en Guardar.
  9. Puedes configurar la imagen como quieras y una vez hecho, copiar el enlace generado.
  10. Lanzamiento estudio obs, haga clic en el ícono Más (+) de Fuente, luego vaya a Navegador > Crear nuevo > ingrese el nombre de la fuente> Ok.
  11. En Propiedades > URL Pegue el enlace que le pedimos que copiara y haga clic en Aceptar.
  12. Realice cambios en el tamaño de la imagen según su elección antes de iniciar la transmisión de Discord.
  13. Para comenzar a transmitir en Discord, debe hacer clic en "Iniciar cámara virtual" ubicado en "Controles" en OBS.
  14. Finalmente, cambie a Discord, conéctese a un canal de voz y encienda la cámara.

Intente hablar por el micrófono para probar la imagen reactiva que ahora debería aparecer en Discord. La imagen reactiva está lista para su uso en streaming y colaboraciones a través de llamadas de Discord.

2) Agregue CSS personalizado usando la superposición StreamKit de Discord

Alternativamente, podemos hacer uso de Superposición StreamKit de Discord para agregar CSS a nuestra imagen. Tenga en cuenta que este método requiere conocimientos previos de CSS o codificación. Sin embargo, no es necesario ser programador, basta con tener conocimientos de CSS. Siga los pasos que se mencionan a continuación para hacer lo mismo.

  1. Vaya a streamkit.discord.com.
  2. Luego tienes que hacer clic en Instalar para OBS o Instalar para XSplit dependiendo del software de transmisión que esté utilizando.
  3. Si aún no lo ha hecho, se le pedirá que inicie sesión en Discord. Asegúrate de abrir Discord antes de hacer eso.
  4. Ir a Reproductor de voz y seleccione su servidor y canal de voz en los menús desplegables. Oculte su nombre de usuario durante las llamadas de Discord habilitando la opción Ocultar nombres. Una vez hecho esto, obtendrá una URL en el lado derecho de la pantalla que deberá copiar.
  5. Discord te pedirá que autorices en su aplicación, así que hazlo en la aplicación.
  6. Ahora abierto obs, clickea en el Más (+) icono para agregar una fuente desde el menú Fuentes, vaya a Navegador > Ok, pegue la URL que copió y haga clic en Aceptar.
  7. Abre tu aplicación Discord y crea un canal de texto privado donde puedas guardar tus imágenes PNG y cargar ambos archivos.
  8. Ahora, ve a codepen.io, que es un generador de CSS.
  9. Copie su ID de Discord haciendo clic en su nombre de usuario en la esquina inferior izquierda de Discord y seleccionando Copiar ID. Luego pégalo junto al ID de usuario de Discord en el generador de CSS.
  10. Copie la ID de cada imagen PNG haciendo clic derecho sobre ella en su canal de Discord y seleccionando "Copiar ID". Luego pegue la identificación junto a "URL de imagen" en la ventana de CodePen.
  11. Finalmente, haga clic en el Generar CSS para obtener el código CSS requerido, para copiar el código generado, haga clic en Copia CSS.
  12. Abierto obs, vaya a la fuente del navegador StreamKit, haga clic derecho sobre él y seleccione Propiedades.
  13. Navegar a CSS personalizado y pegue el código copiado.
  14. Finalmente, haga clic en Aceptar.

Leer: Cómo borrar el caché de Discord en Windows, iPhone, Android, Mac

¿Cómo agrego un PNG a Discord?

Subir