Tutorial de Unity 3DTema 3

Introducción a los Shaders de Unity3D

Introducción a los Shaders de Unity3D

1. Objetivos

En este tema comenzaremos a trabajar con objetos 3D como vehículos, edificios, armas, etc. Que en primer lugar mejorarán el aspecto visual de nuestra escena y en última instancia nos terminarán ofreciendo la posibilidad de crear mundos interactivos como en los videojuegos comerciales.

Comenzaremos configurando algunos aspectos finales de nuestra escena como pueden ser el cielo o la niebla en el ambiente para después añadir objetos en 3D a partir de un amplio catálogo de recursos online alojado en la página web http://turbosquid.com

Finalmente, para mejorar el aspecto visual de los objetos en 3D trataremos a fondo su texturizado, los diferentes tipos de materiales que Unity puede mostrar y la iluminación.

Recuerda que como siempre, para facilitarte las cosas, siempre utilizaremos un guión (-) para prefijar todas las acciones que requieran tu intervención directa con el programa.

2. Configuración de render

El menú de configuración del render nos permite configurar el aspecto del cielo y de la niebla de nuestro videojuego, además de algunos efectos globales que afectan a la iluminación. Para seguir este tutorial lo ideal sería partir de una escena que hayas creado previamente y ya tenga un diseñado un terreno con todo lujo de detalles.

Comenzaremos configurando el cielo, pero antes de eso necesitamos importar en nuestro proyecto un paquete de recursos con las texturas correspondientes. En esta ocasión utilizaremos uno de los paquetes que trae Unity por defecto, se denomina Skyboxes (Cajas de cielo).

– Ve a la Vista de Proyecto y haz clic derecho en una zona vacía, selecciona Import Package → Skyboxes. Espera que Unity termine de descomprimir el paquete y se abrirá una nueva ventana con el listado de recursos a importar.

Tutorial de Unity 3D Introducción a los Shaders de Unity3D Pág. 1

Tutorial de Unity 3DTema 3

Introducción a los Shaders de Unity3D

– Haz clic en el botón Import, abajo a la derecha, para que comience la carga de recursos en el proyecto.

Observa que el paquete que acabamos de importar es uno de los que vienen por defecto con Unity, habrás comprobado que en la lista de paquetes para importar había muchos más. Si quieres conocerlos todos no dudes en tomarte un tiempo en importarlos uno a uno y examinar su contenido al finalizar este tutorial.

Ahora vamos a acceder al menú de configuración del render para hacer uso de las cajas de cielo:

– Asegúrate de tener el Layout de visualización en modo 2 by3 (Botón superior derecho de la interfaz de Unity). Entonces, en las pestañas superiores haz clic en Edit Render Settings. Verás que la Vista→ de Inspector ahora muestra un breve menú como el de la captura.

Tutorial de Unity 3D Introducción a los Shaders de Unity3D Pág. 2

Tutorial de Unity 3DTema 3

Introducción a los Shaders de Unity3D

Un problema frecuente del menú Render Settings es que deja de ser visible en la Vista de Inspector en el momento que seleccionemos un objeto de la escena o del proyecto, o también cuando hagamos clic en una zona vacía y cancelemos la selección.

Aunque podemos volver a abrirlo de la misma forma siempre que queramos, vamos a utilizar una sencilla opción para evitar que el menú Render Settings se nos oculte accidentalmente.

– Con el menú Render Settings visible en la Vista de Inspector, observa que en su esquina superior derecha hay un pequeño icono con forma de candado. Haz clic sobre él para cerrarlo y así anclar el menú en la Vista de Inspector, no desaparecerá hasta que vuelvas a hacer clic sobre el candado.

Una vez tomada esta precaución, vamos a comenzar asignando el material de la caja de cielo (Skybox Material).

– En el menú Render Settings, haz clic en el pequeño icono en forma de disco que hay a la derecha del campo Skybox Material, se abrirá una nueva ventana con todos los recursos de materiales cargados en nuestro proyecto.

Tutorial de Unity 3D Introducción a los Shaders de Unity3D Pág. 3

Tutorial de Unity 3DTema 3

Introducción a los Shaders de Unity3D

Observa que la ventana anterior muestra todos los recursos de materiales cargados en nuestro proyecto y no sólo los de las cajas de cielo que acabamos de cargar. Un truco sencillo para que nos muestre solamente las cajas de cielo es el siguiente:

– En la barra de búsqueda en la parte superior de la ventana de materiales, escribe la palabra “sky” (Cielo). De esta forma la ventana sólo mostrará aquellos materiales cuyo nombre contenga esa palabra.

