Capítulo 4

7. Ahora que nos hemos ocupado de nuestras necesidades de transparencia, debemos trabajar en
Emisión mapa. Desde el Bienes carpeta, duplica la DIFF_package textura, cámbiale el nombre EMI_package,
y ábralo en su editor de imágenes.

8. Seleccione todos los personajes de la Sra. Laser inscripción y la estrella verde (en Photoshop, esto se puede
hacer con la herramienta Varita mágica, manteniendo la Cambio
pulsada mientras selecciona varias áreas).

9. Copie y pegue su selección en una nueva capa. Luego, selecciónelo y aplíquele un filtro de ruido (en
Photoshop, esto se puede hacer navegando a Filtro | Ruido Añadir ruido...).
Utilizar 50% como el valor.

10. Cree una nueva capa y, utilizando una herramienta como la Bote de pintura, llénalo de negro
(R: 0, GRAMO: 0, SEGUNDO: 0). Coloque esta capa negra debajo de la que tiene los elementos de color.

11. Aplanar la imagen (en Photoshop, esto se puede hacer navegando a Capa | Aplanar
Imagen) y guarde su archivo:

163
Crear mapas y materiales

12. De vuelta en Unity, en el Bienes carpeta, expandir packagePrefab y seleccione el

PackageCard objeto. Ahora, en el Inspector ver, desplácese hacia abajo hasta la Material
componente y asignar el EMI_package textura a su Emisión espacio. Luego, cambie el Emisión ranura de color a
blanco R: 255; GRAMO: 255; SEGUNDO: 255), y baja su intensidad a
0,25, como se muestra en la siguiente captura de pantalla. Además, cambie su soldado americano opción a Ninguna, para que su brillo

no se agregue a los Lightmaps ni influya en la iluminación en tiempo real:

13. Coloque una instancia del packagePrefab en tu escena y mira los resultados.
Tu material está listo:

Cómo funciona...

Unity puede leer cuatro canales de un mapa de textura: R (rojo), G (verde), B (azul) y A (alfa). Cuando se establece en Transparente
o Recorte, el canal Alfa del mapa de textura difusa establece la transparencia del material de acuerdo con el nivel de brillo de
cada píxel (el Separar el modo no renderizará semitransparencia, solo píxeles completamente visibles o invisibles). Es posible
que haya notado que no agregamos un canal Alpha; esto se debe a que Photoshop exporta el mapa Alpha del PNG, basado en
su transparencia. Para ayudarle a visualizar el mapa Alpha, el 1362_04_04 carpeta

164
 Capítulo 4

contiene una DIFF_packageFinal.TIF archivo con un mapa Alpha que funciona exactamente de la misma manera que el archivo
PNG que hemos generado:

En cuanto al mapa de textura de Emisión, Unity asigna sus colores RGB al material, combinándolos con la ranura de
selección de color adecuada, y también permitiendo ajustes a la intensidad de esa Emisión.

Hay más...

Veamos un poco más de información sobre Transparencia y Emisión.

Usar mapas de textura con el modo transparente

Tenga en cuenta que puede utilizar una textura de mapa de bits para Difuso mapa en el Transparente
modo de renderizado. En este caso, los valores RGB se interpretarán como el color Difuso, mientras que el Alfa se utilizará
para determinar la transparencia de ese píxel (en este caso, se permiten materiales semitransparentes).

Evitar problemas con los objetos semitransparentes.

Es posible que haya notado que la caja de plástico estaba hecha de dos objetos ( Paquete De Plástico
y innerPlastic). Esto se hizo para evitar problemas de ordenación z, donde las caras se representan frente a otra geometría
cuando deberían estar detrás de ella. Tener varias mallas en lugar de una sola permite que estas caras se clasifiquen
correctamente para el renderizado. Materiales en el Separar
Sin embargo, el modo no se ve afectado por este problema.

Emitir luz sobre otros objetos

los Emisión El valor se puede usar para calcular la proyección de luz del material sobre otros objetos cuando se usan Lightmaps.

165
Crear mapas y materiales

Resaltar materiales al pasar el mouse

Cambiar el color de un objeto en tiempo de ejecución puede ser una forma muy eficaz de hacer saber a los jugadores que pueden
interactuar con él. Esto es muy útil en varios juegos. géneros como rompecabezas y aventuras de apuntar y hacer clic, y también se
puede utilizar para crear interfaces de usuario en 3D.

Preparándose

Para esta receta, usaremos objetos creados directamente en Unity. Alternativamente, puede utilizar cualquier modelo 3D que desee.

Cómo hacerlo...

Para resaltar un material al pasar el mouse, siga estos pasos:

1. Cree un nuevo proyecto 3D y agregue un Cubo a la escena (desde el Jerarquía ver,

navegar a Crear | Objeto 3D | Cubo).

2. Desde el Proyecto ver, haga clic en el Crear menú desplegable y elija Material.
Nombralo HighlightMaterial.

3. Seleccione ResaltarMaterial, y, desde el Inspector ver, cambiar su Albedo color

a gris (R: 135, GRAMO: 135, SEGUNDO: 135), sus Emisión intensidad a 1, como se muestra en la captura de pantalla a

continuación, y es Emisión color a R: 1, GRAMO: 1, SEGUNDO: 1:

4. Asignar ResaltarMaterial al Cubo que creó anteriormente.

5. Desde el Proyecto ver, haga clic en el Crear menú desplegable y elija

Secuencia de comandos de C #. Cambiarle el nombre HighlightObject y ábralo en su editor.

6. Reemplace todo con el siguiente código:

