BillboardGui en Roblox Studio: nombres flotantes sobre los personajes

BillboardGui es un objeto de interfaz en Roblox Studio que permite mostrar elementos visuales, como texto o imágenes, anclados a un punto específico del mundo 3D. Su uso más común es crear nombres flotantes sobre los personajes, una mecánica esencial en juegos multijugador para identificar a otros usuarios.

En este artículo exploraremos cómo configurar un BillboardGui desde cero, ajustar sus propiedades para que el texto siga a la cámara y personalizar su apariencia. Además, revisaremos buenas prácticas para optimizar el rendimiento y evitar errores comunes en tus proyectos.

Te puede interesar leer: Cómo hacer un NPC enemigo que persiga y ataque en Roblox Studio

Guía completa sobre nombres flotantes en Roblox Studio

¿Qué es un BillboardGui y para qué sirve?

El BillboardGui es una interfaz que vive dentro del mundo 3D en lugar de pegada a la pantalla, y esa es su gran diferencia frente al ScreenGui. Su característica más útil es que siempre se orienta hacia la cámara del jugador, así que el texto se lee bien desde cualquier ángulo. Por eso se usa constantemente para nombres de usuario, barras de vida, números de daño y carteles informativos.

Propiedades esenciales de un BillboardGui

Para que la etiqueta aparezca donde debe, hay cuatro propiedades que tendrás que tocar sí o sí. Estas son las que definen a qué se ancla, qué tamaño ocupa y si se ve a través de las paredes.

Pasos para crear un nombre flotante básico

El montaje es más sencillo de lo que parece si sigues el orden correcto. Insertas el BillboardGui dentro de la cabeza del personaje, le añades un TextLabel como hijo y ajustas su fuente y color. Lo último es asignarle el nombre del jugador mediante un script que se ejecute cuando el personaje aparezca.

¿Cómo hacer que el nombre siempre mire a la cámara?

Configuración de la rotación automática

Buena noticia: no tienes que programar nada para que la etiqueta mire a la cámara, porque el BillboardGui lo hace de forma nativa. Tu trabajo se limita a colocarla a la altura correcta y evitar que el texto interfiera con el personaje. Ajustar el desplazamiento vertical es prácticamente lo único que necesitas tocar.

1. StudsOffset: Eleva la etiqueta un par de studs para que flote sobre la cabeza sin taparla.
2. ExtentsOffset: Úsalo si prefieres que el desplazamiento se calcule según el tamaño del personaje.
3. Rotation en 0: Mantén el TextLabel sin rotación para que el texto se vea siempre recto.

Ajustar el tamaño según la distancia

Por defecto la etiqueta se hace más pequeña conforme te alejas, igual que cualquier objeto en 3D. Eso está bien en la mayoría de casos, pero a veces querrás que mantenga un tamaño constante para que siempre sea legible. Con la propiedad adecuada controlas ese comportamiento sin escribir ni una línea.

1. SizeOffset: Ajusta el punto de anclaje del cuadro respecto a la posición del Adornee.
2. TextScaled: Actívalo en el TextLabel para que el texto siempre llene el cuadro disponible.
3. Probar a varias distancias: Aléjate y acércate en modo de juego para comprobar que se lee bien.

Optimización para múltiples jugadores

En un servidor lleno, cada nombre flotante suma carga al renderizado. Limitar la distancia a la que se muestran es la medida más efectiva y además mejora la claridad visual, porque evita que la pantalla se llene de texto. Es una optimización que se aplica con una sola propiedad.

1. MaxDistance: Define una distancia máxima, por ejemplo 100 studs, tras la cual la etiqueta desaparece.
2. Simplificar el contenido: Evita meter demasiados elementos dentro de cada BillboardGui.
3. Probar con varios clientes: Usa el modo multijugador de Studio para ver el rendimiento real.

¿Cómo personalizar el estilo y color del nombre flotante?

Cambiar fuente, tamaño y contorno

Un texto blanco sin contorno se vuelve ilegible en cuanto pasa por delante de una pared clara. Añadir un borde oscuro resuelve ese problema al instante y le da un acabado mucho más profesional. La elección de fuente también cambia por completo el carácter de tu juego.

1. Font: Fuentes como GothamBold o SourceSansBold funcionan muy bien para nombres de jugador.
2. TextSize: Valores entre 24 y 32 suelen ser legibles sin ocupar demasiado espacio en pantalla.
3. UIStroke: Inserta este objeto en el TextLabel para añadir un contorno oscuro y nítido.

Añadir imágenes o iconos al nombre

Un icono junto al nombre comunica información de un vistazo: el equipo, el rango o una insignia especial. Basta con insertar un ImageLabel dentro del mismo BillboardGui y colocarlo al lado del texto. Organizarlo todo con un contenedor evita que los elementos se pisen entre sí.

