WPF&Shaders: Prefacio

Con el regusto de la rica cerveza de barril aun en el paladar tras unos fabulosos dias investigando interacción en el Oktoberfest en Munich. Me he decidido a hacer una serie de Post sobre PixelShaders aplicados a WPF, veremos sus posibles utilidades en el diseño de nuestra aplicación, asi como las peculiaridades a la hora de usarlo sobre nuestra tecnologia favorita.  Explicaré en la medida de lo posible los conceptos mas importantes para pensar en pixelshader y un poco del lenguaje en el que nos toca programarlo HSLS.

Hasta entonces os dejo con un pequeño ejemplo de uso de un pixelShader muy muy sencillo. Salud!!!

image

LiveToBeerShader.rar ~ 2.5Mb
(Necesitas Framework 3.5 SP1 y una tarjeta que soporte PixelShader 2.0)

Currently rated 5.0 by 2 people

  • Currently 5/5 Stars.
  • 1
  • 2
  • 3
  • 4
  • 5

12MP: CodeName Nostromo.

12MP (12 Meses, 12 Proyectos) es una iniciativa que hace un tiempo intentamos llevar a cabo un pequeño grupo de desarrolladores. Se trata de realizar un proyecto en un fin de semana, empieza y se acaba obligatoriamente en esos escasos 3 dias. El objetivo es tener algo que funcione para el lunes, aunque por ahora la verdad es que siempre se nos ha hechado el tiempo encima.

La idea es crear algo que sea sencillo y divertido de realizar. De esta manera ya que nos pasamos todo el fin de semana programando, por lo menos lo pasamos bien, francamente bien.

Este mes se nos ha ocurrido hacer un remake del juego Volfield (o el tipico juego de recreativa de descubrir japonesas en bikini xD) Estoy seguro de que lo conoceis.

        

Decidimos que sería interesante usar alguna tecnología mas afín al mundo de los videojuegos que WPF o Silverlight, asi que decidimos embarcarnos con Microsoft XNA 3 y ademas así, podriamos jugar en la XBOX, lo cual siempre es interesante.

Yo me ocupo de el “arte” del juego, es decir, el diseño conceptual, modelos, texturas y un poco del diseño de interacción. Al tener tan poco tiempo, normalmente no sigo los pasos ordinarios de este tipo de proyectos, y modelo directamente sin hacer diseños conceptuales. Pero en esta ocasión me pareció interesante seguirlos para ver las mejoras que traia consigo.

Diseño conceptual de un videojuego en 48 horas.

En primer lugar y como es natural debemos partir de una idea, en este caso el remake de volfield pero en un espacio tridimensional esferico (por usar las 3D de XNA). Para empezar vamos con…

El paso de la Servilleta.

 2773395683_2d16e09def[1]

Este paso nos ayuda a pensar de una manera grafica, ya que podemos dibujar al tiempo que nos imaginamos la escena.  Nostromo, tendria un planeta centrado en la pantalla. Una nave extraterrestre sería nuestro personaje-jugador y nuestra misióm será limpiar un contaminado planeta tierra. Si, como en Wall·e.