usando UnityEngine;
usando System.Collections;
HighlightObject de clase pública: MonoBehaviour {
private Color initialColor;
public bool noEmissionAtStart = true; public Color highlightColor =
Color.red; public Color mousedownColor = Color.green;

private bool mouseon = false;

166
 Capítulo 4

renderizador privado myRenderer;

void Start () {
myRenderer = GetComponent <Renderer> ();
si (noEmissionAtStart)
initialColor = Color.black;
más
initialColor = myRenderer.material.GetColor ("_ EmissionColor");
}

void OnMouseEnter () {
mouseon = verdadero;
myRenderer.material.SetColor ("_
EmissionColor ", color de resaltado);
}

void OnMouseSalir () {
mouseon = falso;
myRenderer.material.SetColor ("_ EmissionColor", initialColor);
}

void OnMouseDown () {
myRenderer.material.SetColor ("_ EmissionColor",
mousedownColor);
}

void OnMouseUp () {
si (mouseon)
myRenderer.material.SetColor ("_ EmissionColor",
resaltarColor);
más
myRenderer.material.SetColor ("_ EmissionColor", initialColor);
}
}

7. Guarde su secuencia de comandos y adjúntela a la Cubo.

8. Seleccione el Cubo, y en el Inspector ver, establecer el Resaltar color y Ratón hacia abajo
Color valores a cualquier color que desee:

167
Crear mapas y materiales

9. Si está utilizando el script con su propia malla 3D importada, asegúrese de agregar un Colisionador
componente a su objeto.

10. Pruebe la escena. los Cubo se resaltará en rojo cuando el mouse esté sobre él
(y verde cuando se hace clic en él).

Cómo funciona...

Al cubo se le envían automáticamente los eventos de entrada / salida / abajo / arriba del mouse cuando el usuario mueve el puntero
del mouse sobre y alejándose de la parte de la pantalla donde el cubo es visible. Nuestro script agrega un comportamiento al cubo
cuando se detectan estos eventos. los Comienzo() El método obtiene una referencia al Renderizador componente del GameObject al
que se ha agregado el script y lo almacena en la variable myRenderer ( tenga en cuenta que 'renderizador' ya tiene un significado en
Unity, por lo que no es apropiado como nombre de variable privada para este script). La variable booleana llamada mouseon registra si
el puntero del mouse se encuentra actualmente sobre el objeto o no. Cuando se suelta el botón del mouse, usamos el mouseon variable
para decidir si cambiar el cubo a su color inicial ( mouseon FALSO, por lo que el puntero del mouse está lejos del cubo), o de regreso a
su color de resaltado ( mouseon VERDADERO, por lo que el puntero del mouse está sobre el cubo).

La razón por la que necesitábamos cambiar el original del material Emisión color a gris ultra oscuro es que dejarlo en
negro habría provocado que Unity optimizara el Shader al eliminar el
Emisión propiedad del material. Nuestro guión no habría funcionado si esto hubiera sucedido.

Hay más...

Puede lograr otros resultados interesantes cambiando las otras propiedades de su material (cambiando el _ EmisiónColor
guión a _ Color o "_ SpecularColor, por ejemplo). Para obtener una lista completa de propiedades, seleccione su material
y, en el Inspector ver, haga clic en el Editar
botón, al lado del Shader Menú desplegable.

Adición de mapas detallados a un material

Al crear un objeto grande, no solo existe el deseo de texturizarlo como un todo, sino también de agregar detalles que puedan hacer que se
vea mejor a distancias más cercanas. Para superar la necesidad de mapas de texturas gigantes, el uso de mapas detallados puede marcar
una diferencia real. En esta receta, agregaremos mapas de detalle a un cohete de juguete aplicando una máscara de detalle y un mapa de
detalle normal. En nuestro caso, queremos agregar una calidad texturizada (y un patrón de rayas) al plástico verde, excepto en la región
donde hay un compartimento para la batería y el logo del juguete:

168
 Capítulo 4

Preparándose

Para esta receta, hemos preparado un paquete Unity, que contiene el prefabricado para un cohete de juguete. La casa
prefabricada incluye el modelo 3D y un material, con un mapa difuso y un mapa normal (hecho a partir de un mapa de altura). El
archivo se puede encontrar en el 1362_04_06 carpeta.

Cómo hacerlo...

Para agregar los mapas detallados a su objeto, siga estos pasos:

1. Importe el paquete de unidad de cohete archivo en su proyecto. Luego, seleccione el

prefabricado llamado cohete desde el Bienes carpeta, en la Proyecto ver y colocarlo en su escena.

2. Desde el Jerarquía ver, expandir el cohete GameObject y seleccione su hijo llamado rocketLevel1. Luego,
desplácese hacia abajo en el Inspector ver a la Material
componente. Observe que usa el DIFF_ship textura como la Difuso mapa. Duplique este archivo y cambie
el nombre de la nueva copia COPY_ship.

3. Abierto COPY_ship en su editor de imágenes. Seleccione todos los píxeles verdes sólidos alrededor del logotipo y el

compartimento de la batería (en Photoshop, esto se puede hacer con la herramienta Varita mágica, manteniendo la Cambio tecla

presionada mientras selecciona múltiples áreas):

169
Crear mapas y materiales

4. Manteniendo su selección activa, acceda a la imagen Canales ventana (en Photoshop,

esto se puede hacer navegando a Ventana | Canales). Haga clic en Nuevo canal.
Esta sera nuestra Alfa canal:

5. Ocultar el Rojo verde y Azul canales. Selecciona el Alfa canalizar y pintar el

selección blanco. Luego, seleccione el área del compartimiento de la batería y píntela de gris (R, G y B: 100):

6. Guárdelo en formato TIFF como MASK_ship.TIF, en el Bienes carpeta. Asegúrate de eso

tu incluyes Canales alfa:

7. Ahora que tenemos la máscara, creemos un mapa difuso para nuestro detalle. En su editor de imágenes, cree una nueva
imagen con las siguientes dimensiones: anchura: 64, y altura: 64.

170
 Capítulo 4

8. Rellena la nueva imagen con gris (R, G y B: 128). Luego, use formas o rellenos rectangulares para
crea un gris oscuro (R, G y B: 100) línea horizontal de unos 16 píxeles de alto:

9. Guarde la imagen como DIFF_detail.PNG en el Bienes carpeta.

10. Cree una nueva imagen de 64 x 64. Utilizar una Degradado herramienta para crear un blanco y negro Radial

Degradado ( en Photoshop, esto se puede hacer con el Degradado Herramienta en Radial modo):

11. Guarde la imagen como HEIGHT_detail.PNG en el Bienes carpeta.

12. Vuelve a Unity. Desde el Bienes carpeta, seleccione HEIGHT_detail. Entonces, de

la Inspector ver, cambiar su Tipo de textura a Mapa normal, comprobar el Crear desde escala de grises opción,
ajustar Irregularidad a 0,25, y establecer Filtración a suave.
Haga clic en Aplicar para guardar los cambios:

13. Desde el Jerarquía ver, expandir el cohete GameObject y seleccione su

niño llamado rocketLevel1. Luego, desplácese hacia abajo en el Inspector ver a la Material
componente. Asignar MASK_ship al Máscara de detalle espacio; DIFF_detail como
Mapas secundarios | Detalle Difuso x 2; y HEIGHT_detail como Mapas secundarios | Mapa normal. Además,
gire el Mapa normal intensidad hasta 0,6.

171
Crear mapas y materiales

14. En el Mapas secundarios sección, cambie el Embaldosado valores a X: 200, y Y: 50. usted
podría notar que el patrón no es perfecto. Esto se debe a que estamos usando el mismo Conjunto UV de
nuestro Difuso textura. Sin embargo, el objeto se ha asignado a dos Canales UV ( cuando se estaba
modelando). Mientras que el canal UV 1 contiene el mapeo de nuestro Difuso mapa, el canal UV 2 utiliza un
mapeo cilíndrico básico. Necesitamos cambiar el Mapas secundarios sección Conjunto UV desde UV0 a

UV1. El mapa detallado de su material está listo:

Cómo funciona...

Cuando esté en uso, Mapas secundarios se mezclan en el primario del material Difuso y Normal
mapas (es por eso que nuestro objeto es verde incluso después de la Detalle difuso se aplica: los tonos grises se superponen
sobre el original Difuso textura). Usando un Máscara de detalle, el artista define qué áreas del objeto deben verse afectadas por los
mapas secundarios. Esto es excelente para la personalización y también para crear matices (como el compartimiento de la batería
semi-golpeado en nuestro ejemplo).

Otra característica útil es la posibilidad de utilizar un canal UV independiente para mapas de detalles y mosaicos. Además de
agregar variación al mapeo de texturas, esto nos permite pintar los detalles que se pueden percibir incluso a una distancia muy
cercana al mejorar dramáticamente la calidad visual de nuestros objetos.

172
 Capítulo 4

Desvaneciendo la transparencia de un material

En esta receta, crearemos un objeto que, una vez hecho clic, se desvanece y desaparece. Sin embargo, el script será lo
suficientemente flexible como para permitirnos ajustar los valores alfa inicial y final. Además, tendremos la opción de hacer que el
objeto sea autodestructible cuando se vuelva invisible.

Cómo hacerlo...

Sigue estos pasos:

1. Agregue un Esfera a tu escena accediendo al GameObject | Objeto 3D | Esfera

menú.

2. Selecciona el Esfera y asegúrese de que tenga un colisionador (si está utilizando un objeto 3D personalizado, es posible que
deba agregar un colisionador a través del Componentes | Física menú).

3. Crea un nuevo material. La forma más sencilla de hacerlo es acceder al Proyecto ver, haga clic en el Crear
menú desplegable y elija Material.

4. Cambie el nombre de su nuevo material. Para este ejemplo, llamémoslo Fade_MAT.

5. Seleccione su material. Desde el Inspector vista, use el menú desplegable para cambiar su Modo de renderizado a Desvanecerse:

los Desvanecerse El modo de renderizado está diseñado específicamente para situaciones como esta.
Otros modos de renderizado, como Transparente, harán que el color del Albedo se vuelva
transparente, pero no los reflejos ni los reflejos, en cuyo caso el objeto seguirá siendo visible.

6. Aplicar el FadeMaterial a Esfera arrastrándolo desde el Proyecto ver en el

Esfera Nombre del objeto del juego en el Jerarquía ver.

7. Desde el Proyecto ver, haga clic en el Crear menú desplegable y elija Secuencia de comandos de C #.

Cambiarle el nombre a FadeMaterial y ábralo en su editor.

173
Crear mapas y materiales

8. Reemplace su secuencia de comandos con el siguiente código:

usando UnityEngine;
usando System.Collections;
public class FadeMaterial: MonoBehaviour {
public float fadeDuration = 1.0f; public bool useMaterialAlpha =
false; public float alphaStart = 1.0f; public float alphaEnd = 0.0f;

public bool destroyInvisibleObject = true; private bool isFading = false;

alphaDiff flotante privado;

startTime flotante privado;
render privado Renderer;
color privado fadeColor;

void Start () {
rend = GetComponent <Renderer> ();
fadeColor = rend.material.color;

if (! useMaterialAlpha) {
fadeColor.a = alphaStart;
} más {
alphaStart = fadeColor.a;
}

rend.material.color = fadeColor;
alphaDiff = alphaStart - alphaEnd;
}

Void Update () {
if (isFading) {
var elapsedTime = Time.time - startTime;

if (elapsedTime <= fadeDuration) {

var fadeProgress = elapsedTime / fadeDuration; var alphaChange =
fadeProgress * alphaDiff; fadeColor.a = alphaStart - alphaChange;
rend.material.color = fadeColor;

} más {
fadeColor.a = alphaEnd;
rend.material.color = fadeColor;

si (destroyInvisibleObject)
Destruir (gameObject);

174
 Capítulo 4

isFading = falso;
}
}
}

void OnMouseUp () {
FadeAlpha ();
}

public void FadeAlpha () {

isFading = verdadero;
startTime = Time.time;
}
}

9. Guarde su script y aplíquelo al Esfera Juego.

10. Reproduzca su escena y haga clic en el Esfera para verlo desvanecerse y autodestruirse.

Cómo funciona...

Dado que la opacidad del material con un Shader transparente está determinada por el valor alfa de su color principal, todo lo que
tenemos que hacer para desvanecerlo es cambiar ese valor durante un período de tiempo determinado. Esta transformación se
expresa, en nuestro script, en las siguientes líneas de código:

var fadeProgress = elapsedTime / fadeDuration; var alphaChange =

fadeProgress * alphaDiff; fadeColor.a = alphaStart - alphaChange;
rend.material.color = fadeColor;

Hay más...

Podrías llamar al FadeAlpha funcionar en otras circunstancias (como Cuerpo rígido

colisión, por ejemplo). De hecho, incluso podría llamarlo desde el script de otro objeto de juego usando
el GetComponent mando. El guión sería algo como:

GameObject.Find ("Esfera"). GetComponent <FadeMaterial> () .FadeAlpha ();

Reproducción de videos dentro de una escena

Televisores, proyectores, monitores ... Si quieres materiales animados complejos en tu nivel, puedes reproducir archivos de vídeo como
mapas de textura. En esta receta, aprenderemos cómo aplicar una textura de video a un cubo. También implementaremos un esquema
de control simple que reproduce o pausa el video cada vez que se hace clic en ese cubo.

175
Crear mapas y materiales

Preparándose

Unity importa archivos de video a través de Apple Quicktime. Si no lo tiene instalado en su

máquina, descárguela en http://www.apple.com/quicktime/download/.

Además, si necesita un archivo de video para seguir esta receta, utilice el videoTexture.mov
incluido en la carpeta 1632_04_08.

Cómo hacerlo...

Sigue estos pasos:

1. Agregue un cubo a la escena a través del GameObject | Objeto 3D | Cubo menú.

2. Importe el videoTexture.mov archivo.

3. Desde el Proyecto ver, use el Crear menú desplegable para crear un nuevo
Material. Cambiarle el nombre Video_MAT y, desde el Inspector ver, cambiar su
Shader a Apagado / Textura:

4. Aplicar videoTexture a la ranura de textura de Video_MAT arrastrándolo desde el

Proyecto ver en la ranura correspondiente.

5. Aplica el Video_MAT al Cubo que ha creado previamente.

6. Expandir videoTexture sobre el Proyecto vista para revelar su corresponsal Segmento de audio.
Luego, aplique ese clip de audio al Cubo ( puedes hacerlo arrastrándolo desde el Proyecto
ver a la Cubo en el Jerarquía vista, o una Escena ver).

176
 Capítulo 4

7. Selecciona el Cubo. Asegúrese de que haya un Colisionador componente visible desde el Inspector
ver. En caso de que no haya uno, agréguelo a través del Componente | Física | Colisionador de cajas

menú. Se necesitan colisionadores para la detección de colisiones de ratones.

8. Ahora necesitamos crear un script para controlar la textura de la película y el clip de audio asociado. Desde Proyecto ver, use el Crear menú

desplegable para agregar un Secuencia de comandos de C #. Nombralo

Reproduce el video.

9. Abra el script y reemplácelo con el siguiente código:

usando UnityEngine;
usando System.Collections;

[RequireComponent (typeof (AudioSource))]

public class PlayVideo: MonoBehaviour {

bucle bool público = verdadero;

public bool playFromStart = true; vídeo público
MovieTexture;
public AudioClip audioClip;
audio AudioSource privado;

void Start () {
audio = GetComponent <AudioSource> ();

si (! video)
video = GetComponent <Renderer> () .material.mainTexture como MovieTexture;

si (! audioClip)
audioClip = audio.clip;

video.Stop ();
audio.Stop ();
video.loop = loop;
audio.loop = bucle;

si (playFromStart)
ControlMovie ();
}

void OnMouseUp () {
ControlMovie ();
}

177
Crear mapas y materiales

Public void ControlMovie () {

if (video.isPlaying) {
video.Pause ();
audio.Pause ();
} más {
video.Play ();
audio.Play ();
}
}
}

10. Guarde su secuencia de comandos y adjúntela a la Cubo.

11. Pon a prueba tu escena. Debería poder ver la película que se está reproduciendo en la cara del cubo y también pausarla / reproducirla

haciendo clic en ella.

Cómo funciona...

De forma predeterminada, nuestro script hace que la textura de la película se reproduzca en modo de bucle. Sin embargo, existe una variable

booleana que se puede cambiar mediante el Inspector panel, donde está representado por una casilla de verificación. Asimismo, hay una casilla de

verificación que se puede utilizar para evitar que la película se reproduzca cuando comienza el nivel.

Hay más...

Hay algunos otros comandos y parámetros de textura de película con los que se puede jugar. No olvide consultar la
guía de secuencias de comandos de Unity en http://docs.unity3d.com/
Documentation / ScriptReference / MovieTexture.html.

Conclusión
Este capítulo ha cubierto una serie de técnicas utilizadas para crear, a menudo de forma manual y a veces automática, mapas de
textura que son capaces de dar características distintivas a los materiales. Con suerte, ahora está más seguro de trabajar con el
nuevo Sombreado basado en la física de Unity, que es capaz de comprender las diferencias entre los flujos de trabajo disponibles, es
consciente del papel de cada propiedad del material y está listo para crear materiales de mejor apariencia para sus juegos. También
hemos explorado formas de cambiar las propiedades de los materiales durante el tiempo de ejecución accediendo al material de un
objeto a través de un script.

178
 Capítulo 4

Recursos

El renderizado basado en la física es un tema complejo (y actual), por lo que es una buena idea estudiarlo un poco
familiarizándose con las herramientas y conceptos que hay detrás. Para ayudarlo con esta tarea, hemos incluido una lista no
exhaustiva de recursos a continuación que debe consultar.

Referencias
Aquí hay una lista de material interesante y detallado sobre la representación basada en la física (dentro y fuera de Unity):

F La guía completa de PBR, volúmenes 1 y 2 por Wes McDermott (Allegorithmic),

disponible en http://www.allegorithmic.com/pbr-guide. Esta guía toma una
análisis en profundidad de los aspectos prácticos y teóricos de PBR, incluido un gran análisis de los posibles flujos de
trabajo.

F Dominar el sombreado de base física en Unity 5 por Renaldas Zioma (Unity), Erland Körner (Unity) y
Wes McDermott (Allegorithmic), está disponible en http: // www.
slideshare.net/RenaldasZioma/unite2014-mastering-physically-
basado-sombreado-en-unidad-5. Esta es una presentación detallada sobre el uso de PBS en Unity.
Presentado originalmente en la conferencia Unite 2014, contiene información desactualizada, pero, no
obstante, vale la pena echarle un vistazo.

F Sombreado basado en la física en Unity 5 por Aras Pranckevičius, de Unity, está disponible
a http://aras-p.info/texts/talks.html. Diapositivas y notas de un
presentación sobre el tema se dan en el GDC.

F Tutorial: renderizado basado en la física, ¡y tú también puedes! por Joe "EarthQuake" Wilson
está disponible en http://www.marmoset.co/toolbag/learn/pbr-practice.
Es una gran descripción de los creadores de Bolsa de herramientas para tití y Skyshop.

F Wiki de Polycount PBR, que está disponible en http://wiki.polycount.com/wiki/ PBR, es una lista de recursos
compilada por la comunidad de Polycount.

Herramientas

Esta es una nueva generación de software de texturizado para que la revise, en caso de que aún no lo haya hecho:

F Pintor de sustancias es una aplicación de pintura 3D de Allegorithmic. Está disponible en

http://www.allegorithmic.com/products/substance-painter. Otra vez,
Vale la pena mencionar que los productos Allegorithmic no utilizarán el Shader estándar de Unity, sino que se basarán en
archivos de sustancia que son compatibles de forma nativa con Unity.

F Bitmap2Material crea materiales con todas las funciones (incluidos mapas normales, mapas
especulares y más) a partir de una única imagen de mapa de bits. Además, es de Allegorithmic, y
está disponible en http://www.allegorithmic.com/
productos / bitmap2material.

179
Crear mapas y materiales

F Quixel DDO es un complemento para crear texturas listas para PBR en Adobe Photoshop. De
Quixel, está disponible en http://www.quixel.se/ddo.

F Quixel NDO es un complemento para crear mapas normales en Adobe Photoshop. De

Quixel, está disponible en http://www.quixel.se/ndo.

F Mari es una herramienta de pintura 3D de The Foundry. Está disponible en

http://www.thefoundry.co.uk/products/mari/.

180
 Capítulo 5

5
Usar cámaras

En este capítulo, cubriremos:

F Crear un efecto de imagen en imagen Cambiar entre

F varias cámaras Crear texturas a partir del contenido

F de la pantalla Hacer zoom en una cámara telescópica

F Visualización de un minimapa

F Crear una cámara de vigilancia en el juego

Introducción
Como desarrolladores, nunca debemos olvidar prestar atención a las cámaras. Después de todo, son las ventanas a través
de las cuales nuestros jugadores ven nuestros juegos. En este capítulo, veremos formas interesantes de usar cámaras que
mejoran la experiencia del jugador.

El panorama

Las cámaras se pueden personalizar de muchas formas:

F Pueden excluir del renderizado objetos en capas específicas. Se pueden configurar para renderizar en Ortográfico

F modo (es decir, sin perspectiva) Pueden tener su Campo de visión (FOV) manipuladas para simular una lente

F gran angular Se pueden renderizar sobre otras cámaras o dentro de áreas específicas de la pantalla Se pueden

F renderizar en texturas

181
Usar cámaras

La lista continua.

Dos vistas de cámara simultáneas

Tenga en cuenta que a lo largo de este capítulo, notará que algunas recetas cuentan con un equipo de cámara que sigue al personaje en
tercera persona del jugador. Esa plataforma es la Plataforma de cámara multiusos,
originalmente disponible en los activos de muestra de Unity, que se pueden importar a sus proyectos navegando a Activos
| Importar paquete | Cámara. Para facilitar las cosas, organizamos
Cámara multiusos Unity Package que lo contiene como un prefabricado, que se puede encontrar
en el 1362_05_codes carpeta.

182
 Capítulo 5

Creación de un efecto de imagen en imagen

Mostrar más de una ventana gráfica puede resultar útil en muchas situaciones. Por ejemplo, es posible que desee mostrar eventos
simultáneos que se llevan a cabo en diferentes ubicaciones, o puede que desee tener una ventana separada para juegos multijugador
de asientos calientes. Aunque puede hacer esto manualmente ajustando el Vista normalizada Rect parámetros en su cámara, esta
receta incluye una serie de preferencias adicionales para hacerla más independiente de la configuración de pantalla del usuario.

Preparándose

Para esta receta, hemos preparado el Escena básica Paquete de Unity, que contiene una escena llamada
BasicScene. El paquete está en el 1362_05_codes carpeta.

Cómo hacerlo...

Para crear una visualización de imagen en imagen, simplemente siga estos pasos:

1. Importe el Escena básica paquete en su Proyecto Unity.

2. Desde el Proyecto ver, abrir el Escena básica nivel. Esta es una escena básica con una
personaje animado y algo de geometría extra.

3. Agregar una nueva Cámara a la escena a través del Crear menú desplegable en la parte superior del
Jerarquía ver Crear | Cámara).

4. Seleccione la cámara que ha creado y, desde el Inspector ver, cambiar su Profundidad

a 1, como se muestra en la siguiente captura de pantalla:

183
Usar cámaras

5. Desde el Proyecto ver, crear una nueva Script de C # archivar y cambiarle el nombre

Imagen en imagen.

6. Abra su secuencia de comandos y reemplace todo con el siguiente código:

usando UnityEngine;

PictureInPicture de clase pública: MonoBehaviour {

public enum hAlignment {izquierda, centro, derecha}; public enum vAlignment
{superior, medio, inferior}; public hAlignment horAlign = hAlignment.left;
vAlignment público verAlign = vAlignment.top; Enum público UnitsIn {píxeles,
porcentaje de pantalla}; Unidades públicas en unidad = Unidades en píxeles;

public int ancho = 50; public int altura = 50;

public int xOffset = 0; public int yOffset = 0;
public bool update = true;

privado int hsize, vsize, hloc, vloc;

void Start () {
AdjustCamera ();
}

Void Update () {
si (actualizar)
AdjustCamera ();
}

void AdjustCamera () {
int sw = Screen.width; int sh =
Screen.height;
flotador swPercent = sw * 0.01f; flotador
shPercent = sh * 0.01f;
flotador xOffPercent = xOffset * swPercent; flotador yOffPercent =
yOffset * shPercent; int xOff;

int yOff;
if (unit == UnitsIn.screen_percentage) {
hsize = ancho * (int) swPercent; vsize = altura * (int)
shPercent; xOff = (int) xOffPercent;

yOff = (int) yOffPercent;

} más {
hsize = ancho;

184
 Capítulo 5

vsize = altura;
xOff = xOffset;
yOff = yOffset;
}

switch (horAlign) {
case hAlignment.left:
hloc = xOff;
romper;
case hAlignment.right:
int justfiedRight = (sw - tamaño h); hloc = (justfiedRight -
xOff); romper;

case hAlignment.center:
float justifiedCenter = (sw * 0.5f) - (hsize * 0.5f); hloc = (int) (centro justificado - xOff);

romper;
}

cambiar (verAlign) {
case vAlignment.top:
int justifiedTop = sh - vsize; vloc = (justifiedTop -
(yOff)); romper;

caso vAlignment.bottom:
vloc = yOff;
romper;
case vAlignment.middle:
float justifiedMiddle = (sh * 0.5f) - (vsize * 0.5f); vloc = (int) (justifiedMiddle - yOff);

romper;
}

GetComponent <Camera> () .pixelRect = nuevo

Rect (hloc, vloc, hsize, vsize);
}
}

En caso de que no lo hayas notado, no estamos logrando porcentajes dividiendo números

por 100, sino multiplicándolos por 0.01. La razón detrás de esto es que los procesadores
de computadora son más rápidos en multiplicar que dividir.

185
Usar cámaras

7. Guarde su guión y adjúntelo a la cámara que creó anteriormente.

8. Desmarque la nueva cámara Oyente de audio componente y cambiar algunos de los

Imagen en imagen parámetros: cambiar Hor Align a derecho, Ver alinear a parte superior, y Unidad
a píxeles. Salir XOffset y YOffset como 0, cambio Anchura a 400 y Altura a 200,
como se muestra aquí:

9. Reproduzca su escena. La ventana gráfica de la nueva cámara debe estar visible en la esquina superior derecha de la pantalla, como

se muestra a continuación:

186
 Capítulo 5

Cómo funciona...

En este ejemplo, agregamos una segunda cámara para mostrar la escena desde un punto de vista diferente. La ventana de visualización
relativa de la segunda cámara se colocó originalmente en la parte superior de la Cámara principal' s viewport, ocupando todo el espacio de
la pantalla.

los Imagen en imagen el guión cambia la cámara Vista normalizada Rect, redimensionando y posicionando así la
ventana de acuerdo a las preferencias del usuario.

Primero, lee las preferencias del usuario para el componente (dimensiones, alineación y desplazamiento de la ventana de visualización de

imágenes incrustadas) y convierte las dimensiones en porcentaje de pantalla a píxeles.

Más tarde, desde el if (unit == UnitsIn.screen_percentage) { condicional, el guión

calcula dos de los parámetros Rect de la ventana gráfica (ancho y alto) de acuerdo con la selección del usuario.

Más tarde, para cambiar declaraciones para ajustar los otros dos parámetros Rect de la ventana gráfica (ubicación horizontal y vertical) de

acuerdo con las dimensiones totales de la pantalla, la dimensión de la ventana gráfica PiP, la alineación vertical / horizontal y el desplazamiento.

Finalmente, una línea de código le dice a la cámara que cambie la ubicación y las dimensiones de la cámara.
Viewport Rect:

GetComponent <Camera> () .pixelRect = nuevo

Rect (hloc, vloc, hsize, vsize);

Hay más...

Los siguientes son algunos aspectos de su imagen en imagen que puede cambiar:

Hacer que la imagen en imagen sea proporcional al tamaño de la pantalla

Si cambia el Unidad opción a screen_percentage, el tamaño de la ventana gráfica se basará en las dimensiones reales de la
pantalla en lugar de en los píxeles.

Cambiar la posición de la imagen en imagen

los Ver alinear y Hor Align Las opciones se pueden utilizar para cambiar la alineación vertical y horizontal de la ventana
gráfica. Úsalos para colocarlo donde desees.

Evitar que la imagen en imagen se actualice en cada cuadro

Deja el Actualizar opción desmarcada si no planea cambiar la posición de la ventana gráfica en el modo de ejecución. Además,
es una buena idea dejarlo marcado durante la prueba y desmarcarlo una vez que se haya decidido y configurado el puesto.

187
Usar cámaras

Ver también

F los Visualización de un minimapa receta en este capítulo

Cambiar entre varias cámaras

Elegir entre una variedad de cámaras es una característica común en muchos géneros: carreras, deportes, magnate / estrategia y
muchos otros. En esta receta, aprenderá cómo dar a los jugadores la posibilidad de elegir entre muchas cámaras mediante el uso de
sus teclados.

Preparándose

Para esta receta, hemos preparado el Escena básica Paquete de Unity que contiene una escena llamada
BasicScene. El paquete está en el 1362_05_codes carpeta.

Cómo hacerlo...

Para implementar cámaras intercambiables, siga estos pasos:

1. Importe el Escena básica paquete en un nuevo Proyecto.

2. Desde el Proyecto ver, abrir el Escena básica nivel. Esta es una escena básica con una
personaje animado y algo de geometría extra.

3. Agregue dos cámaras más a la escena a través del Crear menú desplegable en la parte superior del Jerarquía
ver Crear | Cámara). Renombrarlas cam1 y cam2.

4. Cambiar el cam2 la posición y la rotación de la cámara para que no sea idéntica a cam1.

5. Crear un Vacío GameObject navegando al Crear menú desplegable en la parte superior del Jerarquía ver Crear | Crear
vacío). Luego, cámbiale el nombre Tablero de conmutadores.

