[Tutorial] para la creacion de temas animados (dinamicos) para PS3

Como bien dice el titulo este tutorial es para crear temas animados/dinamicos usando videos o programas de modelado 3D en la creacion de un tema para PS3. Este tutorial se dividira en dos ya que primero se explicara el metodo de crear temas animados utilizando videos cortos y el otro metodo que se explicara sera creando temas animados desde cero utilizando programas de animacion en 3d como lo son 3dmax, maya, blender u otro que soporte exportar en DAE. Por el momento el tutorial para crearlos con videos esta terminado el segundo metodo aun no lo he explicado.

Como modo de aclaracion quiero decir que estos metodos no hacen uso de la antigua forma de crearlos utilizando el "Dynamic Theme Creator" que lograba crear los temas dinamicos modificando 5 variantes ya existentes. Con estos metodos se crean totalmente diferente y no se utiliza de base ningun tema dinamico en particular.

Sabiendo esto vamos con el primer metodo como hacerlos con videos :

Primero para esto dejare un video tutorial para que tengan como referencia : http://www.youtube.com/watch?v=urQLONrgbU4 y recordando que las herrameintas necesarias estan en la descripcion de el video. El video se encuentra en ingles pero con este tutorial es facil de seguir y lo traigo como complemento al tutorial.

Para este tutorial necesitas :

1-Photoshop para manipular las imagenes y videos.
2- NVIDIA DDS pluggins para Photoshop para guardar tus bgs en formato dds (DXT1 RGB 4 bpp | no alpha)
3-Notepad ++ para editar los archivos .xml y .js http://notepad-plus-plus.org/download/v5.9.3.html
4- Y los exes y archivos para compilar el raf necesario para crear el anim_1 o animacion del tema y entre estos debes tener ademas el p3tcompiler necesario para compilar el tema.

Comencemos :

1.Lo primero es que debes de tener el video que deceas de fondo ya descargado o creado en un formato que sea soportado por photoshop por ejemplo MPG o MP4. Yo uso MP4 y lo trato de descargar en la major calidad de imagen possible ya sea 1080p (1920x1080) luego lo reduces a la resolucion soportada deacuerdo al numero de fotogramas que se usara en en la creacion. Una vez tienes el video procedes a abrir el mismo en photoshop para que importes y obtengas las imagenes necesarias para crear el anim_1.jpg que sera el archivo que contiene la animacion del tema.
Se debe seleccionar un maximo de imagenes en la animacion yo recomiendo usar 34 fotogramas. La verdad es que pueden usar mas imagenes hasta 102 fotogramas pero se tiene un problema y es que perdera resolucion(calidad de imagen) para poder usarse con ese numero de fotogramas. Por ejemplo : Si usas 34 fotogramas deberas usar una resolucion por imagen de 1280 x 720, Si usas 102 fotogramas deberas usar una resolucion 640 x 480. Si por el contrario quieres usar una resolucion en alta definicion 1920 x 1080 solo podras usar 15 fotogramas y no mas de ahi pues hay una limitacion en la cantidad de imagenes que se soporta para la compilacion final. Para seleccionar o separar las imagenes del video entra a photoshop y presiona en : Archivo---importar---cuadros de video a capas---y los guardas a .psd or jpg. En mi caso yo los paso a JPG ya que el proceso de animacion lo hago manualmente como si estubiera creando una animacion GIF. Tambien puedes utilizar el sistema de automatizado en photoshop para hacerlo de forma mas rapida y sin tener que ir editando una por una. Para est vaya a la pestaña de la ventana a continuación, haga "click" en Acciones. Crear un conjunto de acciones y creas una nueva y lo llaman "DDS" luego le das a salvar a continuación ya creada una accion de automatizado. Luego ejecutas la accion de modo que comience a grabar lo que haces en el Photoshop para que esta se quede en memoria y puedas utilizarlo siempre que conviertas tus JPS en DDS en lote.
Guardar la capa 1 en el escritorio como un dds con estos ajustes : (DXT1 RGB 4 bpp no alpha no mips maps)