1. Insertar un ImageLabel: Añádelo dentro del BillboardGui junto al TextLabel existente.
2. Usar UIListLayout: Colócalo para alinear texto e icono automáticamente sin pelearte con posiciones.
3. Asignar la imagen: Pega el ID del icono en la propiedad Image del ImageLabel.

Efectos de transparencia y degradado

Para darle ese toque pulido que distingue a un juego cuidado, puedes aplicar degradados al texto o hacer que la etiqueta aparezca con una animación suave. Un UIGradient sobre el TextLabel crea transiciones de color muy vistosas. Y con TweenService el nombre puede desvanecerse al entrar y salir.

1. UIGradient: Insértalo en el TextLabel para aplicar un degradado entre dos colores al texto.
2. BackgroundTransparency: Déjalo en 1 para que solo se vea el texto sin ningún recuadro de fondo.
3. Animar con TweenService: Haz que la transparencia pase de 1 a 0 cuando el personaje aparezca.

¿Cómo sincronizar el nombre con el jugador en tiempo real?

Uso de scripts de servidor y locales

Aquí hay una decisión importante: si creas la etiqueta en el servidor, la verán todos; si la creas en un LocalScript, solo la verá ese jugador. Para nombres flotantes normales querrás la primera opción, así que usa un Script en ServerScriptService. Lo esencial es esperar a que el personaje exista antes de anclar nada.

1. PlayerAdded: Conecta este evento para detectar cuándo entra un nuevo jugador al servidor.
2. CharacterAdded: Espera a que el personaje aparezca antes de crear y anclar el BillboardGui.
3. Clonar una plantilla: Guarda un BillboardGui ya configurado en ReplicatedStorage y clónalo para cada jugador.

Actualización dinámica del texto

Si quieres mostrar información que cambia durante la partida, como la salud o el nivel, necesitas refrescar el texto cuando eso ocurra. Lo eficiente es reaccionar a eventos concretos en lugar de comprobar el valor constantemente. Así el texto se actualiza solo cuando hace falta.

1. Escuchar el evento Changed: Conéctalo al valor que quieras mostrar para refrescar el texto al instante.
2. HealthChanged: Úsalo si quieres reflejar la vida del personaje junto a su nombre.
3. Evitar bucles constantes: No refresques el texto en cada fotograma si el dato apenas cambia.

Manejo de errores y limpieza

Cada etiqueta que no eliminas se queda ocupando memoria aunque ya no se vea. Al morir el personaje, Roblox suele encargarse, pero las conexiones de eventos hay que cerrarlas a mano. Comprobar que no existan duplicados evita ver dos nombres superpuestos.

1. Usar Destroy: Elimina el BillboardGui cuando el personaje muera o el jugador abandone la partida.
2. Desconectar eventos: Llama a Disconnect en las conexiones que ya no necesites para liberar recursos.
3. Comprobar duplicados: Verifica si ya existe una etiqueta antes de crear otra para el mismo personaje.

¿Qué errores comunes evitar al usar BillboardGui?

Problemas de rendimiento en móviles

Los dispositivos móviles sufren especialmente con las interfaces 3D, y más si cada jugador lleva una encima. Reducir la complejidad visual y limitar la distancia de visualización mantiene el juego fluido. Probar en un teléfono real te dará la imagen verdadera del rendimiento.

1. Limitar los efectos: Evita acumular degradados, sombras y capas de transparencia en la misma etiqueta.
2. Usar TextScaled: Deja que el texto se adapte al cuadro en lugar de calcular tamaños por script.
3. Probar en gama baja: Comprueba el rendimiento en un móvil modesto antes de publicar.

Superposición entre varias etiquetas

Cuando varios jugadores se juntan en la misma zona, sus nombres se amontonan y ninguno se lee. Ajustar la altura de cada etiqueta o limitar cuántas se muestran a la vez soluciona el desorden. El orden de dibujo también ayuda a decidir cuál queda encima.

1. Ajustar la altura: Varía ligeramente el StudsOffset para que las etiquetas no queden todas al mismo nivel.
2. Usar ZIndex: Asigna valores más altos a las etiquetas que deban dibujarse por delante.
3. Reducir MaxDistance: Si hay multitudes, baja la distancia para mostrar solo los nombres cercanos.

Problemas de anclaje al personaje

Si la etiqueta se queda flotando en el sitio equivocado o no sigue al personaje, casi siempre es un problema de anclaje. Al morir y reaparecer, Roblox crea un modelo completamente nuevo, así que la referencia anterior deja de servir. Reasignar el Adornee tras cada reaparición resuelve el fallo definitivamente.

