SpriteJavi en JBA

Tutoria de AGD IV: Creando nuestro “Muñequito” y los “Bichos” (Sprites)

Una vez tenemos los tiles y al menos una pantalla de las entregas anteriores de este Tutorial de AGD en español, y antes de profundizar en los detalles de la configuración de suelos y paredes, o los mapas, vamos a completar los elementos básicos que necesitaremos para crear un juego: nuestro protagonista y los enemigos a los que se enfrentará.

Antes de nada, un poco de contexto.

Aunque mi objetivo principal es enseñar com hacer un juego con AGD y que a partir de ahi cada cual pueda marcar su camino, como vengo haciendo quiero antes, dar un poco de contexto sobre sprites, y haceros conscientes de las limitaciones de las maquinas de la época de los 8 bits, lo que supone todo un reto a nivel artístico (Marty… ¿no tendré que llamarte gallina no? ;))

En el caso de Spectrum tenemos un color para la tinta y otro para el fondo a elegir entre 7 por cada area de 8×8 pixels pudiendo usar o no brillo de forma que (salvo del negro) tenemos dos versiones de cada color. Eso si no podemos hacer que la tinta tenga brillo y el fondo no, todo con brillo o sin brillo.

Al margen de las especifiadades de color de Spectrum, así como las especifidades del color de los sprites en AGD que veremos mas adelante, abramos boca con estos dos videos que nos dan una gran perspectiva sobre la materia. Hay subtítulos en español para los que no domineis el ingles…

Para temas de desarrollo el ingles es básico.

Y en AGD … ¿Como va?

Lo primero es pulsar S desde el menú principal, accederemos al editor de Sprites donde podremos generar nuestras cracioes (de las dimensiones definidas traves de la opción i “Miscelanea”, en el caso de JBA he usado Sprites de 16×16). 

El protagonista en el editor de sprites