6. Desde el Inspector ver, deshabilite el Cámara y Oyente de audio componentes de ambos cam1 y cam2. Además, establezca su Etiquetas
como Cámara principal, como se muestra:

188
 Capítulo 5

7. Desde el Proyecto ver, crear una nueva Script de C # archivo. Cambiarle el nombre CameraSwitch y
ábralo en su editor.

8. Abra su secuencia de comandos y reemplace todo con el siguiente código:

usando UnityEngine;

CameraSwitch de clase pública: MonoBehaviour {

cámaras públicas GameObject [];
atajos de cadena pública [];
public bool changeAudioListener = true; Void Update () {

if (Input.anyKeyDown) {
F o (int i = 0; i <camera.Length; i ++) {if (Input.GetKeyDown (atajos
[i]))
SwitchCamera (i);
}
}

189
Usar cámaras

void SwitchCamera (int indexToSelect) {

para (int i = 0; i <camera.Length; i ++) {
// prueba si el índice de la matriz actual coincide con la cámara para activarla

bool cameraActive = (i == indexToSelect);

cámaras [i] .GetComponent <Camera> () .enabled = cameraActive;

si (changeAudioListener)
cámaras [i] .GetComponent <AudioListener> () .enabled =
cameraActive;
}
}
}

9. Adjuntar CameraSwitch al Tablero de conmutadores GameObject.

10. Desde el Inspector vista, configure tanto el Cámaras y Atajos tamaños a 3. Luego, arrastre
y poblar el Cámaras ranuras con las cámaras de la escena (incluida la
Cámara principal, dentro de Plataforma de cámara multiusos | Pivote GameObject) Luego, escriba 1, 2, y 3 en el Atajos campos
de texto, como se muestra en la siguiente captura de pantalla:

11. Reproduzca su escena y pruebe sus cámaras presionando 1, 2, y 3 en el teclado.

190
 Capítulo 5

Cómo funciona...

El guión es muy sencillo. Primero, compara la tecla que se presiona con la lista de atajos. Si la clave está
incluida en una lista de atajos, se pasa al SwitchCamera
función, que a su vez recorre una lista de cámaras, habilita la asociada al atajo recibido, y habilita también su Oyente
de audio, en caso de que el Cambiar el oyente de audio la opción está marcada.

Hay más...

Aquí hay algunas ideas sobre cómo podría intentar cambiar un poco esta receta.

Usar una cámara de una sola función

Un enfoque diferente al problema sería mantener todas las cámaras secundarias deshabilitadas y asignar su posición
y rotación a la cámara principal a través de un script (necesitaría hacer una copia de la cámara principal y agregarla a
la lista, en caso de que quisiera guarda su
Transformar configuración).

Activar el cambio de otros eventos

Además, puede cambiar su cámara de los scripts de otros GameObjects usando una línea de código como la que se proporciona
aquí:

GameObject.Find ("Panel de control"). GetComponent ("CameraSwitch"). Cambiar cámara (1);

Ver también

F los Crear una cámara de vigilancia en el juego receta en este capítulo

Hacer texturas a partir del contenido de la pantalla

Si desea que su juego o jugador tome instantáneas del juego y las aplique como texturas, esta receta le mostrará cómo hacerlo. Esto
puede ser muy útil si planeas implementar una galería de fotos en el juego o mostrar una instantánea de un momento clave pasado al
final de un nivel (los juegos de carreras y las simulaciones de acrobacias usan mucho esta función). Para este ejemplo en particular,
tomaremos una instantánea de una región enmarcada de la pantalla y la imprimiremos en la esquina superior derecha de la pantalla.

Preparándose

Para esta receta, hemos preparado el Escena básica Paquete de Unity, que contiene una escena llamada
BasicScene. El paquete está en el 1362_05_codes carpeta.

191
Usar cámaras

Cómo hacerlo...

Para crear texturas a partir del contenido de la pantalla, siga estos pasos:

1. Importe el Escena básica paquete en un nuevo Proyecto.

2. Desde el Proyecto ver, abrir el Escena básica nivel. Esta es una escena básica con
un personaje animado y algo de geometría extra. También cuenta con un Lona para los elementos de la interfaz de usuario.

3. Crear un Imagen de interfaz de usuario GameObject del Crear menú desplegable en la parte superior del

Jerarquía ver Crear | UI | Imagen). Tenga en cuenta que se creará como un elemento secundario del Lona GameObject.
Luego, cámbiale el nombre marco.