Al haber guardado la primera, haga click en "detener" para detener la grabación. A continuación, elimine la capa 1 que ha salvado en el escritorio pues no la necesitas y el proposito de hacer esto era de crear un arranque automatizado (Usted no va a tener que hacer esto cada vez que quiera convertir sus imagenes JPG a DDS). Recuerde que esto se hace para no tener que ir editando fotograma por fotograma o imagen JPG convirtiendolas en DDS. Asi que se recomienda que se cree un sistema de automatizado para facilitar el proceso.

2.Una vez ya tienes las imagenes en su destino o directorio separadas del video debes ir abriendo los bg.dds (estos se encuentran en los archivos de descarga) desde Photoshop uno por uno e ir sustituyendo o incertando en los dds las imagines jpg que sacaste del video una por una. Y guardar las imagenes en un formato especifico y para esto es que necesitas los NVIDIA plugins ya instalados en tu photoshop. So le das a guardar como : (3DD/DDs(DDS.DDS) luego de seleccionar esa opcion saltara una ventana con el logo de NVIDIA en esa ventana deberas de guardar la imagen dds con estas opciones : (DXT1 RGB 4 bpp no alpha no mips maps) cada imagen debe de guardarse con nombre de “bg01 hasta el bg34”.



***Si creaste tu sistema automatizado de DDS, lo que haras sera utilizar la automatización que acabamos de crear y para ello van a la pestaña archivo y haga "click" a continuación en automatizar por lote y de esa ventana que se habre escojes la opcion que has creado de DDS y el directorio donde se encuentran tus fotogramas en JPG y en la otra casilla el destino final de la conversion de estas en DDS y en vez de ir editando una a una lo haces automatico con este*** ...

3. Ahora luego que ya tienes todas las imagenes que componenen la secuencia de la animacion convertidas a “dds” deberas deacuerdo al numero de imagenes que usas editar el .xml y .js deacuerdo al numero de fotogramas que usaras en el tema. En este caso en particular el mustache.xml y el mustache.js seran usados para un numero de 34 fotogramas. Para la edicion de estos archivos utiliza el Notepad ++ y editalos deacuerdo al numero de fotogramas a usar. Aqui te dejo una imagen de como se deberia editar ambos archivos :



4. Luego de haber creado los dds y tener el .xml y .js editados para la creacion del .raf que no es mas que el anim_1 deberas de colocarlos tanto los dds creados como los archivos .xml y .js en una carpeta o directorio con un nombre sin espacios entre medio del nombre del directorio y colocarlo en el escritorio o bien en la raiz del disco en este caso C: para que los programas se puedan ejecutar con normalidad. Ejemplo : deberas colocarlos en C:/escritorio/temaanimado/ aqui colocas todos los archivos incluyendo la carpeta descargada con todos los exes que te descargaste previamente como lo son :

1. raf_anim.exe
2. raf_compiler.exe
3. raf_compiler.inf
4. raf_geom.exe
5. raf_pack.exe
6. raf_script.exe
7. dds2gtf.exe
8.Y otros archivos que la carpeta tiene

Esto para poder crear el raf (anim_1) con el raf_compiler.exe
Ejemplo : C:/escritorio/temaanimado/colocas todos los archivos aqui.

5.Luego tan simple como arrastrar y lanzar el mustache.xml que ya habias modificado deacuerdo al numero de fotogramas a usar hacia el raf_compiler.exe para que este te cree el raf final o la animacion deacuerdo a la secuencia de imagenes que tienes hecho. Luego que termine el proceso se creara un archivo en la misma carpeta llamado mustache.raf este es el anim_1 y por lo tanto deberas de renombrarlo a “anim_1.jpg” . Cuando lo renombres saltara una ventana con un mensaje solo dile que si que lo renombre. Y ya tendras tu anim_1 creado y listo a usar en tu tema.

6.Ahora debes crear otro directorio en donde debes tener todos los iconos, imagenes PNG,XML y archivos necesarios pero esta vez para crear tu .p3t final o lo que sera tu tema final con su anim_1 (animacion) incorporado que ya habias creado previamente en los pasos anteriores. Debes ahora abrir el notepad ++ otra vez pero esta vez para editar el .xml del tema a usar. Ojo este .xml no es mustache.xml que usaste en la creacion del anim_1 este debe ser un .xml para crear el tema de esos que encuentras en un set de iconos de un tema que por ejemplo ya has extraido para usar. Solo lo habres con el notepad ++ y te vas a la ultima linea para que coloques tu informacion ahi. Entiendase el nombre del autor del tema, nombre del tema, etc. Para que no te lies usa este .xml que te dejo para compilar el .p3t de aqui : http://www.mediafire.com/?32r8pvbisqjvp3f solo lo colocas en el directorio que has creado con tus iconos para el tema y claro lo editas con tu informacion en la ultima linea.

7. Finalmente cuando ya tengas todos tus archivos en ese nuevo directorio que creaste con tu .xml ya editado con tu informacion sera tan facil como arrastrar y lanzar el .xml del .p3t al p3tcompiler.exe que se encuentra en los archivos que descargaste para crear tu anim_1. Para que el p3tcompiler te trabaje o funcione debes de añadir una carpeta que falta y que quien subio los archivos originales en este caso no añadio. Solo descarga de aqui : http://www.mediafire.com/?h7zsnjvt05v7scw esa carpeta y la colocas en el directorio donde se encuentran los .exes y el p3tcompiler.exe. Y ahora sin problemas al arrastrar y lanzar el .xml sobre el p3tcompiler te comenzara a crear el tema. Si el p3tcompiler.exe te da problamas de error al crear usualmente es que te falta un archivo o varios necesarios para la creacion de este entiendase falte algun icono y solo con colocar el archivo que falte al directorio continuara la compilacion. Exito en tu creacion y espero ver pronto tus obras de arte en cuanto a temas de PS3.

Recuerdo que los exes necesarios los pueden descargar desde el enlace que deje en la descripcion del video tutorial en ingles que deje al comienzo.

Pronto tratare de añadir algo mas a este tutorial referente a hacerlos de otra forma en cuanto a la animacion se trata para hacerlos con mejor calidad de la alcanzada hoy dia. Pero estoy esperando a que quien lo descubre saque su tutorial el cual segun dice hara pronto. Aqui un video a lo que me refiero :

http://www.youtube.com/user/1GlowBall?f ... de hecho les recomiendo ese tema esta muy buen elaborado y la descarga la encuentran en la descripcion del video.

Saludos !

Edito : Con la salida del OFW 4.0 la cantidad que soporta la PS3 de fotogramas que pueden ser usados cambio de 102 a 87 con resolucion de 640x480 cada imagen bg.dds.

Datos Adicionales :

Otro enlace a otro video tutorial creado por RADZ eso si esta en ingles pero pienzo que puede ayudar por eso lo dejo : http://www.youtube.com/watch?feature=pl ... cWnHXyv_4U

Editar iconos facilmente con automatizado : http://www.youtube.com/watch?v=GGFPbXvA ... r_embedded

Fin del primer metodo.

-------------------------------------------------------------------------------------------

Segundo metodo para hacerlos utilizando programas de modelado 3d y crealos desde cero utilizando nuestras propias animaciones.

Pronto espero incluir un segundo metodo de crear temas dinamicos desde cero y modelando nuestra propia animacion mediante "bones" pero amablemente nuestro amigo "boticario" a querido incluir entre los comentarios algunos tips para entender como lograrlo. A quien le interese puede buscar entre los comentarios esta informacion para que tenga idea por donde anda esto en lo que me organizo saco tiempo y traigo un tutorial de como hacerlo desde cero modelando una animacion sencilla pero que bastara para quienes interesen tengan una idea y partir de ella creen sus propias animaciones. : ) De ante mano les digo quien conosca del modelado 3d con programas como blender, maya, 3dmax u otro esto se le hara mucho mas facil.