– Una vez hecho ésto, puedes ir haciendo clic en los materiales de las cajas de cielo para previsualizar su aspecto en la Vista de Escena. Cuando te hayas decidido por una pulsa Intro para finalizar.

Ya sólo nos falta configurar la niebla de la escena, se trata de un elemento presente en cualquier entorno natural en mayor o menor medida y la configuraremos de una forma muy sencilla.

– Asegúrate de tener el menú de Render Settings en la Vista de Inspector.

– Dirígete al modo de niebla (Fog mode) y despliega el menú para seleccionar la opción Linear.

La niebla de tipo lineal es la más sencilla de configurar, ya que se basa en una distancia inicial desde la cámara (Linear Fog Start), medida en metros, en la que la niebla comienza a afectar a la escena y una distancia final (Linear Fog End) en la que la niebla produce una saturación total y no deja ver nada.

Tutorial de Unity 3D Introducción a los Shaders de Unity3D Pág. 4

Tutorial de Unity 3DTema 3

Introducción a los Shaders de Unity3D

– Establece unos valores para el inicio y el fin de la niebla en función de tu escena, puedes hacer una escena con muy poca niebla asignando valores de inicio y fin muy altos (De 1000 a 1500 metros por ejemplo) o recrear una escena de montaña en un ambiente húmedo con unos valores bajos (De 0 a 300 metros por ejemplo).

– Activa ahora la primera casilla del menú Render Settings, denominada Fog. Es la encargada de que la niebla se active finalmente y se muestre, puedes comprobar su efecto tanto en la Vista de Escena como en la Vista de Juego.

En la captura anterior puedes ver una escena con una configuración de niebla relativamente alta, observa cómo apenas se consigue distinguir el color de los árboles.

Existe un problema y es que el color de la niebla es gris y no resulta natural, vamos a solucionarlo.

– Vuelve de nuevo al menú Render Settings. El segundo parámetro es una celda de color y determina el color de la niebla (Fog color). Haz clic sobre él para abrir la ventana de colores.

– En la parte superior izquierda de la ventana de colores observarás un icono en forma de cuentagotas. Su utilidad es obtener un color directamente desde la Vista de Escena o la Vista de Juego. Haremos clic sobre la parte de la caja de cielo que se junta con el horizonte, ya que salvo raras excepciones es generalmente azulado y resulta uno de los colores más apropiados para la niebla.

Tutorial de Unity 3D Introducción a los Shaders de Unity3D Pág. 5

Tutorial de Unity 3DTema 3

Introducción a los Shaders de Unity3D

Deberías obtener un resultado de niebla mucho más natural.

– Tu escena ya debería tener una luz direccional. Seleccionála en la Vista de Escena, y si no la tienes recuerda que puedes crear una clicando en la pestaña superior Game Object Create Other → → Directional Light.

– Caso de seguir visualizándose el menú Render Settings en la Vista de Inspector, recuerda abrir el candado de su parte superior izquierda para que desaparezca y podamos ver los parámetros de la luz direccional.

– Con la luz direccional seleccionada, utiliza la herramienta de rotación (Botones superiores izquierdos o atajo de teclado E) para dirigir la luz en la dirección que desees.

– Con la luz direccional seleccionada, observa en la vista de inspector sus parámetros. El campo Color es una caja de color donde podemos establecer un color distinto del blanco mientras que el campo Intensidad (Intensity) nos permite modificar su intensidad base.

Tutorial de Unity 3D Introducción a los Shaders de Unity3D Pág. 6

Tutorial de Unity 3DTema 3

Introducción a los Shaders de Unity3D

– Dedica ahora unos minutos a seleccionar una caja de cielo, configurar una niebla y una luz direccional acorde con la escena que deseas ambientar. Puedes plantearte hacer una escena de noche, un amanecer, un día de espesa niebla...

3. Modelos 3D de Turbosquid

La web http://turbosquid.com es un valioso recurso para localizar todo tipo de objetos 3D para añadir a nuestro videojuego. Vamos a dedicar unos minutos a configurar nuestras cuentas de usuario para poder descargar contenido gratuito de todo tipo.

Tutorial de Unity 3D Introducción a los Shaders de Unity3D Pág. 7

Tutorial de Unity 3DTema 3

Introducción a los Shaders de Unity3D

– Abre tu navegador web y busca en Google o escribe en la barra de direcciones http://turbosquid.com.

– En la esquina superior derecha verás un botón de acceso (Login/Join). Haz clic en él para abrir el formulario de inscripción.

– Rellena el formulario de inscripción con tus datos de correo electrónico, nombre de usuario y contraseña. Finalmente pulsa el botón inferior izquierdo Create Account para crear finalmente tu cuenta de usuario.