4. Desde el Inspector ver, encontrar el Imagen (Script) componente de la marco

GameObject y set InputFieldBackground como su Imagen de origen. Este es un objeto que viene incluido
con Unity y ya está cortado para cambiar el tamaño.

5. Ahora, desde el Inspector ver, cambiar Transformar Rect a los siguientes valores:
Anclas | Min | X: 0,25, Y: 0,25; Anclas | Max | X: 0,75, Y: 0,75;
Pivot | X: 0,5, Y: 0,5; Izquierda: 0; Parte superior: 0; Pos Z: 0; Correcto: 0; Fondo: 0.

6. Desde el Imagen (Script) componente, desmarque la Centro de relleno opción, como se muestra a continuación:

7. Cree un Imagen sin procesar de la interfaz de usuario GameObject del Crear menú desplegable en la parte superior de

la Jerarquía ver Crear | UI | RawImage). Tenga en cuenta que se creará como un elemento secundario del Lona GameObject.
Luego, cámbiale el nombre Foto.

192
 Capítulo 5

8. Desde el Inspector ver, encontrar el Imagen sin procesar (secuencia de comandos) componente de la Foto

GameObject y set Ninguna como su Textura. Además, desde lo alto de la Inspector ver, deshabilite el Foto GameObject
desmarcando la casilla al lado de su nombre.