El interfaz es bastante sencillo, un cuadro enorme en la parte superior izquierda que nos permite editar el sprite al gusto, un indicador del numero de sprite en que nos encontramos y el frame que estamos editando (los sprites pueden tener varios frames de animación.

¿En qué consiste esto de los “frames de animación”?.

Siempre que observamos un “muñequito” en la pantalla, vemos que se mueve, no es – habitualmente – una imagen estática, para lograr este efecto, se dibuja al personaje varias veces con la postura ligeramente cambiada, como en los dibujos animados. Al mostrar estos dibujos en secuencia a una velocidad apropiada, percibiremos que “se mueve”. Este pequeño video lo explica muy bien:

Ahora que creo tenemos claro el contexto general es el momento de indicar las teclas que debemos usar en esta pantalla para crear nuestros muñequitos y bichos, el movimiento básico se realiza con cursores y space para cambiar el pixel donde se sitúa el cursor:

TECLAS 
=======================================================
X = Insertar Sprite
D = Borrar Sprite
C = Borrar el contenido del Sprite

Cursores = Movemos el puntero por la rejilla del Sprite
Space or 0 = Cambia el pixel actual (activo/inactivo)

M = Copia el sprite al portapapeles
K = Pega el sprite dede el portapapeles
H = gira horizontalmente el sprite
V = gira verticalmente el sprite

N = Moverse al sprite siguiente
P = Moverse al sprite siguiente

I = insertar frame
R = borrar frame
F = Ir al siguiente frame

ENTER = Volver al menú principal

Copiar bloques de un Load Screen
================================

El editor, según el manual de la version 4.6, tiene una
pantalla en la que podemos cargar ficheros de tipo
screen$, usando la tecla L. Una vez en esa pantalla, se
puede mover un cursor de 16x16 pixels y copiar porciones
de ella al portapapeles (usando space) desde el que luego
podremos pegar usando la letra K.

L = carga una pantalla al editor para copiar trozos
G = vuelve a la pantalla cargada para copiar otro trozo
Space en la pantalla cargada = Copia el trozo activo
Cursores en la pantalla cargada = Mover Cursor de Copia.



Mas alla de esto, el funcionamiento es muy similar a los bloques, solo que aqui cada “Sprite” puede contener mas de un frame de animación , ya veremos como se usan las animaciones pero podéis practicar creando al protagonista (o vuestro propio “muñequito” con al menos 4 frames de animación, mirando a izquierda y derecha.

No os limiteis a copiar sin mas los sprites, dadles vuestro propio toque una vez que tengas claros los fundamentos.


Adicionalmente, y como ejercicio para afinar vuestro desempeño podeis tratar de replicar (y animar) los gráficos que sugiero a continuación. ¡Se me olvidaba! podeis usar la tecla F dentro del editor para ver en sucesión los frames y hacer preview de vuestra animación y asi corregirla… ¡antes de mandar vuestra creación a Dinamic!

En el próximo capitulo, os mostrare mis pruebas con la funcionalidad de copiar bloques desde pantallas de carga, y empezaremos a situar los muñequitos en la pantalla que creamos en capítulos anteriores, esto nos dará pie para ampliar los conocimientos de forma práctica.

¿Te gustó este contenido?

Si te gustó el contenido, ayudame con los costes de servidor, de dominios, y apoyame para que pueda seguir trabajando en esta dirección, recuerda ¡esta donación es completamente voluntaria!

En caso de que la cantidad propuesta te parezca mucha o (espero que) poca, puedes donar la cantidad que quieras a través de mi página en Paypal.me, si en la nota indicas porque donas y porque no coincides con la cantidad indicada, me ayudaras a entender mejor que creaciones pueden ser de mayor valor para vosotros, y tratare de crear mas de ese tipo (aunque en esencia escribo y creo lo que siento en cada momento). Gracias de todo corazón. Por si te lo preguntas, la intención es dedicar este dinero a lo indicado, pagar servidor, dominios, servicios online y en su caso software y/o formación para poder seguir desarrollando juegos cada vez mejores, escribiendo artículos y compartiendo podcasts. Si por un casual de repente resulta que donáis millones de euros, el orden de mi lista de deseos comienza por pagarme el poder ir a varios eventos retro a lo largo del año, e incluso en un futuro ideal montar un Museo Físico en torno al mundo de la retroinformática y el videojuego. Los sueños, sueños son ?
Javis Big Adventure prune de concepto para la version CPC de la primera pantalla

Tutorial de AGD III: Nuestra primera pantalla.

Continuamos con el tutorial de AGD en español, en esta ocasión crearemos nuestra primera pantalla, y os propondré el ejercicio artístico que les prometí en la anterior entrega.

Antes de nada, en este punto dejo definitivamente de “traducir” segmentos del curso original, el primer capitulo es prácticamente la traducción, en el segundo he sacado absolutamente los pies del tiesto, y creo que, si bien seguiré los pasos en el orden que se planteó, lo explicaré a mi modo, creo que quedará mas natural.

(más…)

AGD Home

Tutorial de AGD I : El Comienzo

Capitulo uno

¡Hola a todos! comenzamos aquí un tutorial que me consta deseado desde hace tiempo por una parte de la scene de habla hispana, que no es otra que la versión en español de los archiconocidos videos de Paul Jenkinson sobre este fantástico maker.
´
Ademas de la cuestión relativa al idioma, esta la cuestión de la versión, aquellos tutoriales datan de 2012 y se refieren a AGD 3.0, cuando actualmente vamos por la versión 4.7 he considerado, por tanto, interesante tomar el relevo y comenzar esta actualización – traducción de dichos tutoriales.

Pero no todo va a ser idéntico, si bien voy a seguir el orden sabiamente indicado en los videos originales, con la ayuda de Sergio ‘thEpOpE’ y otros compañeros de AGDevs, tratare de ampliar y complementar este curso con artículos extra y trucos varios, pero vayamos por pasos, primero, esta fase 🙂

(más…)