Graphical User Interface: (1) Project Proposal

I've been struggling to come up with an idea for this one, but I think I've finally come up with something that's (a) manageable within the time frame and (b) an idea I can have fun with.

My plan is to take this adorable pixelated Kirby sprite and have his movement controlled by the user of the program. I hope to have some sort of scrolling background, which can be changed based on three preset options, and I also would like to utilize the tint() function to involve color. Here's my rather poorly drawn mock-up of how I'd like the interface to look.

I know my drawing is nothing to sneeze at, but hopefully you still get the basics of what I'm aiming for. With 3 color sliders, 2 directional buttons, and 3 background buttons, I hope to be well within the requirements for the project.

Expect more updates on this fairly soon! I'm excited to finally get started.

Paige Ruka

P.S.: Here's some code I was tinkering with as I came up with the idea. I split up the GIF into different frames, since I want to be able to control when the images are cycling and when Kirby should be standing still. That system's not in place yet, but I think it should be easier to do with the individual frames.

PImage[] kirby;
int counter;
void setup() {
  size(210, 190);
  background(255);
  frameRate(10);

  kirby = new PImage[10];

  kirby[0] = loadImage("K0.png");
  kirby[1] = loadImage("K1.png");
  kirby[2] = loadImage("K2.png");
  kirby[3] = loadImage("K3.png");
  kirby[4] = loadImage("K4.png");
  kirby[5] = loadImage("K5.png");
  kirby[6] = loadImage("K6.png");
  kirby[7] = loadImage("K7.png");
  kirby[8] = loadImage("K8.png");
  kirby[9] = loadImage("K9.png");

  counter = -1;
}
void draw() {
  counter++;
  if (counter >= 10) {
    counter = 0;
  }

  background(255);
  image(kirby[counter], 0, 0);

  println(counter);
}