Este paso nos da una idea general del juego, tanto en cuestiones de desarrollo como de arte e interacción. La nave se moverá radialmente por el planeta partiendo de los polos y podremos girar la camara a voluntad independientemente de donde este la nave. Habra 2 tipo de enemigos, los de tierra (que estarán estaticos y lanzarán cohetes si nos acercamos y los de mar, que son moviles. Para el resto mantememos la jugabilidad del juego original.

El Diseño Conceptual.

Esta es la fase más artistica de todas, donde vamos a decidir el estilo grafico del juego. Decimos los efectos de luces, estilos de modelado, texturas etc.. En resumidas cuentas diseñamos la “cara” del juego. Este es el boceto que resultó

boceto

Jugariamos con el sol y el movimiento de la camara para simular amaneceres y atardeceres. los edificios serán modelos y no simplemente texturas. El planeta debe tener una pequeña simulacion de atmosfera pero sin nubes. Encuanto a los enemigos quedamos tal que así.

malos

 

En este paso es importante no perder mucho tiempo, es decir, es un paso muy importante pero hay que tener en cuenta que todos los graficos que hagais aquí, no quedarán reflejados en el videojuego. No es importante que los dibujos sean muy buenos, lo importante es que sean descriptivos, expresivos y definan bien la idea. Si detallais demasiado o dibujais perpetivas mas artisticas que utiles, estareis perdiendo el tiempo. Lo importante del diseño conceptual es el concepto!

Modelado en 3D dimensiones.

Ahora si que vamos a empezar a trabajar. El modelado 3D debe ser lo mas parecido posible al concepto, siempre mirando eso si, la parte tecnica (poligonos, calidad de las texturas, shaders…). Si el diseñador ha hecho algo que es imposible o muy costoso de hacer (recordad que estamos en un desarrollo rapido) tendreis que hablar con él y llegar a algún punto medio.

En este Caso como la tecnología nos lo permitia, no hemos reparado demasiado en poligonos n_n.

image image image

 

Texturizado.

Las texturas, es en mi opinion mas parte mas compleja, larga e importante de todo el proceso, eso si, es muy agradecida. Este es un paso muy importante ya que es el que mas estilo va a darle a nuestro juego. Aqui si debemos ser detallistas y cuidadosos. Debemos tambien ser despiertos y habiles ya que nos va a permitir ahorrar muchos recursos si somos listos.

image

image

Que os parece? Creo que queda bastante resultón sin siquiera usar ningun Shader. Nos hemos pasado un poco el los poligonos, pero en un fin de semana tampoco vamos a ponernos a optimizar mucho! y ademas XNA podrá moverlo sin problemas en un ordenador medio. (por no hablar de la Xbox360)

Ahora solo queda dar estos modelos a los desarrolladores y que lo integren en la aplicación!

 desktop

Y bueno, nada mas por hoy. Falta el tema de Shaders pero no os preocupeis que pronto hablaremos largo y dendido sobre shaders y hasta donde podemos llegar con ellos con nuestras aplicaciones.

En breve colgamos lo que tengamos del juego!

Currently rated 5.0 by 3 people

  • Currently 5/5 Stars.
  • 1
  • 2
  • 3
  • 4
  • 5

Espantajo party 2007! WPF

El Halloween pasado (unos 2 días antes) decidimos hacer un juego de mesa que amenizara la velada y que mejor para hacerlo con vídeo y 3d con nuestro amigo el WPF?

El juego es un sencillo juego de mesa donde los jugadores deberán ir contestando una serie de preguntas y realizando unas pruebas (mas o menos macabras y frikis) para conseguir llegar al caldero mágico del centro del tablero.

Las pruebas y preguntas estan en un fichero XML desde el cual Bindeamos los datos. Toda la parte de datos esta hecha por mi buen amigo Luis Guerrero quien sufrió conmigo las 2 escasas tardes de desarrollo que pudimos sacar.

El Interfaz, una vez mas está en 3D completamente (menos las puntuaciones y demás) Uno de los efectos mas resultones es cuando una carta al azar sale del mazo y se sitúa en medio de la pantalla para que puedas leer la prueba que te ha tocado.

El dedo también esta completamente en 3D y aunque la animación con la que saca cada numero esta mas o menos predefinida, la verdad es que quedo muy bien.

image image

image

Como colofon del juego, Raul Varela y yo hicimos unos videos de presentacion (rollo atmosfear ) con los que nos reimos bastante y quedaron muy resultones!

Si, acabamos todos borrachos si. :)

Currently rated 4.5 by 2 people

  • Currently 4.5/5 Stars.
  • 1
  • 2
  • 3
  • 4
  • 5

Ftype: Juegos casuales con WPF

Hace unos meses di una conferencia en la Universidad Complutense de Madrid explicando un poco el WorkFlow habitual para realizar VideoJuegos casuales con WPF 3D

Decidí inspirarme en algún juego  ya existente en el mercado y elegí el R-type. Que en realidad no es un juego casual, ya que tiene su historia y tal. Pero creo que hoy en día prácticamente puede considerarse casual.

Todo el proyecto esta realizado en un solo día por un servidor, así que no es precisamente un ejemplo de orden :) pero creo que ilustra muy bien la potencia que tiene la plataforma a la hora realizar este tipo de proyectos.

Los gráficos del juego están modelados con 3D Studio Max y son de poligonización media, las texturas llevan la luz incrustada para darle mayor realismo.

screenimage  image  image

Aquí os dejo el Proyecto por si queréis consultarlo. Todos los modelos están realizados por mi así que podéis usarlo como os plazca!


image

   Ftype WPF Project. 10Mb Aprox.

Currently rated 5.0 by 1 people

  • Currently 5/5 Stars.
  • 1
  • 2
  • 3
  • 4
  • 5