En el paso anterior no olvides poner un correo electrónico válido para poder recuperar tu contraseña en caso de pérdida, y recuerda que habrá nombres de usuario no disponibles o utilizados por otras personas, así que evita utilizar nombres sencillos como por ejemplo “Juan” o “Laura”.

Una vez finalizado el proceso de inscripción, el texto superior izquierdo de la página web pasará a mostrar el texto Account. Eso nos indica que estás dentro de tu cuenta y ya puedes comenzar a descargar contenido.

Turbosquid tiene un buscador muy similar al de Google, sólo que los resultados de la búsqueda nos llevarán a objetos 3D disponibles para descargar. Podemos buscar cualquier tipo de vehículo, objeto, personaje, etc. Vamos a hacer una sencilla prueba con la que descargaremos una motocicleta y la incluiremos en nuestro videojuego.

– Con tu cuenta ya creada, dirígete a la barra de búsqueda en la parte superior de la web de Turbosquid. Generalmente encontraremos más objetos buscando en inglés, así que escribiremos el texto “motorbike” (Motocicleta) y pulsaremos Intro.

Tutorial de Unity 3D Introducción a los Shaders de Unity3D Pág. 8

Tutorial de Unity 3DTema 3

Introducción a los Shaders de Unity3D

El navegador nos mostrará los resultados de la búsqueda en una ventana similar a la siguiente:

El principal problema es que por defecto nos localizará tanto los objetos gratuitos como los de pago, además de mostrarnos algunos resultados que no son compatibles con Unity 3D.

Vamos a configurar la búsqueda para que automáticamente nos localice únicamente los objetos compatibles con Unity 3D.

– En la columna lateral izquierda de la web, localiza la celda de Compatibilidad (Compatibility). Haz clic en su último botón para especificar desde lista (Specify file formats from list).

– Se abrirá una nueva ventana dentro de la página web donde debemos seleccionar los tipos de archivo que queremos buscar. Unity es compatible con prácticamente cualquier tipo de archivo 3D, pero si no queremos instalar ningúna extensión tendremos que marcar únicamente los formatos .fbx, .3ds y .obj y ninguno más, según la imagen que viene a continuación.

Tutorial de Unity 3D Introducción a los Shaders de Unity3D Pág. 9

Tutorial de Unity 3DTema 3

Introducción a los Shaders de Unity3D

– Para finalizar aplicando el filtro de búsqueda pulsa el botón Apply abajo a la derecha. El resultado de la búsqueda ahora sólo mostrará objetos compatibles con Unity 3D.

Sólo nos falta indicar que queremos únicamente objetos gratuitos:

– Localiza en la columna lateral izquierda la celda de Precio (Price). Haz clic en el texto de abajo para establecer un rango de precios personalizado (Set custom price range).

– Se abrirán 2 celdas donde escribir el precio mínimo y máximo, escribiremos 0 en ambas y pulsaremos Apply para continuar.

Una vez establecidos ambos filtros de búsqueda, la página web nos mostrará los resultados. En este caso tenemos un par de resultados de búsqueda, uno de ellos es una motocicleta con buen aspecto para comenzar a trabajar con ella.

Tutorial de Unity 3D Introducción a los Shaders de Unity3D Pág. 10

Tutorial de Unity 3DTema 3

Introducción a los Shaders de Unity3D

– Haz clic en el icono de la motocicleta para abrir su página de descarga. En ella podrás ver una serie de capturas con el aspecto aproximado que ofrecerá el objeto en nuestro juego.

Dentro de la página de descarga y antes de descargar, es importante echar un vistazo a la información de especificaciones (3D Model Specifications) que podemos ver en el lateral derecho. En el apartado con el número de polígonos (Polygons) intenta evitar modelos que sobrepasen los 15,000 polígonos. En el caso de nuestra moto podemos contar 6,721, así que funcionará correctamente.

– Pulsa el botón verde de descarga (Download) en la parte superior derecha de la página de descarga de la motocicleta. Ésto nos llevará a nuestro historial personal de descargas, donde podemos descargar tanto la motocicleta como cualquier otro objeto que ya hayamos descargado previamente.

Generalmente, cada objeto puede estar disponible para descargar en varios formatos, entre los que se encontrarán los que hemos establecido mediante filtrado de búsqueda.

– Para mostrar todos los formatos disponibles haz clic en el botón Show all, según puedes ver en la siguiente imagen.

Tutorial de Unity 3D Introducción a los Shaders de Unity3D Pág. 11

Tutorial de Unity 3DTema 3

Introducción a los Shaders de Unity3D

Los formatos compatibles con Unity, por orden de mayor a menor compatibilidad, son .fbx, .3ds y .obj. En nuestro caso sólo tenemos disponible el formato .3ds (No confundir con el formato .max de 3dsmax).