9. Ahora, desde el Inspector ver, cambiar el Transformar Rect a los siguientes valores:
Anchura: 1; Altura: 1; Anclas | Min | X: 0, Y: 1; Anclas | Max | X: 0, Y: 1; Pivot | X:
0, Y: 1; Pos X: 0; Pos Y: 0; Pos Z: 0 como se muestra en la siguiente captura de pantalla:

10. Necesitamos crear un guión. En el Proyecto ver, haga clic en el Crear Menú desplegable
y elige Secuencia de comandos de C #. Cambiarle el nombre PantallaTextura y ábralo en su editor.

11. Abra su secuencia de comandos y reemplace todo con el siguiente código:

usando UnityEngine;
usando UnityEngine.UI;
usando System.Collections;

ScreenTexture de clase pública: MonoBehaviour {

public GameObject photoGUI;
public GameObject frameGUI;
ratio de flotación pública = 0,25f;

Void Update () {
si (Input.GetKeyUp (KeyCode.Mouse0))

193
Usar cámaras

StartCoroutine (CaptureScreen ());

}

IEnumerator Captura de pantalla (){

photoGUI.S etActive (falso);
int sw = S ancho de pantalla;
int sh = S altura de la pantalla;
RectTransf orm frameTransform =
frameGUI.GetCo mponent <RectTransform> ();
Rect frami ng = frameTransform.rect;
Vector2 pi vot = frameTransform.pivot;
Vector2 o igin = frameTransform.anchorMin;
origen.x * = sw;
origen.y * = sh;
flotar xOff set = pivot.x * framing.width; = xOffset;
origin.x +
flotar yOff set = pivot.y * framing.height; = yOffset;
origen.y +
framing.x + = origen.x;
encuadre. + = origen.y;
int textWi dth = (int) framing.width;
int textHe ight = (int) framing.height;
Textura2D textura = nuevo
Texture2D (texto Ancho, altura del texto);
rendimiento retu rn new WaitForEndOfFrame ();
textura. adPixels (encuadre, 0, 0);
textura Ap capa();
photoGUI.S etActive (verdadero);
Vector3 ph otoScale = nuevo Vector3 (framing.width *
relación, encuadre . relación altura *, 1);
photoGUI.G etComponent <RectTransform> () .localScale =
photoScale;
photoGUI.G etComponent <RawImage> () .textura = textura;
}
}

12. Guarde su script y aplíquelo al Cámara principal GameObject dentro del

Plataforma de cámara multiusos | Pivote GameObject.

194
 Capítulo 5

13. En el Inspector ver, encontrar el Textura de pantalla componente y rellenar los campos
Foto GUI y GUI de marco con los GameObjects Foto y marco respectivamente:

14. Juega la escena. Podrá tomar una instantánea de la pantalla (y hacer que se muestre en la esquina superior
izquierda a un cuarto del tamaño original) haciendo clic en el botón del mouse, como se muestra en la siguiente
captura de pantalla:

Cómo funciona...

Primero, creamos un marco GUI desde el cual tomar una instantánea y un elemento GUI sobre el cual aplicar la textura. Luego,
aplicamos un script al Cámara principal para capturar el contenido de la pantalla y aplicarle una nueva textura.

El script crea una nueva textura y captura el botón izquierdo del mouse que se presiona, luego de lo cual inicia una corrutina para
calcular un área de Rect, copiar píxeles de pantalla de esa área y aplicarlos a una textura que se mostrará en el foto Elemento de la
GUI, que también cambia de tamaño para adaptarse a la textura.

195
Usar cámaras

El tamaño del Rect se calcula a partir de las dimensiones de la pantalla y del marco. Transformar Rect configuraciones,
particularmente su Pivote, Anclas, Ancho y Alto. A continuación, los píxeles de la pantalla son capturados ReadPixels () comando,
y se aplica a la textura, que luego se aplica a la Imagen sin procesar foto, que se redimensiona para alcanzar la proporción
deseada entre el tamaño de la foto y los píxeles originales.

Hay más...

Además de mostrar la textura como un elemento de la GUI, puede usarla de otras formas.

Aplicar tu textura a un material

Puede aplicar su textura al material de un objeto existente agregando una línea similar al final del Captura
GameObject.Find ("MiObjeto"). Renderer.material.mainTexture = textura;
de pantalla función.

Usando tu textura como captura de pantalla

Puede codificar su textura como un archivo de imagen PNG y guardarlo. Consulte la documentación de Unity
en esta función en http://docs.unity3d.com/Documentation/ScriptReference/ Texture2D.EncodeToPNG.html.

Ver también

F Guardar capturas de pantalla de la receta del juego en el Capítulo 10, Trabajar con los archivos y dispositivos
de recursos externos

Zoom de una cámara telescópica

En esta receta, crearemos una cámara telescópica que se acerca cada vez que se presiona el botón izquierdo del mouse. Esto
puede resultar muy útil, por ejemplo, si tenemos un francotirador en nuestro juego.

Preparándose ...

Para esta receta, hemos preparado el Escena básica Paquete de Unity, que contiene una escena llamada
BasicScene. El paquete está en el 1362_05_codes carpeta.

Cómo hacerlo...

Para crear una cámara telescópica, siga estos pasos:

1. Importe el Escena básica paquete en un nuevo Proyecto.

2. Desde el Proyecto ver, abrir el Escena básica nivel. Esta es una escena básica con una
personaje animado y algo de geometría extra.

196
 Capítulo 5

3. Importar Unity's Efectos paquete navegando a Activos | Importar paquete | Efectos.

4. Selecciona el Cámara principal GameObject dentro del Plataforma de cámara multiusos | Pivote
GameObject y aplique el Viñeta efecto de imagen (navegando a Componente | Efectos de imagen
| Cámara | Viñeta y aberración cromática).

5. Necesitamos crear un guión. En el Proyecto ver, haga clic en el Crear menú desplegable y elija Secuencia de comandos de
C #. Cambiarle el nombre Vista telescópica y ábralo en su editor.

6. Abra su script y reemplace todo con el siguiente código:

usando UnityEngine;
usando System.Collections;
utilizando UnityStandardAssets.ImageEffects;