1. Adornee correcto: Asigna siempre la parte Head del personaje, no el modelo completo.
2. Volver a crear al reaparecer: Genera una etiqueta nueva en cada CharacterAdded, ya que el modelo cambia.
3. Esperar con WaitForChild: Asegúrate de que la cabeza exista antes de intentar anclar nada a ella.

Quieres saber sobre este juego

¿Qué es un BillboardGui y cómo se usa para mostrar nombres flotantes sobre los personajes en Roblox Studio?

Un BillboardGui es un objeto de interfaz gráfica que se renderiza dentro del espacio 3D y que siempre se orienta hacia la cámara del jugador, lo que lo convierte en la herramienta ideal para etiquetas flotantes. Para mostrar un nombre sobre un personaje, se inserta un BillboardGui dentro de la cabeza del modelo y se añade un TextLabel como hijo suyo. Es importante configurar propiedades como Size, con un valor tipo UDim2.new(4, 0, 1, 0), y StudsOffset, que eleva la etiqueta un par de studs por encima de la cabeza para que no se solape con el cuerpo. La propiedad AlwaysOnTop en true garantiza que el nombre se vea aunque haya objetos delante, algo muy útil en mapas con muchos elementos. El texto se asigna a la propiedad Text del TextLabel, normalmente con el nombre del jugador, y desde ahí puedes personalizar la fuente, el color y el contorno. Este es el método estándar para crear nombres visibles para todos los jugadores del servidor.

¿Cómo puedo hacer que el nombre flotante solo sea visible para el dueño del personaje y no para los demás jugadores?

Para que un nombre flotante sea visible únicamente para un jugador, debes crearlo desde un LocalScript en lugar de hacerlo en el servidor. La razón es sencilla: todo lo que el servidor crea se replica automáticamente a todos los clientes, mientras que lo que crea un LocalScript existe solo en el dispositivo de ese jugador. Coloca el LocalScript en StarterPlayerScripts, espera con CharacterAdded a que el personaje aparezca y crea entonces el BillboardGui apuntando su Adornee a la cabeza correspondiente. Un detalle importante es dónde guardas la etiqueta: si la colocas dentro del propio personaje, otros scripts podrían detectarla, así que lo más limpio es crearla dentro del PlayerGui y usar Adornee para anclarla visualmente a la cabeza. Esta técnica sirve tanto para etiquetas privadas del propio jugador como para mostrar nombres solo a los compañeros de equipo.

¿Qué propiedades debo ajustar para que el nombre flotante se vea nítido y no se superponga con otros elementos?

Para conseguir un nombre nítido y bien colocado, empieza por el Size del BillboardGui, que debe ser suficiente para contener el texto sin quedar desproporcionado; un valor como UDim2.new(5, 0, 1.5, 0) funciona bien en la mayoría de casos. Después ajusta StudsOffset para elevar la etiqueta entre 2 y 3 studs sobre la cabeza y evitar que se mezcle con el cuerpo del personaje. La propiedad AlwaysOnTop en true hace que el nombre se dibuje por encima de los objetos 3D, aunque conviene usarla con criterio porque también atraviesa paredes. En el TextLabel hijo, activa TextScaled para que el texto se adapte solo al cuadro, pon BackgroundTransparency en 1 para eliminar el recuadro de fondo y añade un objeto UIStroke que le dé un contorno oscuro y mejore la legibilidad sobre cualquier fondo. Por último, LightInfluence en 0 evita que la iluminación del mapa altere los colores del texto.

¿Cómo puedo actualizar dinámicamente el texto de un BillboardGui cuando el jugador realiza una acción?

Para actualizar el texto de forma dinámica necesitas primero una referencia al TextLabel interno, que puedes guardar en una variable al crear la etiqueta o localizar después con FindFirstChild. Una vez la tienes, basta con modificar su propiedad Text cada vez que el dato cambie. Lo eficiente es reaccionar a eventos en lugar de comprobar el valor constantemente: si muestras la salud, conecta Humanoid.HealthChanged; si muestras monedas o nivel, usa el evento Changed del IntValue correspondiente en leaderstats. Cuando el dato vive en un atributo del jugador, GetAttributeChangedSignal hace exactamente lo mismo y se replica solo del servidor al cliente. Evita a toda costa refrescar el texto en cada fotograma con RunService, porque estarías ejecutando la actualización sesenta veces por segundo para un valor que quizá cambia una vez por minuto. Y si el cambio debe verlo todo el servidor, recuerda hacer la modificación desde un Script de servidor y no desde el cliente.

Si quieres conocer otros artículos parecidos a BillboardGui en Roblox Studio: nombres flotantes sobre los personajes puedes visitar la categoría Roblox Studio.