– Hacemos clic sobre él para comenzar la descarga tal y como figura en la captura siguiente.

La descarga comenzará automáticamente. Asegúrate de indicar una ubicación conocida, como por ejemplo el Escritorio.

El archivo que hemos descargado está comprimido en formato .zip. Antes de poder importarlo como recurso de nuestro proyecto Unity necesitamos descomprimirlo.

– Haz clic derecho en el archivo que acabas de descargar y selecciona la opción de descompresión (Generalmente Extract to...). El contenido del archivo se extraerá.

Para conseguir grandes tasas de compresión, es frecuente que el archivo haya sido comprimido varias veces, si te encontrases con un archivo similar tendrás que extraerlo de nuevo hasta que aparezcan los archivos que guarda.

En nuestro caso terminamos encontrando una carpeta llamada Vespa donde podemos ver tanto el archivo vespa.3ds (El objeto 3D) como un par de carpetas más con imágenes y texturas, tal y como podemos ver en la siguiente captura.

Tutorial de Unity 3D Introducción a los Shaders de Unity3D Pág. 12

Tutorial de Unity 3DTema 3

Introducción a los Shaders de Unity3D

Antes de añadir el objeto 3D como recurso para nuestro proyecto, vamos a recordar que debemos mantener una buena organización en la Vista de Proyecto. Por tanto vamos a crear un directorio específico donde guardar los distintos modelos 3D que vayamos importando.

– Ve a la Vista de Proyecto de Unity 3D, haz clic derecho en una zona vacía y selecciona Create → Folder para crear una nueva carpeta. Llámala “Modelos”.

– Haz clic derecho sobre la carpeta Modelos que acabas de crear y crea una carpeta más llamada “Motocicleta”. Haremos lo mismo con los sucesivos modelos 3D que descarguemos, teniendo siempre cada uno de ellos en su carpeta correspondiente.

– Haz clic derecho sobre la carpeta Motocicleta y selecciona la opción Import New Asset... Se abrirá una ventana de navegador con la que debemos llegar hasta el archivo Vespa.3DS que acabamos de descargar y descomprimir. Lo seleccionamos y pulsamos el botón Import para importarlo como recurso de proyecto.

Una vez finalice la carga, la Vista de Proyecto mostrará el nuevo recurso junto con una carpeta de materiales (Materials) asociados. En la Vista de Proyecto seleccionamos la Vespa podemos ver su previsualización en la parte inferior de la Vista de Inspector tal y como muestra la siguiente imagen.

Tutorial de Unity 3D Introducción a los Shaders de Unity3D Pág. 13

Tutorial de Unity 3DTema 3

Introducción a los Shaders de Unity3D

Ya sólo nos falta añadir nuestra motocicleta a la escena. Para ello debemos asegurarnos de que tenemos el Layout en modo “2 by 3” y que en la Vista de Escena tenemos visible el terreno y la posición donde queremos colocarla.

– Desde la Vista de Proyecto selecciona y arrastra la motocicleta hasta la posición deseada del terreno en la Vista de Escena.

– Observarás que la moto aparece también en la Vista de Jerarquía, haz doble clic sobre su nombre (Vespa) para centrarla en la Vista de Escena, deberías ver algo así:

Existe un problema con los modelos gratuitos que descargamos de internet, y es que generalmente su tamaño es arbitrario. En nuestro caso vamos a comprobar el tamaño que tiene ahora mismo nuestra motocicleta comparándola con un cubo de 1 metro de arista.

– Con la motocicleta centrada en la Vista de Escena, ve a la pestaña superior GameObject Create→ Other Cube. Ésto creará un cubo con 1 metro de arista exactamente en la misma posición que la→ motocicleta.

Tutorial de Unity 3D Introducción a los Shaders de Unity3D Pág. 14

Tutorial de Unity 3DTema 3

Introducción a los Shaders de Unity3D

– En la Vista de Jerarqúia, localiza el cubo (Cube) y haz doble clic sobre él para centrarlo. Observarás que la cámara de la Vista de Escena se mueve hacia atrás, ésto es debido a que el cubo de 1 metro de arista es mayor que nuestra motocicleta.

– Vuelve a seleccionar la motocicleta en la Vista de Jerarquía y utiliza los botones superiores izquierdos para cambiar la escala de nuestra moto (Botón de escala o atajo de teclado R). Modifica la escala de la moto para que tenga un tamaño aproximadamente real en comparación con el cubo. Aprovecha también para posicionarla (Botón de posicionamiento o atajo de teclado W) por encima del terreno.