public class TelescopicView: MonoBehaviour {

zoom flotante público = 2.0f; velocidad flotante
públicaIn = 100.0f; speedOut flotante público =
100.0f; initFov flotante privado;

flotador privado currFov;

flotador privado minFov;
flotador privado addFov;
VignetteAndChromaticAberration privado v;
flotador público vMax = 10.0f;

void Start () {
initFov = Camera.main.fieldOfView;
minFov = initFov / zoom;
v = this.GetComponent <VignetteAndChromaticAberration> () como
VignetteAndChromaticAberration;
}
Void Update () {
si (Input.GetKey (KeyCode.Mouse0))
ZoomView ();
más
Disminuir el zoom();

float currDistance = currFov - initFov; flotador totalDistance =

minFov - initFov;
float vMultiplier = currDistance / totalDistance; flotador vAmount = vMax *
vMultiplier;
vAmount = Mathf.Clamp (vAmount, 0, vMax);
v.intensity = vAmount;
}

void ZoomView () {
currFov = Camera.main.fieldOfView;

197
Usar cámaras

addFov = speedIn * Time.deltaTime;

si (Mathf.Abs (currFov - minFov) <0.5f)

currFov = minFov;
más si (currFov - addFov> = minFov)
currFov - = addFov;

Camera.main.fieldOfView = currFov;
}

void ZoomOut () {
currFov = Camera.main.fieldOfView;
addFov = speedOut * Time.deltaTime;

si (Mathf.Abs (currFov - initFov) <0.5f)

currFov = initFov;
si no (currFov + addFov <= initFov)
currFov + = addFov;

Camera.main.fieldOfView = currFov;
}
}

7. Guarde su script y aplíquelo al Cámara principal GameObject dentro del

Plataforma de cámara multiusos | Pivote GameObject.

8. Juega el nivel. Debería ver un efecto de viñeta animado además del zoom:

198
 Capítulo 5

Cómo funciona...

El efecto de zoom en realidad es causado por cambios en el valor de la Campo de visión

( FOV) propiedad; los valores pequeños dan como resultado vistas más cercanas de un área más pequeña, mientras que los valores altos aumentan

el campo de visión.

los Vista telescópica El script cambia el campo de visión de la cámara restando de él cada vez que se presiona el botón
izquierdo del mouse. También se suma al valor de FOV cuando el botón del mouse está no retenido, hasta que alcance su
valor original.

El límite de zoom del FOV se puede deducir del código minFov = initFov / zoom ;.
Esto significa que el valor mínimo del campo de visión es igual a su valor original dividido por la cantidad de zoom. Por ejemplo, si
nuestra cámara presenta, originalmente, un campo de visión de 60, y configuramos el
Zoom de vista telescópica cantidad a 2.0, el campo de visión mínimo permitido será 60/2 = 30. La diferencia se muestra en las
siguientes dos capturas de pantalla:

Hay más...

También puede agregar una variable para controlar la Desenfocar viñeta nivel del Viñeta efecto de imagen.

199
Usar cámaras

Visualización de un minimapa

En muchos juegos, una vista más amplia de la escena puede ser invaluable para la navegación y la información. Los minimapas son excelentes

para brindar a los jugadores esa perspectiva adicional que pueden necesitar cuando están en el modo de primera o tercera persona.

Preparándose ...

Para esta receta, hemos preparado el Escena básica Unity Package, que contiene una escena llamada BasicScene. También
necesitará importar tres archivos de imagen con el nombre Brújula.png,
compassMarker.png, y compassMask.png. Todos los archivos están disponibles en 1362_05_05
carpeta.

Cómo hacerlo...

Para crear un minimapa, siga estos pasos:

1. Importe el Escena básica paquete en un nuevo Proyecto. Además, importe el png

archivos. Abre el Escena básica nivel.

2. Desde el Proyecto ver, seleccione el Brújula, brújulaMarcador, y brújulaMáscara

archivos de textura. Entonces, desde el Inspector, cambiar su Tipo de textura a Sprite (2D y UI), dejándo el Modo Sprite como
Soltero y el Pivote a Centrar. Haga clic en Aplicar para confirmar los cambios, como se muestra en la siguiente captura de
pantalla:

200
 Capítulo 5

3. Desde el Jerarquía ver, crear una nueva Panel de interfaz de usuario objeto ( Crear | UI | Panel). Se creará como un elemento

secundario de la interfaz de usuario. Lona GameObject. Cambiarle el nombre MiniMap. Entonces, desde el Inspector vista, establezca

su alineación en Parte superior derecha, cambiar tanto el Anchura y

Altura a 256, y es Pos X y Pos Y campos a - 128. Además, rellene el Imagen de origen campo, dentro del Imagen componente,
con el brújulaMáscara sprite, ajustando el Color campo trayendo Alfa hasta 255, como se muestra en la siguiente
captura de pantalla:

4. Agregue un Máscara componente a MiniMap ( en el menú principal, seleccione Componente | UI |

Máscara). Entonces, desde el Inspector ver, encontrar el Máscara componente y desmarque Mostrar gráfico de máscara ( se
volverá invisible, sirviendo como una máscara para el minimapa).

201
Usar cámaras

5. Seleccione el MsLaser GameObject (que es el personaje del jugador), y, desde la parte superior de
la Inspector ver, acceder al Capa Menú desplegable. Seleccione Agregar capa… y luego nombrar un Capa de usuario Jugador, como
se muestra en la siguiente captura de pantalla:

6. Seleccione el MsLaser personaje de nuevo, y, desde el Capa Menú desplegable,

Seleccione Jugador:

7. Desde el Proyecto ver, crear una nueva Renderizar textura y nombrarlo Map_Render.
Entonces, de Inspector, cambiar su tamaño a 256 x 256.

8. Desde el Jerarquía ver, crear una nueva cámara ( Crear | Cámara) y cambiarle el nombre
MapCamera. Desde el Inspector vista, cambie sus parámetros de la siguiente manera (que se muestra en la captura de pantalla

que sigue):

?? Banderas claras: Solo profundidad

?? Máscara de sacrificio: Mezclado… ( deseleccionar Jugador)

?? Proyección: Ortográfico

?? Profundidad: 1 ( o mas alto)

?? Textura de destino: Map_Render

?? Además, desmarque la cámara Oyente de audio componente

202
 Capítulo 5

9. Desde el Jerarquía ver, haga clic derecho en MiniMap y navegar a UI | Imagen sin procesar
para crear un elemento secundario de la IU. Nombralo MapTexture. Entonces, desde el Inspector ver, rellenar el Textura campo
con el Map_Render textura y haga clic en el Establecer tamaño nativo , como se muestra en la siguiente captura de pantalla:

203
Usar cámaras

10. Ahora, haga clic derecho en MiniMap y navegar a UI | Imagen para crear otro hijo
elemento. Nombralo Brújula. Entonces, desde el Inspector ver, rellenar el Imagen de origen campo con el Brújula
imagen y haga clic en el Establecer tamaño nativo botón.

11. Una vez más, haga clic derecho en MiniMap y navegar a UI | Imagen para agregar otro
elemento hijo. Nombralo Marcador. Entonces, desde el Inspector ver, rellenar el Imagen de origen campo con el brújula
imagen y haga clic en el Establecer tamaño nativo botón.

12. Desde el Proyecto ver, crear una nueva Script de C # y nombrarlo MiniMap. Ábrelo y
reemplace todo con el siguiente código:
usando UnityEngine;
usando UnityEngine.UI;
usando System.Collections;

minimapa de clase pública: MonoBehaviour {

público Transform target;

marcador de GameObject público;
public GameObject mapGUI;
altura del flotador público = 10.0f; distancia de
flotación pública = 10.0f; public bool rotate = true;
privado Vector3 camAngle;

camPos Vector3 privados;

private Vector3 targetAngle;
targetPos Vector3 privado;
cámara de cámara privada;

void Start () {
cam = GetComponent <Cámara> (); camAngle =
transform.eulerAngles;
targetAngle = target.transform.eulerAngles;
camAngle.x = 90;
camAngle.y = targetAngle.y;
transform.eulerAngles = camAngle;
}

Void Update () {
targetPos = target.transform.position;
camPos = targetPos;

204
 Capítulo 5

camPos.y + = altura;
transform.position = camPos;
cam.orthographicSize = distancia;
Vector3 compassAngle = new Vector3 ();
compassAngle.z = target.transform.eulerAngles.y;

if (rotar) {
mapGUI.transform.eulerAngles = compassAngle;
marker.transform.eulerAngles = new Vector3 (); } más {

marker.transform.eulerAngles = -compassAngle;
}

}
}

13. Guarde el script y adjúntelo a MapCamera. Entonces, desde el Inspector ver, cambiar
los parámetros del Mini mapa componente de la siguiente manera (que se muestra en la captura de pantalla que sigue):

?? Objetivo: MsLaser

?? Marcador: Marcador ( el elemento de interfaz de usuario creado anteriormente)

?? GUI del mapa: MiniMap ( el panel de interfaz de usuario creado anteriormente)

?? Altura: 10

?? Distancia: 10

?? Girar: Comprobado

205
Usar cámaras

14. Juega la escena. Debería poder ver el funcionamiento del minimapa en la esquina superior derecha de la pantalla:

Cómo funciona...

El elemento principal del minimapa es una textura, que se utiliza como elemento de la GUI, renderizada a partir de una cámara
ortográfica que sigue al jugador desde una perspectiva de arriba hacia abajo. Se hicieron algunos ajustes necesarios para MapCamera:

F Cambiando su Proyección modo a Ortográfico ( para hacerlo bidimensional)

F Excluyendo el Jugador etiqueta de su Máscara de sacrificio ( para hacer invisible a la cámara el modelo del
personaje)

F Desactivando su Oyente de audio ( para que no entre en conflicto con la cámara principal)

El minimapa estaba adornado con un marco de brújula y un marcador que indicaba la posición del jugador. Todos estos elementos
de la GUI fueron creados por un Panel que también funcionó como un Máscara
a los elementos visuales. Finalmente, se creó un script con tres propósitos: configurar preferencias para el Cámara ( como el área
cubierta), reposicionando el Cámara en tiempo de ejecución de acuerdo con la configuración de transformación del jugador y rotando los
elementos apropiados de la interfaz de usuario.

Hay más...

Si quieres experimentar más con tu minimapa, sigue leyendo.

206
 Capítulo 5

Cubriendo un área más ancha o más estrecha