Gracias boticario por traer tu conocimiento al hilo.

Pronto espero comenzar con esta segunda parte de este hilo

------------------------------------------------------------------------------------------
Comenzada la segunda etapa o segundo tutorial para la creacion de temas usando programas 3D, no esta terminado aun pues le falta la explicacion de la creacion del .js y el compilado final pero segun pueda lo ire terminando pero no obstante pueden ir hechandole un ojo en lo que lo termino.


Informacion Relacionada :

En primer lugar, para no perderse en el camino, aquí hay un glosario de diferentes términos que se estaran haciendo mencion aquí de manera que se entienda con que se trabaja dejare esto primero :

DDS : la abreviatura de Direct Draw Surface , es una imagen que contiene las texturas 3D. Para convertir DDS a GTF se utiliza el DDS2GTF.exe ;
GTF : Igual que el anterior, es una imagen que contiene las texturas 3D, pero en un formato diferente al anterior. Para convertir GTF a DDS se utiliza el GTF2DDS.exe ;
RAF : abreviatura de Formato Aspecto Rich es el formato de la animación soportado en la consola lo que en el tema se conoce renombrado anim_1.jpg;
P3T : formato de tema para PlayStation 3 instalable desde el XMB ;
XML : es un lenguaje de marcado, vamos a utilizar XML para importar nuestros productos o mas bien sera el que contiene nuestras instrucciones y ruta para dar orden para la creacion del tema ya sea el RAF o P3T final;
JS : diminutivo de JavaScript , este archivo se utilizará para almacenar la informacion de la animación de nuestros objetos que es necesaria para la creacion del RAF o paquete de animacion;
DAE : formato universal para la exportación de modelos 3D en los programas 3D ;
Ejemplo de programas que puedes utilizar para exportar tu DAE : Blender / 3dsmax / Maya.
Ahora que conoces de los diferentes términos, se puede ir a la parte que se decea como crear nuestro tema animado.
Datos adicionales :
Entre los diferentes tipos de temas dinamicos que se pueden crear encontramos los siguientes :
- Con script.js
- Sin script
- Hibrido

