Contenido del curso
El sistema de UI de Unity
- 4

Canvas y sus modos de renderizado en Unity
08:48 min - 5

El Rect Transform
11:45 min - 6

Componente de imagen
08:05 min - 7

Máscaras y efectos
Viendo ahora - 8

Texto en Unity con Text Mesh Pro
06:14 min - 9

Creando botones en nuestra interfaz
07:37 min - 10

Otros elementos de UI
05:32 min - 11

Auto layout
09:02 min - 12

Scroll views
05:21 min - 13

Controla grupos de UI con Canvas Group
02:58 min
Haciendo interfaces para el juego
- 14

Pantallas de UI para Safari Match en Unity
02:45 min - 15

Importar y configurar sprites UI en Unity
05:36 min - 16

Construye la Start Screen en Unity
12:31 min - 17

Animando el fondo con shader graph
12:16 min - 18

Agregando lógica a la pantalla de título
11:35 min - 19

Scroll view de selección de niveles en Unity
10:47 min - 20

Genera lista de niveles con prefabs en Unity
13:23 min - 21

Corrige bugs de UI antes de añadir más features
08:43 min - 22

Contador de puntos y pausa en Unity HUD
11:06 min - 23

Anima iconos con DOTween en Unity
08:21 min - 24

Pantalla de pausa en Unity con Layout Group
07:42 min - 25

Pantalla de pausa con reseteo de escena en Unity
09:37 min - 26

Rediseño visual de la pantalla Game Over en Unity
07:47 min - 27

Pantalla de opciones con layouts en Unity
11:36 min - 28

Implementación de la pantalla de configuración
12:46 min - 29

Interfaces de Unity que parecen juegos profesionales
02:41 min
Máscaras y efectos
Resumen
¿Cómo añadir efectos a las imágenes en Unity?
Unity ofrece herramientas fáciles de usar para enriquecer las imágenes de nuestras interfaces añadiendo profundidad y dinamismo. Dos de los efectos más utilizados son las sombras y los contornos (outlines), que se pueden implementar directamente desde el editor de Unity.
¿Cómo crear sombras en tus imágenes?
Para agregar una sombra a una imagen en Unity, comienza seleccionando la imagen deseada. Luego, agrega un nuevo componente buscando el efecto "Shadow". Este efecto permite añadir una sombra externa a la imagen:
- Organización y disposición: Al seleccionar la imagen, es útil mantener tu jerarquía bien organizada. Cambia el nombre de tus elementos, por ejemplo, a "Azul" para una imagen azul.
- Ajustes de sombra: Puedes controlar la distancia de la sombra, por ejemplo, asignando valores como 5 y -5, o incrementando a 20 y -20 para un efecto más marcado.
- Color de sombra: Personaliza el color del efecto según la estilización que busques para tu interfaz.
Estas sombras básicas pero efectivas permiten personalizar y ajustar visualmente tus proyectos.
¿Cómo aplicar el efecto Outline para contornos?
El efecto Outline añade una línea alrededor de la imagen seleccionada, y es sencillo de aplicar:
- Selecciona tu imagen y añade el componente "Outline" desde el motor de Unity.
- Ajusta la "Effect Distance" a valores como 20 y 20 para controlar el espesor del contorno.
- Modifica el color y la opacidad: Un outline rojo es visible, pero para un efecto más dinámico, usa un color amarillo que resalte la selección de elementos o un efecto "On Hover" del ratón.
Estos dos efectos, integrados en Unity, no solo ofrecen opciones creativas sino también funcionales al hacer visibles las interacciones de usuario en la interfaz.
¿Cómo utilizar máscaras en Unity?
Las máscaras son una herramienta poderosa para delimitar la visibilidad de los elementos. Si alguna vez has usado Photoshop, te resultará familiar el concepto de cubrir una capa superior con otra inferior, mostrando únicamente lo que está dentro de la capa superior.
¿Cómo enmascarar elementos en Unity?
Para enmascarar un elemento, sigue estos pasos:
- Crea una jerarquía: Mueve el elemento (por ejemplo, un botón azul) dentro de un objeto que actuará como máscara (por ejemplo, un botón blanco) para establecer una relación padre-hijo en tu jerarquía.
- Añade el componente de máscara: Al elemento blanco superior, añade el componente "Mask". Esto hará que los elementos hijo sean visibles solo dentro de la región definida por la máscara.
Esta técnica es especialmente útil en interfaces complejas, como en un panel de inventario, donde solo los elementos dentro del panel deben ser visibles.
¿Qué consideraciones tener en cuenta al trabajar con máscaras?
- Al aplicar máscaras, evita componentes que provoquen pixelado, como efectos de sombra en el objeto enmascarador. Considera desactivarlos para mantener la calidad visual.
- Experimenta fusionando efectos y máscaras para obtener resultados impresionantes y únicos en tus interfaces.
La integración de efectos como sombras, contornos y máscaras ofrece herramientas versátiles para mejorar la personalización visual de tus proyectos de Unity. ¡Continúa explorando y experimentando con estas funciones para hacer tus interfaces más atractivas y funcionales!