El alcance del minimapa viene dado por el Distancia parámetro. Un valor más alto dará como resultado la cobertura de un área más
amplia, ya que MiniMap La clase usa el mismo valor que el tamaño de la ventana gráfica de la cámara ortográfica.

Cambiar la orientación del mapa

El minimapa, por defecto, está configurado para rotar a medida que el jugador cambia de dirección. Si desea que sea estático,
desmarque la Girar opción para hacer el Marcador rotar en su lugar.

Adaptando tu minimapa a otros estilos

Puede modificar fácilmente esta receta para hacer una vista superior o isométrica del mapa del circuito de un juego de carreras.
Simplemente coloque la cámara manualmente y evite que siga al personaje.

Crear una cámara de vigilancia en el juego

Aunque el uso de una segunda ventana gráfica puede resultar útil en muchas situaciones, habrá ocasiones en las que necesitará generar
la imagen renderizada desde una cámara a una textura en tiempo de ejecución. Para ilustrar este punto, en esta receta haremos uso de Renderizar
textura para crear una cámara de vigilancia en el juego que transmita su video a un monitor.

Cámaras de vigilancia en el juego

Preparándose

Para esta receta, hemos preparado el Escena básica Paquete de Unity, que contiene una escena llamada
Escena básica, y también dos modelos FBX 3D para el monitor y los objetos de la cámara. El paquete está en el 1362_05_codes
carpeta, y los modelos 3D están en la 1362_05_06 carpeta.

207
Usar cámaras

Cómo hacerlo...

Para crear una visualización de imagen en imagen, simplemente siga estos pasos:

1. Importe el Escena básica paquete y el monitor y cámara modelos en tu

Proyecto Unidad.

2. Desde el Proyecto ver, abrir el Escena básica nivel. Esta es una escena básica con un personaje animado y algo
de geometría adicional.

3. Desde el Proyecto ver, colocar el monitor y cámara objects into the scene by dragging them into the Hierarchy
panel. Their Transform settings should be (shown in the following screenshot): monitor: Position: X: 0; Y: 0.09;
Z: 4. Rotation: X: 0;
Y: 180; Z: 0. camera: Position: X: - 3; Y: 0.06; Z: 4. Rotation: X: 0; Y: 90; Z: 0:

4. Create, from the Project view, a new Render Texture, and rename it screen. Then, from the Inspector view,
change its Size to 512 x 512.

5. Add a new Camera to the scene through the Create drop-down menu on top of the Hierarchy view ( Create
| Camera). Then, from the Inspector view, name it
Surveillance and make it a child of the camera GameObject. Then, change its
Transform settings to the following: Position: X: 0; Y: 2; Z: 0, and Rotation: X: 0;
Y: 0; Z: 0.

208
 Chapter 5

6. Select the Surveillance camera you have created, and, from the Inspector view,
change its Clipping Planes | Near to 0.6. Also, populate the Target Texture slot with the Render Texture screen
and disable the camera's Audio Listener component, as shown in the following screenshot:

7. From the Hierarchy view, expand the monitor object and select its screen child.
Then, from the Inspector, find its material (named Desert), and, from the Shader
drop-down menu, change itto Unlit/Texture. Finally, set the screen texture as its base texture, as
shown in the following screenshot:

8. Now it's time to add some post-processing to the texture. From the main menu, import the Effects package
( Assets | Import Package | Effects).

209
Using Cameras

9. From the Hierarchy view, select the Surveillance camera. Then, from the main
menu, add the Grayscale image effect component ( Component | Image Effects
| Color Adjustments | Grayscale). Also, add the Noise And Grain image effect ( Component | Image
Effects | Noise | Noise and Grain (Filmic)). Finally, from the Inspector view, set the Intensity
Multiplier of the Noise And Grain to 4.

10. Play your scene. You should be able to see your actions in real time on the monitor's screen, as shown
here:

How it works...

We achieved the final result by using the surveillance camera as source for the Render Texture applied to the screen.
The camera was made a child of the camera's 3D model for easier relocation. Also, its Near Clipping plane was
readjusted in order to avoid displaying parts of the camera's 3D model geometry, and its Audio Source component
was disabled so that it wouldn't clash with the main camera's component.

In addition to setting up the surveillance camera, two Image Effects were added to it: Noise And Grain and Greyscale.
Together, these effects should make Render Texture look more like a cheap monitor's screen.

Finally, our screen render texture was applied to the screen's 3D object's material (which had its shader
changed to Unlit/texture so it could be seen in low/no light conditions, like a real monitor).

210
 Chapter 6

6
Lights and Effects

In this chapter, we will cover:

f Using lights and cookie textures to simulate a cloudy day Adding a

f custom Reflection map to a scene

f Creating a laser aim with Projector and Line Renderer Reflecting

f surrounding objects with Reflection Probes

f Setting up an environment with Procedural Skybox and Directional Light Lighting a simple

f scene with Lightmaps and Light Probes

Introduction
Whether you're willing to make a better-looking game, or add interesting features, lights and effects can boost your
project and help you deliver a higher quality product. In this chapter, we will look at the creative ways of using lights
and effects, and also take a look at some of Unity's new features, such as Procedural Skyboxes, Reflection Probes,
Light Probes, and custom Reflection Sources.

Lighting is certainly an area that has received a lot of attention from Unity, which now features real-time Global
Illumination technology provided by Enlighten. This new technology provides better and more realistic results for
both real-time and baked lighting. For more information on Unity's Global Illumination system, check out its
documentation at http://docs.
unity3d.com/Manual/GIIntro.html.

The big picture

There are many ways of creating light sources in Unity. Here's a quick overview of the most common methods.

211
Lights and Effects

Lights
Lights are placed into the scene as game objects, featuring a Light component. They can function in Realtime, Baked, or
Mixed modes. Among the other properties, they can have their Range, Color, Intensity, and Shadow Type set by the
user. There are four types of lights:

f Directional Light: This is normally used to simulate the sunlight

f Spot Light: This works like a cone-shaped spot light

f Point Light: This is a bulb lamp-like, omnidirectional light

f Area Light: This baked-only light type is emitted in all directions from a rectangle-shaped
entity, allowing for a smooth, realistic shading

For an overview of the light types, check Unity's documentation at http://docs.unity3d.

com/Manual/Lighting.html.

Different types of lights

Environment Lighting
Unity's Environment Lighting is often achieved through the combination of a Skybox
material and sunlight defined by the scene's Directional Light. Such a combination creates an ambient light that is
integrated into the scene's environment, and which can be set as
Realtime or Baked into Lightmaps.

212
 Chapter 6

Emissive materials
When applied to static objects, materials featuring the Emission colors or maps will cast light over
surfaces nearby, in both real-time and baked modes, as shown in the following screenshot:

Projector
As its name suggests, a Projector can be used to simulate projected lights and shadows, basically by projecting
a material and its texture map onto the other objects.

213
Lights and Effects

Lightmaps and Light Probes

Lightmaps are basically texture maps generated from the scene's lighting information and applied to the scene's static
objects in order to avoid the use of processing-intensive real-time lighting.

Light Probes are a way of sampling the scene's illumination at specific points in order to have it applied onto dynamic
objects without the use of real-time lighting.

The Lighting window

The Lighting window, which can be found through navigating to the Window | Lighting menu, is the hub for setting
and adjusting the scene's illumination features, such as Lightmaps, Global Illumination, Fog, and much more. It's
strongly recommended that you take a look at Unity's documentation on the subject, which can be found at http://docs.unity3d.com/

Manual/GlobalIllumination.html.

214
 Chapter 6

Using lights and cookie textures to simulate a cloudy day

As it can be seen in many first-person shooters and survival horror games, lights and shadows can add a great deal of
realism to a scene, helping immensely to create the right atmosphere for the game. In this recipe, we will create a
cloudy outdoor environment using cookie textures. Cookie textures work as masks for lights. It functions by adjusting
the intensity of the light projection to the cookie texture's alpha channel. This allows for a silhouette effect (just think of
the bat-signal) or, as in this particular case, subtle variations that give a filtered quality to the lighting.

Getting ready

If you don't have access to an image editor, or prefer to skip the texture map elaboration in order to focus on
the implementation, please use the image file called cloudCookie.tga,
which is provided inside the 1362_06_01 folder.

How to do it...

To simulate a cloudy outdoor environment, follow these steps:

1. In your image editor, create a new 512 x 512 pixel image.

2. Using black as the foreground color and white as the background color, apply the Clouds filter (in
Photoshop, this is done by navigating to the Filter | Render | Clouds menu).

215
Lights and Effects

Learning about the Alpha channel is useful, but you could get the same result
without it. Skip steps 3 to 7, save your image as cloudCookie.png and, when
changing texture type in step 9, leave Alpha from Greyscale checked.

3. Select your entire image and copy it.

4. Open the Channels window (in Photoshop, this can be done by navigating to the
Window | Channels menu).

5. There should be three channels: Red, Green, and Blue. Create a new channel. This will be the Alpha channel.

6. In the Channels window, select the Alpha 1 channel and paste your image into it.

7. Save your image file as cloudCookie.PSD or TGA.

8. Import your image file to Unity and select it in the Project view.

9. From the Inspector view, change its Texture Type to Cookie and its Light Type to
Directional. Then, click on Apply, as shown:

216
 Chapter 6

10. We will need a surface to actually see the lighting effect. You can either add a plane to your scene (via
navigating to the GameObject | 3D Object | Plane menu), or create a Terrain ( menu option GameObject |
3D Object | Terrain) and edit it, if you so you wish.

11. Let's add a light to our scene. Since we want to simulate sunlight, the best option is to create a Directional
Light. You can do this through the drop-down menu named
Create | Light | Directional Light in the Hierarchy view.

