Vaihdamme lähestymistapaa:

Miten sprite-animaatio toimii?

• Meillä on yksi PNG-kuva, jossa on useita animaation ruutuja vierekkäin (sprite sheet).

• Näytämme siitä vain pienen osan kerrallaan.
  
  
  
  

Netistä löytyy valmiita sprite sheet -kirjastoja esimerkiksi sivulta:
Rachel's CC0 Assets (Tiles, sprites, items, UI, fonts) by Moosadee


Ohessa mallisivu sekä sprite-kuvasarja. Lataa ne koneellesi ja tutki, miten ohjelma toimii.
Canvas.html
spinjump.png

Jatka sitten kyseisen ohjelman kehittelyä tekoälyn avulla esimerkiksi seuraavasti:

• Hahmo liikkuu näppäimillä vasen/oikea

• Tausta on erillinen kuva

• Hahmo voi hyppiä ja animaatio vaihtuu liiketilan mukaan

Tämän jälkeen voit jatkaa vapaamuotoisesti tämän tai oman pelisi kehittelyä. Pidä teemana kuvakirjaston hyödyntämistä eli 1) hahmoja, jotka liikkuvat pelissä ja 2) taustakuvia, jonka päällä hahmot liikkuvat.