– Dedica un tiempo a buscar nuevos objetos en Turbosquid, importarlos a tu proyecto y añadirlos en tu escena. Intenta construir una ciudad con edificios, vehículos e incluso animales y personas sobre tu terreno.

Es importante que sepas también que algunos de los objetos de Turbosquid incluyen texturas. En la mayoría de los casos éstas se aplicarán automáticamente en el objeto 3D al importarlo en Unity, pero para casos más concretos vamos a hablar a continuación sobre cómo maneja Unity las texturas.

Tutorial de Unity 3D Introducción a los Shaders de Unity3D Pág. 15

Tutorial de Unity 3DTema 3

Introducción a los Shaders de Unity3D

4. Texturas

Vamos a volver de nuevo a las texturas para aprender a utilizarlas sobre objetos que hayamos descargado de internet. Para facilitar las cosas empezaremos trabajando sobre simples cubos, pero todo lo aprendido será aplicable más adelante a objetos complejos.

En primer lugar necesitamos añadir texturas como recurso en nuestro proyecto.

– Ve a la Vista de Proyecto, haz clic derecho en una zona vacía y selecciona Create Folder para→ crear una nueva carpeta. Ponle como nombre “Texturas”.

– Abre tu navegador web y accede a Google Imágenes. Puedes acceder simplemente a Google y seleccionar Imágenes en la parte superior de la web tal y como se muestra en la siguiente captura.

– En el buscador escribe la palabra “texture”, en inglés para asegurar más resultados y espera los resultados de búsqueda. Puedes concretar más el tipo de textura que buscas añadiendo alguna palabra más como por ejemplo “leather” (Cuero), si queremos buscar texturas de cuero.

En nuestro caso obtenemos los siguientes resultados de búsqueda:

Tutorial de Unity 3D Introducción a los Shaders de Unity3D Pág. 16

Tutorial de Unity 3DTema 3

Introducción a los Shaders de Unity3D

– Haz clic en el resultado de búsqueda que más te guste. Se abrirá una previsualización en la que es importante que en la columna lateral derecha hagas clic en “Tamaño completo”, ya que lo que se está mostrando es una miniatura.

– Una vez hecho eso podrás ver la imagen a tamaño completo en tu navegador. Guárdala, generalmente haciendo clic derecho sobre ella y seleccionando la opción Guardar imagen como... Asegúrate de guardarla en una ruta conocida como por ejemplo el Escritorio.

Tal y como hemos hecho anteriormente con el modelo 3D de Turbosquid, vamos a importar la textura como recurso de proyecto antes de utilizarla.

– En la Vista de Proyecto, dentro de la carpeta Texturas crea una nueva carpeta con el nombre “Cuero”. Haz clic derecho sobre ella, selecciona Import New Asset... Se abrirá una ventana de navegador donde debes buscar la textura que has descargado, seleccionarla y pulsar Import para añadirla como recurso.

– Ahora puedes repetir el mismo proceso cuantas veces quieras para añadir distintos tipos de textura a tu proyecto.

Vamos a comenzar a hacer uso de las texturas importadas. Para ello vamos a buscar el cubo que habíamos creado inicialmente para comparar su tamaño con el de nuestra motocicleta.

– En la Vista de Jerarquía, busca el cubo (Cube) y haz doble clic sobre él para centrarlo en la Vista de Escena.

Tutorial de Unity 3D Introducción a los Shaders de Unity3D Pág. 17

Tutorial de Unity 3DTema 3

Introducción a los Shaders de Unity3D

– Localiza la textura que acabas de importar en la Vista de Proyecto, dentro de la carpeta Texturas. Arrástrala directamente sobre el cubo, bien sea en la Vista de Escena o en la Vista de Jerarquía. Observarás que el cubo aplica automáticamente la textura sobre todas sus caras así:

– Puedes dedicar un tiempo a crear todo tipo de figuras básicas haciendo clic en la pestaña superior GameObject Create Other,→ ahí podrás seleccionar figuras como la esfera (Sphere), cápsula (Capsule), cilindro (Cylinder) y plano (Plane). Texturiza todas ellas de diferente forma siguiendo los pasos anteriores.

– También puedes intentar componer objetos básicos posicionando y rotando correctamente las figuras básicas texturizadas. Puedes intentar montar una farola y añadirle una luz puntual (Point Light), o un coche y añadirle luces de cono (Spot Light).

Tutorial de Unity 3D Introducción a los Shaders de Unity3D Pág. 18

Tutorial de Unity 3DTema 3

Introducción a los Shaders de Unity3D

5. Materiales

