Share
La actualización 4.3 de Unity fue una gran puerta abierta para los desarrolladores de juegos en 2D, con muchas herramientas nuevas y formas de enfocar el desarrollo de juegos en 2D en este ya poderoso motor. En este tutorial, te mostraré cómo crear un personaje en Inkscape que se puede usar en el asombroso nuevo editor de Unity 4.3.
Algunos consejos sobre la creación del personaje del juego antes de comenzar:
Abre Inkscape y selecciona Archivo> Nuevo . De la lista de opciones disponibles, seleccione el tamaño que probablemente sea la resolución de su juego. 640 x 480, 800 x 600, o 1024 x 768 Son resoluciones comunes de juegos para PC, para este proyecto elegiré 800 x 600.
Crea una nueva capa seleccionando Capa> Agregar capa (Mayús-Control-N) y el nombre es "Sketch". Configurarlo para Debajo de la capa actual.
Reúna sus conceptos. En este caso acabo de usar un simple boceto que creé en Sketchbook Pro. Tiendo a crear al menos dos vistas de acción del personaje para poder tener una buena idea de cómo quiero que sea animado y qué piezas necesito para dividirlo en.
Simplemente puede copiar y pegar su concepto desde otro programa o arrastrar y soltar el archivo en Inkscape.
Si arrastra y suelta el archivo seleccione empotrar, no enlazar. De todos modos, ya estarás tirando el boceto ya que no es necesario para todo el proceso..
Los bocetos conceptuales ayudan a consolidar tu idea para que no trabajes a ciegas. Cambie el tamaño de su dibujo al tamaño que le resulte cómodo trabajando con las manijas de tamaño.
Haga clic en el croquis y bloquear las proporciones de la imagen haciendo clic en el Icono de bloqueo.
Bloquear las proporciones evita la distorsión.. Como las paletas de Inkscape Preset generalmente no son muy bonitas para los juegos, tiendo a hacer las mías de antemano.
Puede editar su paleta de Inkscape yendo a su carpeta de Inkscape debajo de Compartir> Paletas subcarpeta.
El archivo puede estar en una ubicación diferente dependiendo de su sistema operativo. Botón derecho del ratón "Inkscape.gpl" y seleccione abrir con su editor de texto favorito. Acabo de usar Wordpad.
Ahora puede agregar su propio RGB y Maleficio Valores a la lista y aparecerán en el orden en que los pones. Si no está familiarizado con los códigos Hex y RGB, hay muchos gráficos de fácil acceso que puede encontrar en Internet o en el selector de color de casi cualquier programa de edición de imágenes..
Puedes encontrar uno de ellos aquí:
Aquí están los rangos que usé para las diferentes partes del cuerpo del Pulpo para aquellos de ustedes que les gusta coleccionar paletas:
Cuerpo principal
Accentsconagua
# 6E0454 # A4005C # BC1878 # DC4470 # EB636D # F39383 # FAC9AC Los ojos
# 392131 Caparazón de caracol
# 343059 # 43467E # 3E5796 # 5A69C0 # 6796E8 # 7EAFEE # 7EC7D9 Cuerpo de caracol
# 84473C # A5674F # CE894E # F3B46B # F9CE64 # F9E57A # FBFB9E Puede copiar y pegar estos códigos en su archivo .gpl y guardarlos, y estarán allí la próxima vez que ejecute Inkscape.
Te recomiendo que guardes una copia de tu archivo .gpl original en caso de que algo salga mal..
Agregue los códigos como se muestran en el archivo. Puede colocarlos en el orden en el que desea que aparezcan.. Dibuja el cuerpo principal primero. Solo estoy usando una forma de círculo simple para el cuerpo del pulpo. Puse el trazo a 3.5px en el editor de objetos (Shift-Control-F) Pero puedes hacer el tuyo como quieras..
Dibuja las piernas todas como piezas separadas en una nueva capa usando el Herramienta de curva Bezier (Shift-F6).
Recuerde, para obtener una curva real, debe mantener presionado el botón del mouse después de hacer clic para colocar el segundo nodo / punto y arrastrarlo. En lugar de ajustar manualmente el trazo y el color en la pierna, podemos hacer clic en un objeto que es similar (como el círculo) y copiarlo (Control-C) E ir a Editar> Pegar estilo o (Control-Shift-V) para que coincida con el estilo del objeto copiado.
Esta es una buena manera de asegurarse de que todos los objetos rellenos y los trazos sean uniformes. También es posible que desee dibujar patas en diferentes posiciones, para que puedan reutilizarse para crear más animaciones..
Alternativamente, puede dibujar todo el cuerpo con las piernas en diferentes posiciones si no desea que todas las piernas se muevan de manera independiente..
Recuerda que puedes unir piezas seleccionando ambos objetos y combinándolos a través de Camino> Unión o Control-Shift-+ o solo Controlar-+ con el teclado numérico.
Para obtener una curva más suave, a menudo agrego puntos adicionales y luego los elimino después de obtener la forma que quiero..
Apago el Cuerpo capa utilizando el icono de ojo al lado del nombre de la capa que quiero desactivar.
Entrar en Editar ruta por nodos modo (F2) y haga clic en el nodo que desea eliminar, luego pulse el botón Eliminar clave.
Puede ajustar usando los controles de los otros nodos si algo sale mal, o cambiando el tipo de nodo en la barra de herramientas. Como quiero que las patas de los lados izquierdo y derecho sean casi iguales, copiaré la izquierda y la editaré ligeramente..
Traer de vuelta el Cuerpo capa moviendo a la capa en el menú desplegable y haciendo clic en el icono de ojo Una vez más, para que pueda colocar la pierna correctamente. Seleccione la pierna (que lo llevará de vuelta a la capa de la pierna automáticamente) y cópielo (Control-C) luego pégalo (Control-V).
Voltear la imagen usando el Flip horizontal botón o presionando el H llave.
Esto también hará que el pulpo sea más fácil de animar..
Mueva la pierna a la posición deseada. También lo he aplastado horizontalmente ligeramente para la perspectiva, usando las manijas de tamaño.
Si tiene problemas con el ajuste de la imagen cuando la está dimensionando, vaya a Ver> Ajustar. Voy a hacer las patas delanteras en varias piezas para agregar más profundidad. Hacer una nueva capa (Shift-Control-N) Añadir las piernas que estarán delante del cuerpo..
Agrega un óvalo con el Herramienta ovalada y copia y pega el estilo de las piernas en el óvalo.
Podremos agregar un movimiento de balanceo al tentáculo delantero de esta manera si queremos. Ahora agregue un segundo óvalo y gírelo. Puede rotar objetos haciendo clic dos veces en el objeto y luego usando los controles.
Ahora esta parte del tentáculo puede moverse por separado.! Ahora puedes simplemente copiar la pierna y voltearla para completar la otra pierna
No te preocupes demasiado por la posición del tentáculo por ahora, se ajustará en Unidad. Agreguemos algo de sombreado y resaltes al pulpo antes de pasar a la cara. Lo hago creando óvalos y luego usando otro óvalo para "restar" las partes que no quiero.
Coloca el resalte donde quieras. Ahora copie y pegue el círculo y ajústelo a donde desee cortar. Haz que sea de un color diferente para que sea más fácil de ver. Prefiero hacerlo del mismo color que el cuerpo principal..
Encuentro este método mejor para globos y otros objetos redondos y brillantes.. Ahora Shift-Select Ambos círculos, asegurándose de seleccionar el último círculo resaltado, y vaya a Ruta> Diferencia.
Un buen toque suave! Seleccionar todos los objetos y Grupo ellos (Control-G) para asegurarse de que no se muevan de donde los quieres.
Nota: Aún puede copiar y pegar el estilo de un objeto utilizando la selección directa / edición por ruta incluso cuando están agrupados.
Dibuja también algunos puntos destacados en las piernas, usando el Herramienta Bezier (Shift-F6). Asegúrese de que está dibujando en la capa con el tentáculo apropiado y agrúpelos con su pieza relacionada cuando haya terminado. Intenta usar el mismo color del resaltado anterior..
Puedes añadir menos o más puntos a tu gusto.. Dibujé los ojos usando el Herramienta Círculo (F5). Aquí hago lo mismo que hice con los tentáculos para asegurarme de que eran iguales; Copie y pegue el ojo izquierdo y ajústelo de nuevo en posición y perspectiva..
Ahora tiene un conjunto simple de mirones.. Dibuja una boca simple con la Herramienta de curva Bezier, y ajustar la configuración en el menú de trazo y relleno (Shift-Control-F).
Puedes jugar con estas configuraciones para obtenerlas como te gustaría.. Decidí agregar algunos puntos destacados para darle un poco más de profundidad. Si más adelante, cuando agrega cosas nuevas, aparece sobre los objetos anteriores cuando los reagrupa, seleccione y corte el objeto que está detrás. (Control-X), haga clic en el objeto sobre el que desea pegarlo que está en la misma capa y seleccione Editar> Pegar en su lugar o (Control-Alt-V).
Mantener tus grupos limpios te ayudará a organizar tu hoja de sprites más tarde. También he añadido un punto culminante secundario, otra vez usando Curvas de bezier y el Herramienta de circulo, solo que esta vez estoy usando el # F39383 color.
Si bien hay algunos programas prometedores que permiten agregar fácilmente la iluminación dinámica al arte en 2D (como Sprite Lamp), aún son muy rudimentarios y en su mayoría están diseñados para pixel art, por lo que tendremos que agregarlos nosotros mismos por ahora.!
Para un punto de interés, también estoy agregando un caracol en la parte superior de la cabeza del pulpo. Haré el cuerpo primero con el Herramienta de curva Bezier (Shift-F6). Haré el caracol en una nueva capa, pero no necesito hacer uno también para la concha siempre y cuando estén agrupados correctamente. Puedes hacerlas en capas separadas si prefieres.
Como antes, eliminaré todos los nodos innecesarios y suavizaré el cuerpo con el Editar ruta por nodo (F2) modo. También puede seleccionar varios nodos y moverlos en este modo..
Ahora agregue algunos tonos más claros para resaltar el volumen del caracol. Una vez más voy a utilizar el Curva de Bezier herramienta (Shift-F6).
Si encuentra que cuando está haciendo una curva, la ha hecho demasiado empinada y no puede conectarla sin que esto suceda:
Usted puede botón derecho del ratón para salir de la curva, y luego reconectarla manualmente.
Para hacer la base de la concha, dibuja un círculo con la Herramienta Círculo (F5). solía # 5A69C0 como el trazo y # 7EC7D9F como el relleno.
Utilizar el Curva de Bezier herramienta (Shift-F6) para crear el "borde" inferior de la cáscara.
Utilizar el Herramienta espiral para agregar la forma adecuada a la cáscara (F9) y establecer el vueltas a 1.50.
Ahora rota y coloca la espiral para que se vea como una concha real. También puse la tapa para la espiral a Tapa redonda para evitar un borde áspero.
Para el punto culminante de la concha de caracol, volveremos a utilizar la curva bezier. Solo usaré blanco para el color, pero estableceré la forma en 50% Opacidad para que se funda. Puedes ajustar la opacidad en el Menú Rellenar y Trazar (Mayús-Control-F).
Continuar con el resto de los aspectos más destacados. Puede copiar y pegar el estilo del primer resaltado a los otros resaltados y también copiará y pegará la opacidad, lo que lo hace mucho más fácil.
Vale la pena señalar que hice la concha y el cuerpo del caracol grupos separados. Los guardaré por separado en caso de que quiera animarlos más tarde.
Primero vamos a eliminar el boceto para sacarlo del camino. Haga clic en el "boceto" y presione el Eliminar clave. Asegúrese de desbloquear la capa antes de intentar eliminarla o no podrá hacerlo. También puede eliminar la capa real de la Menú de capas. Solo asegúrese de que la capa que desea eliminar esté activa en el momento en que la elimine.
Asegúrese de guardar su archivo antes de hacer la siguiente parte (aunque vale la pena señalar que debería guardar con frecuencia de todos modos, por si acaso). Para hacer esto, ve a Archivo> Guardar como (Shift-Control-S).
Ahora necesita separar las piezas del pulpo para que estén lo suficientemente separadas para que la herramienta de corte en Unity pueda recoger que son piezas separadas. Hay configuraciones que puedes modificar en Unity para ayudar con esto, pero una hoja de sprite organizada siempre es mejor.
Esta será una buena prueba de tus habilidades de agrupación. Si agrupaste todas las piezas correctas, esto debería ser relativamente fácil. Puede aprender más sobre Agrupar en Inkscape gracias a un útil tutorial creado aquí en Tuts+. Haga clic y arrastre Cada pieza para ordenarlas como quieras..
También alineo los bordes de los objetos en el exterior de la hoja. Si bien las computadoras son tan rápidas ahora, es posible que no lo note demasiado, siempre es mejor ahorrar el espacio que pueda y hacer que la hoja sea lo más pequeña posible. Abre tu Alinear menú (Shift-Control-A) y asegúrate Relativo a se establece en el Último seleccionado en lugar de la página, ya que los objetos serán lo que se exportará y no la página.
Esto significa que el primer objeto y todos los objetos seleccionados subsiguientes se alinearán según la posición del último objeto colocado.
La alineación no tiene que ser perfecta. Aquí solo estás tratando de reducir el espacio en blanco tanto como sea posible, y la alineación es una forma fácil de hacerlo. Lo principal es asegurarse de que un objeto no va a expandir la hoja más de lo necesario..
Embale la hoja lo más apretadamente posible. Hay programas para hacer esto, pero a muchos les resulta más fácil solo mirarlo en Inkscape.
Sin embargo, si prefiere usar una (o ya ha exportado cada imagen por separado para usarlas en otros motores de juegos), puede descargar Texture Packer aquí:
Está disponible para Mac, Windows y Linux de forma gratuita.!
Guarde la hoja como un archivo separado, de nuevo para que tenga la composición original (también puede guardarlos en el mismo archivo si lo desea).
Notará que los ojos parecen innecesariamente separados para el empaque de texturas. Esto se debe a que he optado por tratarlos como un solo objeto en lugar de que cada ojo funcione de manera independiente. Puedes hacer esto y luego dividirlos en unidad como ojos separados.
Seleccione todos los objetos a la vez haciendo clic y arrastrando sobre toda el área como si estuviera tratando de contenerlos todos en un cuadro (vea la imagen a continuación).
Ahora para exportar tu hoja! Seleccionar Archivo> Exportar (Shift-Control-E). Puede exportar la hoja como un tamaño que se adapte a sus necesidades, pero la he mantenido casi al mismo tamaño que comencé en Inkscape.
Puede editar el nombre de archivo en el cuadro de nombre de archivo para que sea algo reconocible. De lo contrario, será nombrado por Inkscape como el última ruta o grupo que fue seleccionado (p.ej. g720.png).
Usted puede notar la Lote de objetos de exportación opción. De hecho, puede exportar todo como su propio archivo de esta manera, pero tenga en cuenta que la forma en que se encuentra en Inkscape será su tamaño exportado, por lo que es posible que tenga que ajustarlo manualmente..
Nota: Actualmente hay un error en Inkscape. Si nombra el archivo cuando todos los objetos están seleccionados, e intenta exportar por lotes, solo exportará el último objeto, ya que ahora todos tienen el mismo nombre..
Si mira el archivo exportado ahora, debería ver la hoja con la transparencia.
Para esta parte del tutorial, voy a asumir que sabes cómo abrir Unity y comenzar un proyecto. Si no está familiarizado con Unity, hay mucha documentación para principiantes en el sitio web de Unity. Solo voy a explicar el proceso de obtener una hoja de sprite en Unity y cortarla para usarla en un juego..
Abra su proyecto y asegúrese de que su editor esté en modo 2D (para facilitar las cosas) yendo a Edición> Configuración del proyecto> Editor y seleccionando 2D como el Modo de comportamiento predeterminado.
Arrastra la hoja de sprites desde tu Explorador de archivos en tu Bienes carpeta.
Seleccione la hoja de sprites y abra el Inspector a través de Ventana> Inspector (Control-3).
Cambiar el Modo Sprite a Múltiple. Esto te permitirá abrir el editor de sprites..
Color verdadero es una buena opción para el Formato ya que es mejor para imágenes bonitas y limpias, especialmente cuando se trata de sprites de pixel art. Sus otros ajustes pueden depender del proyecto individual.
Abre el Editor de Sprite.
También puedes acceder desde el Inspector. Hacer clic Rebanada. Normalmente solo elegiría Automático y dejarlo como está, sin embargo, no puedo hacer eso en este caso, ya que dividiría los ojos en dos partes, así:
Para solucionar este problema, haga clic en uno de los cuadros delimitadores y Borrar eso. Ahora estire el otro cuadro delimitador para incluir ambos ojos y haga clic. Aplicar.
Si pierde una caja o necesita hacer una nueva ya que no las cortó correctamente, clic y arrastre en un espacio vacío.
Hacer clic Revertir para deshacer cualquier cambio que no haya aplicado. También puede notar que la casilla en la parte inferior derecha tiene un lugar para nombrar cada pieza. Esto es muy importante para la organización, ya que si arrastra cualquiera de los sprites a la pantalla, serán nombrados automáticamente como sea que Nombre el cuadro indica. Otro parámetro que puedes ajustar aquí es Pivote lo que indica el punto de anclaje principal del sprite. Cuando gire el sprite en el animador, girará alrededor de este punto.
Ajusta todos los pivotes a donde quieras haciendo clic y arrastrando el círculo en el medio de cada sprite, o escribiéndolos manualmente en la Campo de pivote.
Hacer clic Aplicar cuando termine. Ahora puedes ver todos tus sprites como objetos individuales en el Proyecto> Carpeta de Activos.
Ahora podemos arrastrar las piezas a la escena para crearlas. Objetos de juego. Sin embargo, primero vamos a crear un vacío Objeto de juego (Control-Shift-N) y llamarlo "pulpo".
Haga clic en el Objeto de juego en el Jerarquía e ir a la Inspector renombrarlo.
Ahora puedes arrastrar las otras partes del cuerpo hacia el pulpo. Objeto de juego en el Jerarquía y ordénelos como desee, pero asegúrese de que estén centrados sobre el vacío Objeto de juego.
Hay un pequeño problema ... Entonces, como habrás notado, los tentáculos del pulpo no están del todo en el orden en que los queremos. Podemos arreglar esto con Clasificación de capas en el Inspector. Normalmente podría crear una nueva capa de clasificación para el Octopus, pero por ahora lo dejaré por defecto y ajustaré los números..
Cuanto mayor sea el número, más cerca estará el objeto de la cámara.. Ahora vamos a guardar una escena de prueba y el proyecto (Archivo> Guardar escena). Unity puede fallar cuando comienza a realizar acciones más profundas, por lo que recomiendo guardar a menudo.
Ya que no estoy haciendo un proyecto de juego real, solo nombraré este "testscene" por ahora. Este personaje aún no tiene animaciones, por lo que no está "listo para jugar". El animador en Unity es extraordinariamente poderoso, pero hay una pequeña curva de aprendizaje.!
Es bueno para los artistas saber cómo se verá su arte en el motor y cómo pueden animarse para ayudar a que los gráficos sean más adecuados para el desarrollo de juegos. Vale la pena señalar que incluso después de haber llegado a este punto, puede actualizar fácilmente su hoja y volver a colocarla en la carpeta de activos (la unidad de forma predeterminada a su carpeta de proyecto en "Documentos") y el juego se actualizará automáticamente. Tenga en cuenta que si cambia los tamaños del sprite de alguna manera, incluso agregando "extras" es posible que tenga que volver a cortar la hoja..