12. Using the Transform component of the Inspector view, reset the light's Position to X:
0, Y: 0, Z: 0 and its Rotation to X: 90; Y: 0; Z: 0.

13. In the Cookie field, select the cloudCookie texture that you imported earlier. Change
the Cookie Size field to 80, or a value that you feel is more appropriate for the scene's dimension.
Please leave Shadow Type as No Shadows.

217
Lights and Effects

14. Now, we need a script to translate our light and, consequently, the Cookie projection.
Using the Create drop-down menu in the Project view, create a new C# Script named
MovingShadows.cs.

15. Open your script and replace everything with the following code:
using UnityEngine;
using System.Collections;

public class MovingShadows : MonoBehaviour{

public float windSpeedX;
public float windSpeedZ;
private float lightCookieSize;
private Vector3 initPos;

void Start(){
initPos = transform.position;
lightCookieSize = GetComponent<Light>().cookieSize;
}

void Update(){
Vector3 pos = transform.position; float xPos= Mathf.Abs
(pos.x); float zPos= Mathf.Abs (pos.z);

float xLimit = Mathf.Abs(initPos.x) + lightCookieSize; float zLimit = Mathf.Abs(initPos.z) +

lightCookieSize;

if (xPos >= xLimit)

pos.x = initPos.x;

if (zPos >= zLimit)

pos.z = initPos.z;

transform.position = pos;
float windX = Time.deltaTime * windSpeedX; float windZ = Time.deltaTime *
windSpeedZ; transform.Translate(windX, 0, windZ, Space.World);

}
}

16. Save your script and apply it to the Directional Light.

218
 Chapter 6

17. Select the Directional Light. In the Inspector view, change the parameters
Wind Speed X and Wind Speed Z to 20 ( you can change these values as you wish, as shown).

18. Play your scene. The shadows will be moving.

How it works...

With our script, we are telling the Directional Light to move across the X and Z axis, causing the Light Cookie texture
to be displaced as well. Also, we reset the light object to its original position whenever it traveled a distance that was
either equal to or greater than the Light Cookie Size. The light position must be reset to prevent it from traveling too
far, causing problems in real-time render and lighting. The Light Cookie Size parameter is used to ensure a smooth
transition.

The reason we are not enabling shadows is because the light angle for the X axis must be 90 degrees (or there will
be a noticeable gap when the light resets to the original position). If you want dynamic shadows in your scene, please
add a second Directional Light.

There's more...

In this recipe, we have applied a cookie texture to a Directional Light. But what if we were using the Spot or Point
Lights?

Creating Spot Light cookies

Unity documentation has an excellent tutorial on how to make the Spot Light cookies. This is great to simulate
shadows coming from projectors, windows, and so on. You can check it out
at http://docs.unity3d.com/Manual/HOWTO-LightCookie.html.

Creating Point Light Cookies

If you want to use a cookie texture with a Point Light, you'll need to change the Light Type in the Texture Importer section
of the Inspector.

219
Lights and Effects

Adding a custom Reflection map to a scene

Whereas Unity Legacy Shaders use individual Reflection Cubemaps per material, the new
Standard Shader gets its reflection from the scene's Reflection Source, as configured in the
Scene section of the Lighting window. The level of reflectiveness for each material is now given by its Metallic value or Specular
value (for materials using Specular setup). This new method can be a real time saver, allowing you to quickly assign
the same reflection map to every object in the scene. Also, as you can imagine, it helps keep the overall look of the
scene coherent and cohesive. In this recipe, we will learn how to take advantage of the Reflection Source feature.

Getting ready

For this recipe, we will prepare a Reflection Cubemap, which is basically the environment to be projected as a
reflection onto the material. It can be made from either six or, as shown in this recipe, a single image file.

To help us with this recipe, it's been provided a Unity package, containing a prefab made of a 3D object and a basic
Material (using a TIFF as Diffuse map), and also a JPG file to be used as the reflection map. All these files are inside
the 1362_06_02 folder.

How to do it...

To add Reflectiveness and Specularity to a material, follow these steps:

1. Import batteryPrefab.unitypackage to a new project. Then, select battery_

prefab object from the Assets folder, in the Project view.

2. From the Inspector view, expand the Material component and observe the asset
preview window. Thanks to the Specular map, the material already features a reflective look.
However, it looks as if it is reflecting the scene's default Skybox,
as shown:

220
 Chapter 6

3. Import the CustomReflection.jpg image file. From the Inspector view, change its
Texture Type to Cubemap, its Mapping to Latitude - Longitude Layout (Cylindrical),
and check the boxes for Glossy Reflection and Fixup Edge Seams. Finally, change its
Filter Mode to Trilinear and click on the Apply button, shown as follows:

221
Lights and Effects

4. Let's replace the Scene's Skybox with our newly created Cubemap, as the Reflection
map for our scene. In order to do this, open the Lighting window by navigating to the Window | Lighting menu.
Select the Scene section and use the drop-down menu to change the Reflection Source to Custom. Finally,
assign the newly created
CustomReflection texture as the Cubemap, shown as follows:

5. Check out for the new reflections on the battery_prefab object.

How it works...

While it is the material's specular map that allows for a reflective look, including the intensity and smoothness of the
reflection, the refection itself (that is, the image you see on the reflection) is given by the Cubemap that we have
created from the image file.

222
 Chapter 6

There's more...

Reflection Cubemaps can be achieved in many ways and have different mapping properties.

Mapping coordinates
The Cylindrical mapping that we applied was well-suited for the photograph that we used. However, depending on
how the reflection image is generated, a Cubic or Spheremap- based mapping can be more appropriate. Also, note
that the Fixup Edge Seams option will try to make the image seamless.

Sharp reflections
You might have noticed that the reflection is somewhat blurry compared to the original image; this is because we have
ticked the Glossy Reflections box. To get a sharper-looking reflection, deselect this option; in which case, you can also
leave the Filter Mode option as default (Bilinear).

Maximum size
At 512 x 512 pixels, our reflection map will probably run fine on the lower-end machines. However, if the quality of
the reflection map is not so important in your game's context, and the original image dimensions are big (say, 4096
x 4096), you might want to change the texture's Max Size at the Import Settings to a lower number.

Creating a laser aim with Projector and Line Renderer

Although using GUI elements, such as a cross-hair, is a valid way to allow players to aim, replacing (or combining) it
with a projected laser dot might be a more interesting approach. In this recipe, we will use the Projector and Line components
to implement this concept.

Getting ready

To help us with this recipe, it's been provided with a Unity package containing a sample scene featuring a character
holding a laser pointer, and also a texture map named LineTexture.
All files are inside the 1362_06_03 folder. Also, we'll make use of the Effects assets package provided by Unity (which
you should have installed when installing Unity).

223
Lights and Effects

How to do it...

To create a laser dot aim with a Projector, follow these steps:

1. Import BasicScene.unitypackage to a new project. Then, open the scene

named BasicScene. This is a basic scene, featuring a player character whose aim is controlled via mouse.

2. Import the Effects package by navigating to the Assets | Import Package | Effects
menu. If you want to import only the necessary files within the package, deselect everything in the Importing
package window by clicking on the None button, and then check the Projectors folder only. Then, click
on Import, as shown:

3. From the Inspector view, locate the ProjectorLight shader (inside the Assets
| Standard Assets | Effects | Projectors | Shaders folder). Duplicate the file and name the new
copy as ProjectorLaser.

224
 Chapter 6

4. Open ProjectorLaser. From the first line of the code, change

Shader "Projector/Light" to Shader "Projector/Laser". Then, locate
the line of code – Blend DstColor One and change it to Blend One One. Save and close the file.

The reason for editing the shader for the laser was to make it stronger by
changing its blend type to Additive. Shader programming is a complex subject,
which is beyond the scope of this book. However, if you want to learn more
about it, check out Unity's documentation on the subject, which is available at

http://docs.unity3d.com/Manual/SL-Reference.
html, and also the book called Unity Shaders and Effects Cookbook, published
by Packt.

5. Now that we have fixed the shader, we need a material. From the Project view, use the Create drop-down
menu to create a new Material. Name it LaserMaterial.
Then, select it from the Project view and, from the Inspector view, change its Shader
to Projector/Laser.

6. From the Project view, locate the Falloff texture. Open it in your image editor and, except for the first
and last columns column of pixels that should be black, paint everything white. Save the file and go
back to Unity.

7. Change the LaserMaterial' s Main Color to red (RGB: 255, 0, 0). Then, from the
texture slots, select the Light texture as Cookie and the Falloff texture as Falloff.

225
Lights and Effects

8. From the Hierarchy view, find and select the pointerPrefab object ( MsLaser |
mixamorig:Hips | mixamorig:Spine | mixamorig:Spine1 | mixamorig:Spine2 |
mixamorig:RightShoulder | mixamorig:RightArm | mixamorig:RightForeArm
| mixamorig:RightHand | pointerPrefab). Then, from the Create drop-down menu, select Create
Empty Child. Rename the new child of pointerPrefab as
LaserProjector.

9. Select the LaserProjector object. Then, from the Inspector view, click the Add Component button and
navigate to Effects | Projector. Then, from the Projector
component, set the Orthographic option as true and set Orthographic Size as 0.1.
Finally, select LaserMaterial from the Material slot.

10. Test the scene. You will be able to see the laser aim dot, as shown:

11. Now, let's create a material for the Line Renderer component that we are about to
add. From the Project view, use the Create drop-down menu to add a new Material.
Name it as Line_Mat.

12. From the Inspector view, change the shader of the Line_Mat to Particles/Additive.
Then, set its Tint Color to red (RGB: 255;0;0).

13. Import the LineTexture image file. Then, set it as the Particle Texture for the
Line_Mat, as shown:

226