Stars and Asteroids - My game in Codea

hi all, after all the work and debugging i’m glad to present a preview of one of the games i’ve been working on in Codea : Stars and Asteroids

i originally made this game in javascript sometime back in 2013 and then remade it in Unity and c# around 2015 and got it on the app store, unfortunately it didn’t get many downloads or user, nonetheless, i’ve remade it yet again in Codea - it served as a great game to get going from the ground up and expand my core framework

feel free to ask me any questions about how it works and i’ll be happy to explain and share some code examples

Stars & Asteroids - Codea version

currently i’m working on responsive design to get the game to fit all devices, then i’ll publish on the app store as i’ve already tested it in xcode and it builds and simulates


It looks very interesting!

Have you used craft in it? and how about the exported Xcode project, can it run on the xcode simulator? Few months ago, I tried to export my craft project to XCODE, unfortunatlly, it can not run.

it does not use craft, it’s all 2d

i did run it in xCode but there were a couple hiccups, you have to download the frameworks first which is confusing, and also make an empty Assets folder for some reason and then it builds

The same as me, the 2D can run on Xcode, how do you deal with the sprite sheet? character walk,run,fight animations? I think it is a hard challenge for programmers like us.

i handle sprite sheets through my shader and pass it an animation sequence for how to animate the frames


uniforms //...
frame = 1, frames = 16, frameCols = 8  // the current frame,totalFrames and how many columns in this sheet

void main () {
  float lUvx = vUvx;
  float lUvy = vUvy;
  if (frames > 1.) {
    float framea = frame;
  float row = ceil(framea/frameCols);   
  float col = framea-((row-1.)*frameCols);
  float nx = (1./frameCols);
  float ny = (1./ceil(frames/frameCols));
  lUvx *= nx;
  lUvx += (col-1.) * nx;
  lUvy *= ny;
  lUvy += (row-1.) * ny;
  float uvRectx = lUvx;
  float uvRecty = lUvy;

basically with this logic the shader chops the sheet into just the frame you want, then my animation sequence just swaps out “frame” with the next number in the sequence after X periods of time

the shader reads the image from bottom left to right to up, so the bottom left image is frame 1, and my animation sequence is actually frames 2-16

the shader can read image textures up to 2048x2048 so however many farmers you can fit into that space is how much you have fit one sheet, but then it can just swap out the texture with a different one “sheet 2” this operation is a bit more expressive for computation but in my practice it works fine, in even tested a really long animation that requires two sheets of space and it worked fine without any visible glitches

I also use shader for character animations, but what I really want to ask is did you draw your own character animations I feel that this work takes a lot of time, and I need to learn some knowledge of painting.

I have studied various methods in the hope of improving the efficiency of character animation

yes i draw my characters in procreate, and what i do is make each part of the character it’s own layer, so a layer for right foot, a layer for right calf etc, as detailed as i will make the animation, each piece has its own layer,

then i duplicate these over and over and use the trasform, warp, and liquify tools to adjust the positions and then scale them way down to create pixel art out of them, this helps remove a lot of imperfections in drawing, and then you can go over the pixels and refine them


from the above layered character i made the running animation using a running reference for the key frames to position the limbs, then i warped and liquified them together and created frame by frame in between movement with simple warping of the key frames

although the process is relatively simple it is undeniably time consuming


You draw really good!!!

And it looks like the character moves naturally and smoothly.

I guess it takes time to learn these painting skills.

thanks! but it’s almost a trick, i’m ok at drawing but not that great, look into a technique called “rotoscoping”

Nice!! The animated sprites really bring it to life

Looking great! The animations look really nice

Wow, nice animations! I have used the flip a clip app to make sprite sheets. Not as advanced as procreate, but works nicely.