A.Theme con Script
Estos en su interior poseen un "file.jsx" que suele ser un “.js” comprimido y/o encriptado, en el cual va escrita la configuracion u ordenes para el movimiento de los objetos en el plano o xmb. Es decir contiene la informacion, instrucciones y programacion de secuencias de commandos que se utilizan principalmente en la animacion del tema asi como se usan en paginas interactivas por ejemplo.

Hacer un theme con script.js solo es posible desde el conocimiento del lenguaje "PSJS" similar al javascript que usualmente conocemos o se ha visto utilizado en diferentes proyectos solo que este tiene algunas pequeñas diferencias en su uso o programacion en su secuencia de “comandos” en la PS3, pero no deja de ser un JS. La programacion y creacion de este es un algo compleja y mas cuando no se tiene conocimiento de ello y me incluyo pero para llegar a programar un .js no se necesitara de un conocimiento amplio de este ya que con unos simples pasos lograras escribir tu .js necesario sin problemas como veras mas adelante.

Theme Hibrido
Sistema en el que se integran tanto modelos animados con bones, como animaciones bajo script. Es decir utilizando tus animaciones creadas y en format DAE, etc y con ellos un script .jsx que los acompaña.

Theme Sin Script
Este no necesita de script, con lo cual integrando solo animaciones DAE se pueden llegar a crear grandes temas personalizados teniendo en cuenta que es obligatorio tener un minimo de conocimientos en 3D para asi poder empezar a crear nuestras animaciones e integrarlas en un .raf o anim_1.jpg valido para nuestro tema.

Por ultimo al igual que el uso de “.js” estos hacen uso de un XML (Extensible Markup language) o “Lenguaje de marcado Extensible” este permite definir los espacios y por lo tanto XML no es realmente un lenguaje en particular, sino una manera de definir lenguajes para diferentes necesidades que en este caso se utilizaran para organizar y dar orden de ejecucion a otras herramientas dentro de las instrucciones creadas para crear tanto el Raf como el P3T. De ahi que tendremos que escribir nuestro propio XML y .JS para lograr nuestro tema. Pero como ya se ha dejado saber no es algo complejo y menos se necesita amplio conocimiento en programacion para lograrlo. Y si sigues cuidadosamente y completamente todo al pie de la letra lo encontraras facil y dudo que te sientas perdido en el camino.