Ahora que ya nos hemos familiarizado con el manejo de texturas y su aplicación sobre objetos vamos a pasar a trabajar con un aspecto visual más avanzado de Unity. Los materiales indican el aspecto visual que nos muestra finalmente el objeto, atendiendo especialmente a su reacción frente a las fuentes de luz y los reflejos del entorno que lo rodea.

– En la Vista de Jerarquía, busca el cubo texturizado que hemos creado anteriormente y haz doble clic sobre su nombre para centrarlo en la Vista de Escena.

Si observas ahora en la Vista de Inspector, abajo del todo, comprobarás que hay una pequeña previsualización en forma de esfera con el aspecto exterior del cubo, una caja de color y su textura según la siguiente captura. Se trata de la ventana del material del objeto y vamos a trabajarla en profundidad.

La caja de color nos permite aplicar un color de teñido en caso de que queramos ofrecer un aspecto distinto.

– Prueba a modificar el color y observa el resultado.

También son interesantes los valores de repetición (Tiling), que indican la cantidad de veces que la textura se proyecta sobre las caras del cubo.

– Prueba a modificar los valores de la columna Tiling poniendo valores como 2, 5 ó 10 y observa el cubo de cerca en la Vista de Escena. Verás cómo la textura ahora se muestra repetidas veces sobre cada cara del cubo. Ésto resulta especialmente útil para por ejemplo componer suelos y paredes con una única textura de baldosa y un plano sobre el que se repite varias veces.

Una vez entendido ésto es hora de configurar la reacción que nuestro material tiene con la luz. Los materiales pueden reflejarla o absorberla en distinta medida, los materiales que absorben la luz se denominan difusos (Diffuse), mientras que los que la reflejan se denominan especulares (Specular).

Tutorial de Unity 3D Introducción a los Shaders de Unity3D Pág. 19

Tutorial de Unity 3DTema 3

Introducción a los Shaders de Unity3D

Según la captura anterior, observa que en el apartado Shader hay una lista desplegable en la que ahora mismo figura como selección Diffuse.

– Haz clic en la lista desplegable del Shader y selecciona Specular para hacer que el material del cubo pase a reflejar la luz que le llega. Es normal que el menú tarde un poco en responder.

En este punto es importante que sepas que aunque Unity incluye por defecto aproximadamente unos 50 shaders distintos para materiales, la gran mayoría de ellos parten de ser o bien difusos o bien especulares. Observa la lista de la derecha, incluso si accedes a las categorías desplegables, verás que todos los shaders se caracterizan por ser difusos (Absorben la luz) o ser especulares (Reflejan la luz).

Habrás notado también que, en la Vista de Inspector, abajo del todo, la ventana del material ha cambiado ligeramente después de haber seleccionado el shader especular. Ahora tenemos una caja de color adicional en la que podremos dar un color de teñido especular para los reflejos de luz (Specular Color) y una barra que podemos arrastrar de izquierda a derecha para indicar el brillo (Shininess), que indicará en qué medida el material refleja la luz que recibe.

Salvo raras excepciones, en el color especular deberías asignar algún tipo de gris, consiguiendo así que la luz reflejada pierda un poco de intensidad sin modificar su color original. En cuanto a la barra de brillo, poniéndola a la izquierda conseguimos el máximo brillo, mientras que poniéndola a la derecha conseguimos un efecto muy similar al del shader difuso.

– Haz unas pruebas con diferentes texturas aplicando el shader difuso y el especular. Observarás que el especular resulta más apropiado para texturas metalizadas.

Tutorial de Unity 3D Introducción a los Shaders de Unity3D Pág. 20

Tutorial de Unity 3DTema 3

Introducción a los Shaders de Unity3D

El shader especular que acabamos de usar es el más básico de los que trae Unity y no resulta para nada realista, pero sí es importante comprender su funcionamiento antes de pasar a utilizar otros tipos de shader más avanzados. Antes de continuar echa un vistazo a la siguiente captura en la que podemos ver el resultado visual de un objeto a medida que modificamos la cantidad de luz (De derecha a izquierda) y la cantidad de brillo (De arriba a abajo) de su material.

Otra conclusión importante que podemos sacar de ésto es que con una única textura podemos obtener infinidad de materiales distintos.

Vamos a dar paso ahora a los materiales más avanzados de Unity. Si vuelves a echar un vistazo a la lista completa de shaders disponibles en la Vista de Inspector, observarás también que gran parte de ellos vienen prefijados con la palabra “Bumped”. Este término hace referencia a un efecto de profundidad que se aplicará sobre la superficie del material dando la sensación de que no es totalmente plana, si no que realmente las irregularidades dibujadas en la textura tienen una profundidad real.

La mejor manera de entender esto último es configurando un shader de este tipo.