A ver si no se han asustado aun y dicen que carajo esto es mucha mierda para crear un simple tema y avandonan pues bien de todos modos otros seguiran leyendo y veran que es sumamente facil solo que la primera vez como todo en la vida se hara largo el camino y se vera algo simple en complejo. Pero veran que no es asi. Esta segunda parte es mas compleja que crear temas a base de videos, y la verdad no es dificil pero tampoco simple con lo que se refiere a la parte de programacion y modelado 3d cuando se hace por primera vez pero como ya deje saber veran que al final es sencillo y vale la pena eso si debes tener tiempo para ello.

Lectura opcional pero recomendada si el idioma ingles no es problema puesto que son PDF filtrados y estan en su idioma natal ingles. Los puedes descargar de aqui :
http://www.mediafire.com/?bcza94ztosbwy43
Lo dejo en descarga puesto que es simplemente informacion y nada de software inlegal.
En el paquete encontraras :
- RAF-Specifications.pdf
- PSJS_Language-Specifications_e.pdf
- Custom_Theme-Specifications_e.pdf
- GTF-Specifications_e.pdf
De todos modos ya he hecho el trabajo sucio y por eso esta guia pero si de todos modos quieren referencia ahi estan.
Que necesitas para crear tus temas dinamicos partiendo de cero :
1.Los exes o software necesario como lo son :
A-Software para modelado 3d y el cual puede ser uno de estos : Blender, 3DS Max , Maya u cualquier otro de tu preferencia que te deje exportar tus animaciones en formato DAE.
B- Las herramientas necesarias sacadas del filtrado del SDK de Sony como lo son :
1. raf_anim.exe
2. raf_compiler.exe
3. raf_compiler.inf
4. raf_geom.exe
5. raf_pack.exe
6. raf_script.exe
7. dds2gtf.exe
Por motivos de la politica del EOL no se daran enlaces a dichas herramientas por lo cual deberas preguntar al Sr. Google nuestro amigo fiel en estos casos para hacerte de ellas. Solo puedo decir que si seguiste el tutorial anterior ya estas las debes tener.
C-Notepad ++ para editar los archivos .xml y .js http://notepad-plus-plus.org/download/v5.9.3.html ;
D- Paquete de archivos necesarios para trabajar que debes descargar de aqui ;
E- Poseer una PS3 con cualquier tipo de firmware ya sea : “OFW o CFW” para probar nuestras creaciones ya que este al igual que otros metodos al no poseer un programa para “testear” nuestro producto final desde el PC lo haremos desde el PS3 ;
F- Una memoria USB con 256 MB como mínimo con formato “fat 32” ;
Opcional : La paciencia, imaginacion y el deceo de crear tu tema dinamico desde cero tan profecional que no tenga nada que envidiar a uno de la PS Store.

Que se hara en este tutorial para lograr la creacion del tema animado :
1. Deberas crear una animacion utilizando un software 3D de tu preferencia , con la opcion de exportar en formato DAE ;
2. Deberas del mismo modo crear un fondo utilizando software 3D, con la opcion de exportar en formato DAE ;
3. Escibir tu codigo .js, que necesitaras para tu Raf ;
4. Escribir tu codigo .XML, que lanzaras a tu herrameinta para que te cree tu archivo RAF ;
5. Compilar tu tema utilizando las herramientas que se mencionan anteriormente como por ejemplo el raf_compiler y el p3t_compiler entre otros.
6. Probar tu tema, compartirlo con la comunidad y disfrutarlo
Recomendaciones para evitar errores al compilar y Dolores de cabeza recuerda debes respetar estas de lo contrario no podras compilar :
1. Nuestro archivo .Raf o anim_1 vamos el archivo que contiene la animacion y dentro de este su final compilado en p3t junto a sus iconos y demas archivos deben cumplir con estas restricciones :

- Max total texture size : 15 mb
- Max total geometry & script size : 1mb
- Max total actor size : 1.20 mb
- Actor : solo un maximo de 128 “actor” por archivo .Raf
- Camera : Solo una permite
- Luz : Con un Maximo de dos luces (punto de ambiente +)
- Guion : Un solo archive .js (javascript)
- Modelo : Con maximo de 64 diferentes estos en (DAE)

2. No utilice texturas demaciado grandes (720 o 1440)
3. No construya objetos demaciado complejos ya que hay sus limitaciones en tamaño que debemos respetar.
4. Siempre revice su codigo fuente al programar tanto su .xml como su .js ya que no hay un depurador, por lo cual debe hacerse cuidadosamente ya que un error en el codigo por mas minimo que feuse no permitira el compilado.
5. Comience en su primer proyecto con un solo objeto animado luego en otra creacion practique con mas objetos. Si usa mas de un objeto estos deben permanecer agrupados.
6. Es obligatorio que dicha animacion contenga al menos una "camera", ("ortographic" o "perspective") y un modelo dae, y que este animado con armatures o bones.

Sabiendo ya esto para estar informados con que se trabaja, como se debe hacer y con que comencemos con la tarea divertida :

Creacion del tema

Esta se basara en tres fases la primera la creacion de nuestros objetos animados, segundo de escribir nuestro xml para importar nuestros productos ya sean camera,luces,texturas,js, etc y claro creado nuestro .js (javascript) que sera quien tendra nuetra info. de animacion para estimular nuestras piezas animadas.
Vamos al primer paso la creacion de nuestros objetos en 3D, se puede hacer con cualquier programa de modelado 3D ya usted eligira cual usar entre los muchos que hay Blender, 3DS max, Maya, Cinema 4D, etc
Recomiendo de manera de estudio crear un proyecto simple con solo dos objetos un circulo o utilizando un cubo animado y su backgrownd o fondo el cual puede ser este ultimo animado como estatico. Vamos estos pasos a seguir para la creacion de sus objetos animados fueron hechos utilizando 3dmax pero los mismos son validos para cualquier programa de modelado 3D que se quiera usar como preferencia.
Para esto ya debe de tener descargado el paquete que se dejo anteriormente que contiene unos archivos necesarios los cuales utilizaremos como lo son el XML de base y el JS de base.
Por el momento no voy a poner fotos pues no las tengo a mano pero las pondre luego y quien sabe si hasta un video del proceso.
Se recomienda que se conosca del modelado 3d utilizando la creacion de armatures “Bones” ya que no dare muchos datos de este paso. De mas no esta decir que si no se crean mediante “bones” los objetos creados no seran vistos en el XMB del PS3. Un modelo sin "armatures" solo se puede animar desde un script.js al momento creo entender no hay de otra. Si no sabes hacer esto te toca aprender como hacerlo de la misma manera que hice yo y hay muchos video tutoriales en youtube que te enseñan como hacerlo y para diferentes programas tanto para Blender software “libre” como para 3DS Max programa de “pago”.

Vamos en general :
1. Deberas de editar o crear los objetos a usar y exportarlos en formato DAE tanto el objeto cubo y su bg (backgrownd) y entre sus pasos generales debes :
-Abrir tu programa de edicion 3d y generar el cubo que compone tu objeto animado esto es muy sencillo solo selecciona crear objeto “cubo” en la barra superior o inferior de tu programa y una vez tengas tu cubo creado asignale un tamaño de 10x10x10, crear un material y por ultimo exportar el objeto en formato DAE.
- Ahora cerramos el proyecto actual y creamos uno nuevo que sera nuestro “plan” , backgrownd y demas objetos.
Hasta aqui ya deben haber creado sus objetos animados cubo y bg y nos tocara comenzar con la segunda etapa del proceso la creacion del archivo XML para añadir este al conjunto de piezas necesarias. Antes de comenzar nuestro codigo XML explicare lo que cada archivo significa dentro del tema :
-cube.xml : este archivo se utilizara para atraer los diferentes objetos y texturas creadas que se utilizaran en la animacion y hemos creado anteriormente con nuestro programa 3d. Dentro de este ademas se utilizan efectos u ojetos, texturas, camaras y luces dentro de las restricciones que ya habiamos hablado que seran necesarias para la creacion de nuestro tema. Este lleva las ordenes del empaquetado para la creacion del .raf si el cube.xml no es posible crear el raf.
Este cube.xml sera lanzado al Raf Compiler y este toma el xml y llama asi a las demas herramientas para el compilado del raf :
- Raf_script: Verifica el script(si existe)
- Raf Anim: Verifica la animacion (si existe)
- Raf Geom: Verifica la geometria
- Raf Pack: Compila y recompila
- Gtf2dds: Comprime las texturas DDS.
-cube.js : Este se encarga de la informacion referente a la animacion. Es decir es quien controla el movimiento de nuestros objetos dentro de la escena incluyendo luces y camera.
-p3t.xml Este es otro archivo necesario para la creacion del p3t final el cual lleva consigo la informacion y el parametro para crear el tema completo. De hecho este es como el cube.xml pero a diferencia de este lleva escrito otro codigo diferente con la informacion relacionada a la creacion del tema final incluyendo el raf o anim_1.jpg, iconos, etc.