– Despliega la lista de shaders y selecciona Bumped Specular. Observa que podríamos utilizar también Bumped Diffuse, pero la única diferencia será si reflejará o no la luz, y en este caso queremos ver en todo su esplendor el efecto de profundidad en la superficie.

Tutorial de Unity 3D Introducción a los Shaders de Unity3D Pág. 21

Tutorial de Unity 3DTema 3

Introducción a los Shaders de Unity3D

Nuevamente, en la Vista de Inspector podemos ver que la ventana del material ha vuelto a cambiar, en este caso luce tal y como la podemos ver en la captura de la derecha.

La única diferencia respecto del shader especular anterior es que ahora observamos que hay un segundo campo llamado Normalmap (Mapa de normales) para una textura.

La textura de mapa de normales es la que generará las irregularidades en la superficie del material. Existen muchas formas de obtener mapas de normales, pero vamos a utilizar una muy sencilla.

– En la Vista de Inspector, abajo del todo, haz clic en la textura de base que tiene asignada tu objeto.

Comprobarás que en la Vista de Proyecto aparece marcada en amarillo. Ésta es una forma rápida de encontrar el recurso de proyecto que estamos usando, muy útil cuando comenzamos a tener gran cantidad de texturas.

– Ve a la Vista de Proyecto, selecciona la textura y pulsa el atajo de teclado Ctrl+D para duplicarla. También puedes ir a la pestaña superior Edit Duplicate.→

– Haz clic sobre la nueva textura duplicada para poder renombrarla. En nuestro caso, si la textura original se llama “Textura Cuero” vamos a renombrar la nueva como “Textura Cuero Bump”.

Ahora con la nueva textura seleccionada en la Vista de Proyecto, observa la Vista de Inspector. Te mostrará diversos parámetros con la configuración actual de la textura y abajo del todo una previsualización. La ventana que estás viendo se denomina Importador de Texturas.

Tutorial de Unity 3D Introducción a los Shaders de Unity3D Pág. 22

Tutorial de Unity 3DTema 3

Introducción a los Shaders de Unity3D

Vamos a configurar nuestra nueva textura para que pase a ser un mapa de normales.

– En el apartado Texture Type (Tipo de textura), haz clic en la pestaña desplegable y selecciona la opción Normal Map.

Observarás que la celda Alpha from Grayscale se activará automáticamente, ésto servirá para que las irregularidades se generen a partir de la textura en escala de grises, siendo las zonas más oscuras las más profundas.

También aparecen 2 nuevos parámetros configurables: La barra desplazable de profundidad (Bumpiness) indica cómo de pronunciadas serán las irregularidades en las superficie, mientras que filtro (Filtering) nos permite seleccionar 2 modos distintos para calcularlas.

– Configura un factor de Bumpiness no muy alto, por ejemplo 0,1 será suficiente, y deja el filtro por defecto ya que generalmente es cuestión de probar el filtro que mejor resultado nos ofrece.

– Abajo del todo en la Vista de Inspector también, haz clic en Apply para aplicar los cambios y observa abajo del todo la nueva textura que hemos generado.

La nueva textura está compuesta por tonos azulados en su mayoría. Todas las desviaciones del azul puro serán las irregularidades de las que hablábamos. Vamos ahora a hacer uso de este mapa de normales en nuestro material.

– En la Vista de Jerarquía, vuelve a seleccionar el cubo.

Tutorial de Unity 3D Introducción a los Shaders de Unity3D Pág. 23

Tutorial de Unity 3DTema 3

Introducción a los Shaders de Unity3D

– En la Vista de Inspector, abajo del todo, haz clic en el botón Select, en la celda correspondiente a la textura de mapa de normales según la siguiente captura. Ésto abrirá una ventana con todas las texturas del proyecto.

– Busca en ella la textura de mapa de normales que acabamos de crear, selecciónala y pulsa Intro para finalizar.

Otra opción interesante para este último paso hubiese sido arrastrar directamente la textura de mapa de normales desde la Vista de Proyecto hasta la celda en la Vista de Inspector.

– En la Vista de Jerarquía, haz doble clic en el cubo para centrarlo en la Vista de Escena y observa el resultado.

– En la Vista de Jerarquía, haz doble clic en la luz direccional para centrarla en la Vista de Escena. Utiliza el botón de Rotar en la parte superior izquierda (Atajo de teclado E) y prueba diferentes orientaciones de la luz para comprobar su efecto sobre el nuevo material.

Tutorial de Unity 3D Introducción a los Shaders de Unity3D Pág. 24

Tutorial de Unity 3DTema 3

Introducción a los Shaders de Unity3D

6. Iluminación