Hasta aqui y ya conociendo de los archivos a crear comenzamos con la creacion de un archivo XML en este caso que llamaremos cube.xml para la creacion de un Raf o animacion de fondo para nuestro tema que luego llamaremos anim_1.jpg. Para esto ya debes tener instalado el Notepad ++ el cual es necesario para la edicion del JS y el XML.

Ahora vaya al paquete que descargo y entre al directorio llamado “tutorial” y ahi entre los archivos que se encuentran tendra el cube.js y el cube.xml. Si ese es el caso haga click derecho sobre el archivo cube.xml y luego seleccione editar con notepad ++. Para compilar un .raf es necesario un archivo de configuracion .xml, en el cual se asignan las propiedades de nuestra animacion y por eso la necesidad de crearlo. Ahora vamos a lo bueno pero lo odiado por muchos programar nuetro archive XML. Si no te has asustado con el proceso y decides darle lucha vamos a las generalidades del proceso.
Para comenzar a crear este XML debemos de comenzar con un prologo que sera el inicio del XML para mostrar la informacion y el mismo es obigatorio en este caso.
Dicho esto comenzamos con la "etiqueta" xml asi:

<?xml version="1.0" encoding="UTF-8"?>

Ahora abrimos la etiqueta :

<raf> y se termina con un </raf> entre medio de ambos se escriben nuestras ordenes o commandos dicho de otro modo todo debe estar escrito entre las etiquetas <raf> y </raf> :

Y utilizando los datos de “boticario” ya que lo dejo bastante claro lo voy a utilizar como ejemplo :

En este punto ya podemos empezar a escribir el contenido del raf de ejemplo, y comenzamos con
el background, a la que denominaremos "bg", tanto a la textura como al modelo.

<model id="mdl_bg" file="bg.dae" />
<material id="mtrl_bg" effect="pure_texture" >
<texture file="bg.dds" />
</material>
<actor id="bg" model="mdl_bg" material="mtrl_bg" />

Ahora escribimos el codigo de nuestro modelo "box", que no es otro que un cubo animado con bones.

<model id="mdl_box" file="box.dae">
<animation id="box_anim" file="box.dae" />
</model>
<material id="mtrl_box" effect="basic_lighting" >
<texture file="box.dds" />
</material>
<actor id="box" model="mdl_box" material="mtrl_box" />


Siguiendo con la "Camera", esta obligatoria, ya sea perscpectiva o ortografica:

<camera id="camera" type="perspective" yfov="0.927292" ymag="0" znear="0.01" zfar="1000" position="15.5, 9.5, 47" direction="0, 0, -2" up="0, 1, 0"/>

Ahora integramos la fuente de luz o " ambient Light" para dar un efecto de profundidad al modelo box y recuerde que solo puede usar un maximo de dos luces (ambient_light.dae y point_light.dae ) las unicas dos que podremos usar es decir luz ambiental y un punto de luz :

<light id="point_light.dae" file=”point_light.dae” type=”point” position=”0,0,10” />

Luego ubicamos el script "js" :

<script file=”cube.js” />

Por ultimo,y esto es importante, ya podemos cerrar la etiqueta con :

</raf>

Hasta aqui ya debes saber o tener una idea como crear tu archivo XML para la creacion del Raf.