Un material con mapa de normales como el que hemos creado anteriormente simula la presencia de irregularidades en una superficie que realmente es plana. Generalmente no apreciaremos con gran detalle el resultado si permanecemos quietos o si no tenemos luces en movimiento.

Vamos a añadir una luz sobre nuestro cubo y moverla sobre su superficie para ver el resultado.

– En la Vista de Jerarquía, haz doble clic en el cubo para centrarlo en la Vista de Escena.

– En las pestañas superiores, haz clic en GameObject Create Other Point Light para crear una luz→ → puntual en la misma posición que el cubo.

– Utiliza el botón Mover que se encuentra arriba a la izquierda del interfaz (Atajo de teclado W) y coloca la luz puntual justo sobre la superficie del cubo.

– Desplaza la Vista de Escena hasta la superficie del cubo para ver el efecto, mueve de nuevo la luz de punto para comprobar cómo las irregularidades ganan realismo con el movimiento de la cámara o de las luces en la escena.

Tutorial de Unity 3D Introducción a los Shaders de Unity3D Pág. 25

Tutorial de Unity 3DTema 3

Introducción a los Shaders de Unity3D

7. Materiales en objetos de Turbosquid

A continuación vamos a aplicar los conocimientos que hemos adquirido sobre materiales a los objetos descargados en Turbosquid. Cada objeto 3D que descargamos es muy distinto del resto, así que vamos a utilizar como ejemplo la motocicleta que utilizamos anteriormente y que ya tenemos en la escena.

– En la Vista de Jerarquía, localiza la motocicleta y haz doble clic en ella para centrarla en la Vista de Escena.

– Observa que en la Vista de Jerarquía, la motocicleta aparece como una lista desplegable, despliégala de la misma manera que se despliegan las carpetas en la Vista de Proyecto.

Deberías ver algo similar a la siguiente captura. Los objetos en Unity pueden establecer jerarquías unos con otros, de forma que las acciones realizadas sobre el objeto padre como pueden ser posicionar, rotar o escalar, también afectan a sus hijos.

En nuestro caso la motocicleta incluye más de 10 objetos hijo en su jerarquía.

– En la Vista de Jerarquía, selecciona uno por uno los objetos hijo de la motocicleta haciendo doble clic en ellos para centrarlos en la Vista de Escena y observa que son partes distintas.

– Durante el proceso, en la Vista de Inspector, abajo del todo, observa que todos los objetos hijo que corresponden a partes gráficas de la motocicleta tienen uno o varios materiales asociados.

– Aplica los conceptos que has aprendido sobre materiales para conseguir en la moto un resultado similar al de la siguiente captura.

Tutorial de Unity 3D Introducción a los Shaders de Unity3D Pág. 26

Tutorial de Unity 3DTema 3

Introducción a los Shaders de Unity3D

Observa que para conseguir que el mapa de normales se aplique varias veces sobre algunas superficies hemos hecho uso del factor de repetición (Tiling) que hemos explicado anteriormente.

A continuación una captura de la configuración del material del asiento de la motocicleta, observa como hemos utilizado un factor de tileo de 4 tanto en la textura de base como en el mapa de normales. También hemos utilizado como color de base el negro para evitar que el asiento se muestre rojo.

- Aplica todo lo anterior a nuevos objetos de Turbosquid y realiza la composición de un escenario con gran cantidad de objetos, materiales y luces.

Tutorial de Unity 3D Introducción a los Shaders de Unity3D Pág. 27

Tutorial de Unity 3DTema 3

Introducción a los Shaders de Unity3D

8. Actividades de evaluación propuestas

Como actividades complementarias, podemos hacer una serie de capturas de pantalla para poder mostrar el fruto final de nuestro trabajo. No olvides maximizar la Vista de Juego y pulsar Play para recorrer las zonas visualmente más atractivas de tu escenario, una vez te encuentres en una ubicación interesante, para capturar la imágen que ves, recuerda que puedes hacer lo siguiente:

– Instala el programa gratuito Paint.NET (También sirve cualquier otro programa de diseño gráfico que sepas manejar).

– Vuelve a Unity y cuando la Vista de Juego muestre una escena interesante pulsa la tecla Impr Pant que generalmente encontrarás en la parte superior del teclado a mano derecha.

– Vuelve a Paint.NET y haz clic en la pestaña Edición Pegar para volcar el contenido de la captura de→ pantalla en el programa.

– Nuevamente en Paint.NET haz clic en Archivo Guardar para guardar las capturas de pantalla que→ vayas realizando.

Ahora puedes enseñar fácilmente tu trabajo, difundirlo a través de redes sociales o publicarlo en tú página web.

Tutorial de Unity 3D Introducción a los Shaders de Unity3D Pág. 28