Category Archives: Animation

Miracle Flower – Make it Grow!

March 25, 2014Animationpoc215

This simple game revolves around protecting the miracle tulip that is struggling to grow and flourish in this otherwise barren stretch of land. The player must water the plant from the very obliging and cheerful rain cloud (mouse press over the cloud) while preventing the pesky deer from nibbling on miracle plant.

Let it growwww, let it growww

In order to play the game properly, all the images and font set must be downloaded as well. They can be downloaded: here

Here is all the code:

Flower flower;
int [] flower_width = {
  32, 43, 57, 88, 95, 94, 122, 122
};
int[] flower_height = {
  60, 80, 100, 120, 140, 160, 180, 200
};

Rain rain;

Deer deer;
int deer_direction = 0;
PFont deerCollide;
PImage dead_Flower;
Sun sun;

Thunder thunder;
PImage lightening_bolt;
//Clicking cloud: 
boolean overCloud = false;
boolean locked = false;
int rain_click = 0;

void setup() {
  size(700, 450);
  flower = new Flower("1.png", "2.png", "3.png", "4.png", "5.png", "6.png", "7.png", "8.png");
  rain = new Rain("Cloud3.png");
  thunder = new Thunder("Thunder3.png");
  lightening_bolt = loadImage("Lightening.png");

  //FOR DEER: (String filename1, String filename2, int _x, int _y, int _velocity)
  deer = new Deer("DeerLeft.png", "DeerRight.png", -5, 1);
  deerCollide = loadFont ("ArialMT-16.vlw");
  dead_Flower = loadImage("skull.png");

  sun = new Sun("Sun.png");
}

void draw () {
  //Background and Soil
  fill(139, 69, 19);
  rect(0, 425, width, 70);
  fill(179, 232, 255);
  rect(0, 0, width, 425);

  //Use counter variable each time a certain button is pressed --> use if statement and increment array

  thunder.thunder_Draw(75, 100);

  sun.sun_Draw(620, -45);

  //SWITCH DEER ORIENTATION
  deer.deer_Move(deer_direction);

  rain.rain_Draw(350 - (111/2), 100);
  fill(00, 00, 255, 50);
  //CLICKABLE AREA for RAIN CLOUD
  if (mouseX >= 295 && mouseX <=495 &&
    mouseY >= 100 && mouseY <= 311) {
    overCloud = true;
  }
  else {
    overCloud = false;
  }

  if (rain_click <= 10){
    flower.flower_Draw(350, (height-(flower_height[0]+18)), 1);
  }

  if (rain_click <= 20 && rain_click > 10){
    flower.flower_Draw(350, (height-(flower_height[1]+18)), 2);
  }

  if (rain_click <= 30 && rain_click > 20){
    flower.flower_Draw(350, (height-(flower_height[2]+18)), 3);
  }

  if (rain_click <= 40 && rain_click > 30){
    flower.flower_Draw(350, (height-(flower_height[3]+18)), 4);
  }

  if (rain_click <= 50 && rain_click > 40){
    flower.flower_Draw(350, (height-(flower_height[4]+18)), 5);
  }

  if (rain_click <= 60 && rain_click > 50){
    flower.flower_Draw(350, (height-(flower_height[5]+18)), 6);
  }

  if (rain_click <= 70 && rain_click > 6){
    flower.flower_Draw(350, (height-(flower_height[6]+18)), 7);
  }

  if (rain_click >= 80){
    flower.flower_Draw(350, (height-(flower_height[7]+18)), 8);
  }

  textFont(deerCollide, 16);
  fill(0);
  deer.check_collision();
} // END OF DRAW 

//Flower Class
class Flower {
  PImage flower1;
  PImage flower2;
  PImage flower3;
  PImage flower4;
  PImage flower5;
  PImage flower6;
  PImage flower7;
  PImage flower8;

  int x;
  int y;
  //Constructor
  Flower(String filename1, String filename2, String filename3, String filename4, String filename5, String filename6, String filename7, String filename8) {
    flower1 = loadImage (filename1);
    flower2 = loadImage (filename2);
    flower3 = loadImage (filename3);
    flower4 = loadImage (filename4);
    flower5 = loadImage (filename5);
    flower6 = loadImage (filename6);
    flower7 = loadImage (filename7);
    flower8 = loadImage (filename8);
  } 
  void flower_Draw(float x, float y, int flower_type) {
    switch (flower_type) {
    case 0:
      image(flower1, x, y);
      break;
    case 1:
      image(flower2, x, y);
      break;
    case 2:
      image(flower3, x, y);
      break;
    case 3:
      image(flower5, x, y);
      break;
    case 4:
      image(flower6, x, y);
      break;
    case 5:
      image(flower7, x, y);
      break;
    case 6:
      image(flower8, x, y);
    }
  }
  //End of Flower Class
}

//Sun class
class Sun {
  PImage sun_ball;
  int x;
  int y;

  //Sun constructor
  Sun(String filename1) {
    sun_ball = loadImage(filename1);
  }

  void sun_Draw(int x, int y) {
    image(sun_ball, x, y);
  }
}
//End of Sun class

//Rain class
class Rain {
  PImage cloud;
  int cloud_x;
  int cloud_y;

  //Cloud constructor
  Rain(String filename) {
    cloud = loadImage(filename);
  }

  void rain_Draw(float x, float y) {
    image(cloud, x, y);
  }
}
//End of Rain class

//Thunder class
class Thunder {
  PImage lightening;
  int cloud_x;
  int cloud_y;

  //Cloud constructor
  Thunder(String filename) {
    lightening = loadImage(filename);
  }

  void thunder_Draw(int x, int y) {
    image(lightening, x, y);
  }
}//End of THUNDER class

//Deer class
class Deer {

  PImage predator1;
  PImage predator2;
  int x;
  int y;
  float velocity;

  //Deer constructor
  Deer(String filename1, String filename2, int _x, float _velocity) {
    predator1 = loadImage(filename1);
    predator2 = loadImage(filename2);

    x = _x;
    velocity = _velocity;
  }

  void deer_Draw(int x, int deer_direction) {
    y = 340;
    switch (deer_direction) {
    case 0:
      image(predator1, x, y);
      break;
    case 1:
      image(predator2, x, y);
      break;
    }
  }
  //Move deer
  int get_x () {
    return x;
  }

  //Get direction: 
  int get_direction() {
    return deer_direction;
  }

  float get_velocity() {
    return velocity;
  }
  void deer_Move(int deer_direction) {
    x += velocity;
    this.deer_Draw(x, deer_direction);
  }

  void deer_Reset() {
    int side = (int) random(1, 3);
    if (side ==1 ) {
      x = -100;
      velocity = 2;
      deer_direction = 0;
    }
    else {
      x = width+50;
      velocity = -2;
      deer_direction = 1;
    }
  }

  boolean check_collision() {
    boolean signal = false;
    if (deer_direction == 0) {
      if (((x + 100) > 350) && (x) < 475) { 
        image(dead_Flower, 310, 255);
        signal = true;
        rain_click = 0;
      }
    }

    else if (deer_direction == 1) {
      if ((x) < 350) {
        image(dead_Flower, 310, 255);
        signal = true;
        rain_click= 0;
      }
    }

    return signal;
  }
}// End of Deer class

void keyPressed () {
  deer.deer_Reset();
  image(lightening_bolt, 150, 205);
  textFont(deerCollide, 16);
  fill(255, 255, 102);
  text ("ZAP", 100, 250);
  text ("ZAP", 225, 250);
}

void mousePressed() {
  if (overCloud) {
    textFont(deerCollide, 16);
    fill(0, 0, 255);
    text ("Whee water!", 299, 100);
    draw_rain();
    rain_click += 1;
  }
  else {
    locked = false;
  }
}

void draw_rain() {
  float x = 0;
  x = (random(294, 800));
  System.out.println(x);
  float y = 0;
  int velocity_y = 3;
  for (int i = 0; i < 40; i++) {
    x = (random(294, 400));
    y = random(220, height);
    y+= velocity_y;
    fill(00, 00, 255);
    ellipse(x, y, 4, 7);
  }
}

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

142

143

144

145

146

147

148

149

150

151

152

153

154

155

156

157

158

159

160

161

162

163

164

165

166

167

168

169

170

171

172

173

174

175

176

177

178

179

180

181

182

183

184

185

186

187

188

189

190

191

192

193

194

195

196

197

198

199

200

201

202

203

204

205

206

207

208

209

210

211

212

213

214

215

216

217

218

219

220

221

222

223

224

225

226

227

228

229

230

231

232

233

234

235

236

237

238

239

240

241

242

243

244

245

246

247

248

249

250

251

252

253

254

255

256

257

258

259

260

261

262

263

264

265

266

267

268

269

270

271

272

273

274

275

276

277

278

279

280

281

282

283

284

285

286

287

288

289

290

291

292

293

294

295

296

297

298

299

300

301

302

303

304

305

306

307

308

309

310

311

312

313

314

315

316

317

318

319

320

321

322

Flower flower;

int [] flower_width = {

32, 43, 57, 88, 95, 94, 122, 122

};

int[] flower_height = {

60, 80, 100, 120, 140, 160, 180, 200

};

Rain rain;

Deer deer;

int deer_direction = 0;

PFont deerCollide;

PImage dead_Flower;

Sun sun;

Thunder thunder;

PImage lightening_bolt;

//Clicking cloud:

boolean overCloud = false;

boolean locked = false;

int rain_click = 0;

void setup() {

size(700, 450);

flower = new Flower("1.png", "2.png", "3.png", "4.png", "5.png", "6.png", "7.png", "8.png");

rain = new Rain("Cloud3.png");

thunder = new Thunder("Thunder3.png");

lightening_bolt = loadImage("Lightening.png");

//FOR DEER: (String filename1, String filename2, int _x, int _y, int _velocity)

deer = new Deer("DeerLeft.png", "DeerRight.png", -5, 1);

deerCollide = loadFont ("ArialMT-16.vlw");

dead_Flower = loadImage("skull.png");

sun = new Sun("Sun.png");

}

void draw () {

//Background and Soil

fill(139, 69, 19);

rect(0, 425, width, 70);

fill(179, 232, 255);

rect(0, 0, width, 425);

//Use counter variable each time a certain button is pressed --> use if statement and increment array

thunder.thunder_Draw(75, 100);

sun.sun_Draw(620, -45);

//SWITCH DEER ORIENTATION

deer.deer_Move(deer_direction);

rain.rain_Draw(350 - (111/2), 100);

fill(00, 00, 255, 50);

//CLICKABLE AREA for RAIN CLOUD

if (mouseX >= 295 && mouseX <=495 &&

mouseY >= 100 && mouseY <= 311) {

overCloud = true;

}

else {

overCloud = false;

}

if (rain_click <= 10){

flower.flower_Draw(350, (height-(flower_height[0]+18)), 1);

}

if (rain_click <= 20 && rain_click > 10){

flower.flower_Draw(350, (height-(flower_height[1]+18)), 2);

}

if (rain_click <= 30 && rain_click > 20){

flower.flower_Draw(350, (height-(flower_height[2]+18)), 3);

}

if (rain_click <= 40 && rain_click > 30){

flower.flower_Draw(350, (height-(flower_height[3]+18)), 4);

}

if (rain_click <= 50 && rain_click > 40){

flower.flower_Draw(350, (height-(flower_height[4]+18)), 5);

}

if (rain_click <= 60 && rain_click > 50){

flower.flower_Draw(350, (height-(flower_height[5]+18)), 6);

}

if (rain_click <= 70 && rain_click > 6){

flower.flower_Draw(350, (height-(flower_height[6]+18)), 7);

}

if (rain_click >= 80){

flower.flower_Draw(350, (height-(flower_height[7]+18)), 8);

}

textFont(deerCollide, 16);

fill(0);

deer.check_collision();

} // END OF DRAW

//Flower Class

class Flower {

PImage flower1;

PImage flower2;

PImage flower3;

PImage flower4;

PImage flower5;

PImage flower6;

PImage flower7;

PImage flower8;

int x;

int y;

//Constructor

Flower(String filename1, String filename2, String filename3, String filename4, String filename5, String filename6, String filename7, String filename8) {

flower1 = loadImage (filename1);

flower2 = loadImage (filename2);

flower3 = loadImage (filename3);

flower4 = loadImage (filename4);

flower5 = loadImage (filename5);

flower6 = loadImage (filename6);

flower7 = loadImage (filename7);

flower8 = loadImage (filename8);

}

void flower_Draw(float x, float y, int flower_type) {

switch (flower_type) {

case 0:

image(flower1, x, y);

break;

case 1:

image(flower2, x, y);

break;

case 2:

image(flower3, x, y);

break;

case 3:

image(flower5, x, y);

break;

case 4:

image(flower6, x, y);

break;

case 5:

image(flower7, x, y);

break;

case 6:

image(flower8, x, y);

}

//End of Flower Class

}

//Sun class

class Sun {

PImage sun_ball;

int x;

int y;

//Sun constructor

Sun(String filename1) {

sun_ball = loadImage(filename1);

}

void sun_Draw(int x, int y) {

image(sun_ball, x, y);

}

//End of Sun class

//Rain class

class Rain {

PImage cloud;

int cloud_x;

int cloud_y;

//Cloud constructor

Rain(String filename) {

cloud = loadImage(filename);

}

void rain_Draw(float x, float y) {

image(cloud, x, y);

}

//End of Rain class

//Thunder class

class Thunder {

PImage lightening;

int cloud_x;

int cloud_y;

//Cloud constructor

Thunder(String filename) {

lightening = loadImage(filename);

}

void thunder_Draw(int x, int y) {

image(lightening, x, y);

}

}//End of THUNDER class

//Deer class

class Deer {

PImage predator1;

PImage predator2;

int x;

int y;

float velocity;

//Deer constructor

Deer(String filename1, String filename2, int _x, float _velocity) {

predator1 = loadImage(filename1);

predator2 = loadImage(filename2);

x = _x;

velocity = _velocity;

}

void deer_Draw(int x, int deer_direction) {

y = 340;

switch (deer_direction) {

case 0:

image(predator1, x, y);

break;

case 1:

image(predator2, x, y);

break;

}

//Move deer

int get_x () {

return x;

}

//Get direction:

int get_direction() {

return deer_direction;

}

float get_velocity() {

return velocity;

}

void deer_Move(int deer_direction) {

x += velocity;

this.deer_Draw(x, deer_direction);

}

void deer_Reset() {

int side = (int) random(1, 3);

if (side ==1 ) {

x = -100;

velocity = 2;

deer_direction = 0;

}

else {

x = width+50;

velocity = -2;

deer_direction = 1;

}

boolean check_collision() {

boolean signal = false;

if (deer_direction == 0) {

if (((x + 100) > 350) && (x) < 475) {

image(dead_Flower, 310, 255);

signal = true;

rain_click = 0;

}

else if (deer_direction == 1) {

if ((x) < 350) {

image(dead_Flower, 310, 255);

signal = true;

rain_click= 0;

}

return signal;

}

}// End of Deer class

void keyPressed () {

deer.deer_Reset();

image(lightening_bolt, 150, 205);

textFont(deerCollide, 16);

fill(255, 255, 102);

text ("ZAP", 100, 250);

text ("ZAP", 225, 250);

}

void mousePressed() {

if (overCloud) {

textFont(deerCollide, 16);

fill(0, 0, 255);

text ("Whee water!", 299, 100);

draw_rain();

rain_click += 1;

}

else {

locked = false;

}

void draw_rain() {

float x = 0;

x = (random(294, 800));

System.out.println(x);

float y = 0;

int velocity_y = 3;

for (int i = 0; i < 40; i++) {

x = (random(294, 400));

y = random(220, height);

y+= velocity_y;

fill(00, 00, 255);

ellipse(x, y, 4, 7);

}

PS. (Disclaimer): Sorry I meant to post this a while ago but after actual presentation day when this project was due, but I had no internet that day (which is why I used a USB to present) and I delayed in posting it out of sheer forgetfulness…Awkward: I think after that delay I think I prematurely saved the draft and quit before actually posting (apologies!!)

Omnipotent Creepy Clown

March 10, 2014AnimationMaddie Moore

For this little exercise, my idea was to have a circus tent in the background with a clown that appears. However, the result is a massive clown that bounces around the screen. His movement is programmed, but can be manipulated by the placement of the mouse. One of the things I’d like to change is the size of the clown. I’d also like to learn how to make him multiply with a mouseClick.

Here’s my code:

PImage clown;

float size = 10;
float posX = 10;
float posY = 20;
float speedX = 3;
float speedY = 3;
void setup(){
size(600,400);
clown = loadImage(“circus-clown.jpeg”);

}

void draw(){
background(loadImage(“3_circus_tent_8x12.jpg”));
posX = posX + speedX;
posY = mouseY + speedY;

if(posX > width ||posX < 0){
speedX = speedX * -1;
}
if(posY > height ||posY < 0){
speedY = speedY * -1;

}
image(clown, posX-40, posY-20);

}

Moving Circles

March 3, 2014Animationyz655

For this project I wanted to do something with many moving parts. I got the circles to work!

Screen Shot 2014-03-03 at 2.31.34 PM

float circle1;
float circle2;
float circle3;
float circle4;
float circle5;
float circle1y;
float circle2y;
float circle3y;
float circle4y;
float circle5y;
float linehorizontal;
float linevertical;

float linepoint;
float linepoint1;

float speed;
float speed2;

//float circle1Xsize;
//float circle2size;
//float circle3size;
//float circle4size;

float circlesize5x;
float circlesize5y;

void setup(){
  size(800,600);
  smooth();

  circle1=200;
  circle2=200;
  circle3=200;
  circle4=200;
  circle5=200;
  //CIRCLE X values

  circle1y=200;
  circle2y=200;
  circle3y=200;
  circle4y=200;
  circle5y=200;
  //CIRCLE Y values

  circlesize5x=200;
  circlesize5y=200;
  //CIRCLE SIZE

  linehorizontal=300;
  linevertical=200;

  linepoint=.1;
  linepoint1=.1;  

  speed=.5;
  speed2=-.5;

}

void draw(){
  background (random(255,0));

//circles
ellipseMode(CENTER);
ellipse(circle1,circle1y,252,252);
ellipseMode(CENTER);
ellipse(circle2,circle2y,250,250);
ellipseMode(CENTER);
ellipse(circle3,circle3y,240,240);
ellipseMode(CENTER);
ellipse(circle4,circle4y,220,220);
ellipseMode(CENTER);
ellipse(circle5,circle5y,circlesize5x=circlesize5x+1, circlesize5y=circlesize5y+1);

 circle1=circle1+1;
 circle2=circle2-1;
 circle3y=circle3y+1;
 circle4y=circle4y-1;

line(200,100,200,300); //vertical cross
line(100,200,300,200); //horizontal cross

line(200,190,190,200); //upper left
line(200,190,210,200);  //upper right
line(190,200,200,210); //lower left
line(200,210,210,200);  //lower right

//lower left
line(linepoint1=linepoint1+speed,linepoint=linepoint+speed,190,200,200,220);
line(linepoint1=linepoint1+speed,linepoint=linepoint+speed,190,200,200,240);
line(linepoint1=linepoint1+speed,linepoint=linepoint+speed,190,200,200,260);
line(linepoint1=linepoint1+speed,linepoint=linepoint+speed,190,200,200,280);
line(linepoint1=linepoint1+speed,linepoint=linepoint+speed,190,200,200,281);
line(linepoint1=linepoint1+speed,linepoint=linepoint+speed,190,200,200,282);
line(linepoint1=linepoint1+speed,linepoint=linepoint+speed,190,200,200,283);
line(linepoint1=linepoint1+speed,linepoint=linepoint+speed,190,200,200,283);

//lower right
line(linepoint1=linepoint1+speed,linepoint=linepoint+speed,200,220);
line(linepoint1=linepoint1+speed,linepoint=linepoint+speed,200,220);
line(linepoint1=linepoint1+speed,linepoint=linepoint+speed,200,240);
line(linepoint1=linepoint1+speed,linepoint=linepoint+speed,200,260);
line(linepoint1=linepoint1+speed,linepoint=linepoint+speed,200,280);
line(linepoint1=linepoint1+speed,linepoint=linepoint+speed,200,281);
line(linepoint1=linepoint1+speed,linepoint=linepoint+speed,200,282);
line(linepoint1=linepoint1+speed,linepoint=linepoint+speed,200,283);

//upper right
line(linepoint1=linepoint1+.5,linepoint=linepoint+.5,200,180);
line(linepoint1=linepoint1+.5,linepoint=linepoint+.5,200,160);
line(linepoint1=linepoint1+.5,linepoint=linepoint+.5,200,140);
line(linepoint1=linepoint1+.5,linepoint=linepoint+.5,200,120);
line(linepoint1=linepoint1+.5,linepoint=linepoint+.5,200,119);
line(linepoint1=linepoint1+.5,linepoint=linepoint+.5,200,118);
line(linepoint1=linepoint1+.5,linepoint=linepoint+.5,200,117);

//upper left
line(linepoint1=linepoint1+.5,linepoint=linepoint+.5,200,180);
line(linepoint1=linepoint1+.5,linepoint=linepoint+.5,200,160);
line(linepoint1=linepoint1+.5,linepoint=linepoint+.5,200,140);
line(linepoint1=linepoint1+.5,linepoint=linepoint+.5,200,120);
line(linepoint1=linepoint1+.5,linepoint=linepoint+.5,200,119);
line(linepoint1=linepoint1+.5,linepoint=linepoint+.5,200,118);
line(linepoint1=linepoint1+.5,linepoint=linepoint+.5,200,117);

line(linepoint1=linepoint1+speed2,linepoint=linepoint-.5,190,200);
line(linepoint1=linepoint+speed2,linepoint=linepoint-.5,180,200);
line(linepoint1=linepoint+speed2,linepoint=linepoint-.5,170,200);
line(linepoint1=linepoint1+speed2,linepoint=linepoint-.5,160,200);
line(linepoint1=linepoint1+speed2,linepoint=linepoint-.5,150,200);
line(linepoint1=linepoint1+speed2,linepoint=linepoint-.5,140,200);

line(linepoint1=linepoint1+.5,linepoint=linepoint-.5,220,200);
line(linepoint1=linepoint1+.5,linepoint=linepoint-.5,230,200);
line(linepoint1=linepoint1+.5,linepoint=linepoint-.5,240,200);
line(linepoint1=linepoint1+.5,linepoint=linepoint-.5,250,200);
line(linepoint1=linepoint1+.5,linepoint=linepoint-.5,260,200);
line(linepoint1=linepoint1+.5,linepoint=linepoint-.5,270,200);

line(linepoint=linepoint-.5,linepoint1=linepoint1+.5,200,100,300,200);
line(linepoint=linepoint-.5,linepoint1=linepoint1+.5,200,200,200,300);
line(linepoint=linepoint-.5,linepoint1=linepoint1+.5,200,300,100,200);
line(linepoint=linepoint-.5,linepoint1=linepoint1+.5,200,200,200,100);

if (linepoint>600) {speed= speed * -1;}

}

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

142

143

144

145

146

147

148

float circle1;

float circle2;

float circle3;

float circle4;

float circle5;

float circle1y;

float circle2y;

float circle3y;

float circle4y;

float circle5y;

float linehorizontal;

float linevertical;

float linepoint;

float linepoint1;

float speed;

float speed2;

//float circle1Xsize;

//float circle2size;

//float circle3size;

//float circle4size;

float circlesize5x;

float circlesize5y;

void setup(){

size(800,600);

smooth();

circle1=200;

circle2=200;

circle3=200;

circle4=200;

circle5=200;

//CIRCLE X values

circle1y=200;

circle2y=200;

circle3y=200;

circle4y=200;

circle5y=200;

//CIRCLE Y values

circlesize5x=200;

circlesize5y=200;

//CIRCLE SIZE

linehorizontal=300;

linevertical=200;

linepoint=.1;

linepoint1=.1;

speed=.5;

speed2=-.5;

}

void draw(){

background (random(255,0));

//circles

ellipseMode(CENTER);

ellipse(circle1,circle1y,252,252);

ellipseMode(CENTER);

ellipse(circle2,circle2y,250,250);

ellipseMode(CENTER);

ellipse(circle3,circle3y,240,240);

ellipseMode(CENTER);

ellipse(circle4,circle4y,220,220);

ellipseMode(CENTER);

ellipse(circle5,circle5y,circlesize5x=circlesize5x+1, circlesize5y=circlesize5y+1);

circle1=circle1+1;

circle2=circle2-1;

circle3y=circle3y+1;

circle4y=circle4y-1;

line(200,100,200,300); //vertical cross

line(100,200,300,200); //horizontal cross

line(200,190,190,200); //upper left

line(200,190,210,200); //upper right

line(190,200,200,210); //lower left

line(200,210,210,200); //lower right

//lower left

line(linepoint1=linepoint1+speed,linepoint=linepoint+speed,190,200,200,220);

line(linepoint1=linepoint1+speed,linepoint=linepoint+speed,190,200,200,240);

line(linepoint1=linepoint1+speed,linepoint=linepoint+speed,190,200,200,260);

line(linepoint1=linepoint1+speed,linepoint=linepoint+speed,190,200,200,280);

line(linepoint1=linepoint1+speed,linepoint=linepoint+speed,190,200,200,281);

line(linepoint1=linepoint1+speed,linepoint=linepoint+speed,190,200,200,282);

line(linepoint1=linepoint1+speed,linepoint=linepoint+speed,190,200,200,283);

//lower right

line(linepoint1=linepoint1+speed,linepoint=linepoint+speed,200,220);

line(linepoint1=linepoint1+speed,linepoint=linepoint+speed,200,240);

line(linepoint1=linepoint1+speed,linepoint=linepoint+speed,200,260);

line(linepoint1=linepoint1+speed,linepoint=linepoint+speed,200,280);

line(linepoint1=linepoint1+speed,linepoint=linepoint+speed,200,281);

line(linepoint1=linepoint1+speed,linepoint=linepoint+speed,200,282);

line(linepoint1=linepoint1+speed,linepoint=linepoint+speed,200,283);

//upper right

line(linepoint1=linepoint1+.5,linepoint=linepoint+.5,200,180);

line(linepoint1=linepoint1+.5,linepoint=linepoint+.5,200,160);

line(linepoint1=linepoint1+.5,linepoint=linepoint+.5,200,140);

line(linepoint1=linepoint1+.5,linepoint=linepoint+.5,200,120);

line(linepoint1=linepoint1+.5,linepoint=linepoint+.5,200,119);

line(linepoint1=linepoint1+.5,linepoint=linepoint+.5,200,118);

line(linepoint1=linepoint1+.5,linepoint=linepoint+.5,200,117);

//upper left

line(linepoint1=linepoint1+.5,linepoint=linepoint+.5,200,180);

line(linepoint1=linepoint1+.5,linepoint=linepoint+.5,200,160);

line(linepoint1=linepoint1+.5,linepoint=linepoint+.5,200,140);

line(linepoint1=linepoint1+.5,linepoint=linepoint+.5,200,120);

line(linepoint1=linepoint1+.5,linepoint=linepoint+.5,200,119);

line(linepoint1=linepoint1+.5,linepoint=linepoint+.5,200,118);

line(linepoint1=linepoint1+.5,linepoint=linepoint+.5,200,117);

line(linepoint1=linepoint1+speed2,linepoint=linepoint-.5,190,200);

line(linepoint1=linepoint+speed2,linepoint=linepoint-.5,180,200);

line(linepoint1=linepoint+speed2,linepoint=linepoint-.5,170,200);

line(linepoint1=linepoint1+speed2,linepoint=linepoint-.5,160,200);

line(linepoint1=linepoint1+speed2,linepoint=linepoint-.5,150,200);

line(linepoint1=linepoint1+speed2,linepoint=linepoint-.5,140,200);

line(linepoint1=linepoint1+.5,linepoint=linepoint-.5,220,200);

line(linepoint1=linepoint1+.5,linepoint=linepoint-.5,230,200);

line(linepoint1=linepoint1+.5,linepoint=linepoint-.5,240,200);

line(linepoint1=linepoint1+.5,linepoint=linepoint-.5,250,200);

line(linepoint1=linepoint1+.5,linepoint=linepoint-.5,260,200);

line(linepoint1=linepoint1+.5,linepoint=linepoint-.5,270,200);

line(linepoint=linepoint-.5,linepoint1=linepoint1+.5,200,100,300,200);

line(linepoint=linepoint-.5,linepoint1=linepoint1+.5,200,200,200,300);

line(linepoint=linepoint-.5,linepoint1=linepoint1+.5,200,300,100,200);

line(linepoint=linepoint-.5,linepoint1=linepoint1+.5,200,200,200,100);

if (linepoint>600) {speed= speed * -1;}

}

Help Pacman!

March 3, 2014AnimationAlice Cai

Look at how lonely and hungry he is. Won’t you help? My plan was to make Pacman (which I did!) and have it gobble up bouncing balls (which I didn’t do).

Things I have trouble with: multiple classes/variables(?) in Processing

If any of you can help, add some wizardry/magic to it, that’d be very cool. Code below!

float pacX=mouseX;
    float pacY=350;
    float count=0;
    float pacsize=20;

    void setup() {
      size(600, 400);
      background(0);
      smooth();
      noCursor(); 
    }

    void draw() {
        pacman();

    }

    void pacman() // Hey look it's Pacman!
    {
      background(0);
      fill(250, 250, 40); //classic yellow color
      arc(pacX, pacY, 50, 50, PI/4, 7*PI/4);
      pacX=mouseX;
      pacY=350;
    }

float pacX=mouseX;

float pacY=350;

float count=0;

float pacsize=20;

void setup() {

size(600, 400);

background(0);

smooth();

noCursor();

}

void draw() {

pacman();

}

void pacman() // Hey look it's Pacman!

{

background(0);

fill(250, 250, 40); //classic yellow color

arc(pacX, pacY, 50, 50, PI/4, 7*PI/4);

pacX=mouseX;

pacY=350;

}

Confetti-eating clouds

March 3, 2014Animationayk267

I was trying to create a game with Kat’s code of falling glitter (something like Catch the Falling Glitter with the Bucket) but I didn’t know how to make the glitter disappear into the bucket.

For now, here’s a very simple screensaver inspired by Kat’s random color variable. I had a lot of fun playing with this.

The code:

//DECLARING VARIABLE
float cloudX;
float cloudY;
//float sizeX;

//INITIALIZE VARIABLE
void setup(){
size(800,800);
background(255);
//cloudX = width/2;
//cloudY = height/2;
}

//USE VARIABLE
void draw(){
cloudX = random(width);
cloudY = random(height);
//sizeX = random(width);
//background(255);
stroke(135,206,235,20);
fill(135,206,235,70);
ellipse(cloudX,cloudY,200,100);

if (mousePressed) {
float r = random(0,255);
float g = random(0,255);
float b = random(0,255);
float a = random(0,255);
fill(r,g,b,a);
ellipse(mouseX,mouseY,30,30);
}

}

//DECLARING VARIABLE

float cloudX;

float cloudY;

//float sizeX;

//INITIALIZE VARIABLE

void setup(){

size(800,800);

background(255);

//cloudX = width/2;

//cloudY = height/2;

}

//USE VARIABLE

void draw(){

cloudX = random(width);

cloudY = random(height);

//sizeX = random(width);

//background(255);

stroke(135,206,235,20);

fill(135,206,235,70);

ellipse(cloudX,cloudY,200,100);

if (mousePressed) {

float r = random(0,255);

float g = random(0,255);

float b = random(0,255);

float a = random(0,255);

fill(r,g,b,a);

ellipse(mouseX,mouseY,30,30);

}

Interactive Screen Saver… what?

March 3, 2014AnimationAnimation, Jeremiah, wooJeremiah Jarrett

So I wanted to make something that would allow the bouncing ball to vary speed, direction, and size. However, once I started I tried messing with speed when I would click, but I could not get the effect I wanted and though I knew why I didn’t know how to fix it. But I was able to change direction and location of the ball. So I made a screensaver that is the stereo typical bouncing ball, but if you were to click on the screen the ball would move to where you clicked and would move in the opposite direction of that which it was bouncing in before. I also wanted it to erase after a while after you let it sit for a while or if you click so that it doesn’t get too crazy.

Here is the code:

float circlex = 0;
float xSpeed = 2;
float circley =0;
float ySpeed = 2;
float i = 0;
void setup() {
  size(600, 370);
  background (75, 100, 200);
}
void mouseClicked() {
  background (75, 100, 200);
  circley = mouseY;
  circlex = mouseX;
  xSpeed = xSpeed *-1;
  ySpeed = ySpeed *-1;

}

void draw() {

  stroke(0);
  fill(200, 40, 10);
  ellipse(circlex, circley, 20, 20);
  circlex = circlex + xSpeed;
  circley = circley + ySpeed;
  if (circlex > width || circlex <= 0) {
    xSpeed = xSpeed * -1;
  }
  if (circley > height || circley <= 0) {
    ySpeed = ySpeed * -1;
  }
  i = i+1;
  if (i > 2500){  
    background (75, 100, 200);
    i = i - 2500;
   }

}

float circlex = 0;

float xSpeed = 2;

float circley =0;

float ySpeed = 2;

float i = 0;

void setup() {

size(600, 370);

background (75, 100, 200);

}

void mouseClicked() {

background (75, 100, 200);

circley = mouseY;

circlex = mouseX;

xSpeed = xSpeed *-1;

ySpeed = ySpeed *-1;

}

void draw() {

stroke(0);

fill(200, 40, 10);

ellipse(circlex, circley, 20, 20);

circlex = circlex + xSpeed;

circley = circley + ySpeed;

if (circlex > width || circlex <= 0) {

xSpeed = xSpeed * -1;

}

if (circley > height || circley <= 0) {

ySpeed = ySpeed * -1;

}

i = i+1;

if (i > 2500){

background (75, 100, 200);

i = i - 2500;

}

And I made it color-changing too!

float circlex = 0;
float xSpeed = 2;
float circley =0;
float ySpeed = 2;
float i = 0;
float red = random(255);
float green = random(255);
float blue = random(255);
void setup() {
  size(600, 370);
  background (75, 100, 200);
}
void mouseClicked() {

  red = random(255);
  green = random(255);
  blue = random(255);
  background (75, 100, 200);
  circley = mouseY;
  circlex = mouseX;
  xSpeed = xSpeed *-1;
  ySpeed = ySpeed *-1;
}

void draw() {

  stroke(0);
  fill(red, green, blue);
  ellipse(circlex, circley, 20, 20);
  circlex = circlex + xSpeed;
  circley = circley + ySpeed;
  if (circlex > width || circlex <= 0) {
    xSpeed = xSpeed * -1;
  }
  if (circley > height || circley <= 0) {
    ySpeed = ySpeed * -1;
  }
  i = i+1;
  if (i > 2500) {  
    background (75, 100, 200);
    i = i - 2500;
  }
  if (circlex <= 0 || circlex >= width || circley <= 0 || circley >= height) {
    red = random(255);
    green = random(255);
    blue = random(255);
  }
}

float circlex = 0;

float xSpeed = 2;

float circley =0;

float ySpeed = 2;

float i = 0;

float red = random(255);

float green = random(255);

float blue = random(255);

void setup() {

size(600, 370);

background (75, 100, 200);

}

void mouseClicked() {

red = random(255);

green = random(255);

blue = random(255);

background (75, 100, 200);

circley = mouseY;

circlex = mouseX;

xSpeed = xSpeed *-1;

ySpeed = ySpeed *-1;

}

void draw() {

stroke(0);

fill(red, green, blue);

ellipse(circlex, circley, 20, 20);

circlex = circlex + xSpeed;

circley = circley + ySpeed;

if (circlex > width || circlex <= 0) {

xSpeed = xSpeed * -1;

}

if (circley > height || circley <= 0) {

ySpeed = ySpeed * -1;

}

i = i+1;

if (i > 2500) {

background (75, 100, 200);

i = i - 2500;

}

if (circlex <= 0 || circlex >= width || circley <= 0 || circley >= height) {

red = random(255);

green = random(255);

blue = random(255);

}

bouncing travolta

March 3, 2014AnimationHenry

Last night I was watching the Oscars and John Travolta (for some reason) presented the singer of the song for Frozen. Word on the street is that he butchered the singers name. Regardless, his appearance inspired me to create an animation. Here is the John Travolta bouncing ball. Pretty hypnotizing, huh?

http://youtu.be/YzVGbIYbdaQ

PImage travolta;

float siz = 30;
float posX = 60; 
float posY = 100;
float speedX = 6; 
float speedY = 6;

void setup(){
  size(600,400);
  travolta = loadImage("travoltaball.png"); 

}

void draw(){
  background(110);
  posX = posX + speedX; 
  posY = posY + speedY;

  if(posX > width ||posX < 0){
    speedX = speedX * -1;
  }
  if(posY > height ||posY < 0){
    speedY = speedY * -1;

  }

image(travolta, posX-40, posY-20);

}

PImage travolta;

float siz = 30;

float posX = 60;

float posY = 100;

float speedX = 6;

float speedY = 6;

void setup(){

size(600,400);

travolta = loadImage("travoltaball.png");

}

void draw(){

background(110);

posX = posX + speedX;

posY = posY + speedY;

if(posX > width ||posX < 0){

speedX = speedX * -1;

}

if(posY > height ||posY < 0){

speedY = speedY * -1;

}

image(travolta, posX-40, posY-20);

}

Animated Eyes

March 3, 2014AnimationabiAbi

I wanted to make something interactive, so I made eyes that blink with the mouse movement. I dunno, it got a little weird. You can see it here.

float rectX;
float xspeed = 10;
float rectY;
float yspeed = 10;

void setup(){
  size(720, 480);
  smooth();
  rectY = 0;
}

void draw(){
  background(255, 230, 240);
  stroke(0);
  fill(255);

 //eyeball
  fill(random(230,255), random(100, 230), random(200, 255));
  rect(200, 125, 100, 200);
  rect(400, 125, 100, 200);

 //pupil
 if (mouseY < 125){
  noStroke();
  fill(mouseY, 230, mouseX);
  ellipse(260, 250, 75, 130);
  ellipse(460, 250, 75, 130);
 }

 else if ((mouseY > 125) && (mouseY < 250)){
  noStroke();
  fill(mouseY, 230, mouseX);
  ellipse(250, 250, 75, 130);
  ellipse(450, 250, 75, 130);
 }

 else if (mouseY > 250){
  noStroke();
  fill(mouseY, 230, mouseX);
  ellipse(240, 250, 75, 130);
  ellipse(440, 250, 75, 130);
 }

 //eyelid
  if ((mouseY > 125) && (mouseY < 325)){
    fill(255, 230, 240);
    noStroke();
    rect(195, mouseY-250, 110, 250);
    rect(395, mouseY-250, 505, 250);
    stroke(0);
    line(180, mouseY, 320, mouseY); 
    line(380, mouseY, 520, mouseY);
  }

  else if (mouseY >= 325){
    noStroke();
    fill(255, 230, 240);
    rect(195, 120, 320, 325);
    rect(395, 120, 520, 325);
    stroke(0);
    line(180, 325, 320, 325);
    line(380, 325, 520, 325);
  }

  else if (mouseY <= 125){
    stroke(0);
    line(180, 125, 320, 125);
    line(380, 125, 520, 125);
  }

  if (keyPressed){
   if (key == 'a'){
    noStroke();
    fill(255, 230, 240);
    rect(180, 120, 150, 325);
    stroke(0);
    line(180, 325, 320, 325);
   }
  }

  //bouncing bar
  fill(random(230,255), random(100, 230), random(200, 255));
  noStroke();
  rect(rectX, random(rectY), 30, 30);
  rect(random(rectX), rectY, 30, 30);
   rectX = rectX + xspeed;
   rectY = rectY + yspeed;

if((rectX > width) || (rectX < 0)){
    xspeed = xspeed * -1;
  }

if((rectY > height) || (rectY < 0)){
    yspeed = yspeed * -1;
  }

}

float rectX;

float xspeed = 10;

float rectY;

float yspeed = 10;

void setup(){

size(720, 480);

smooth();

rectY = 0;

}

void draw(){

background(255, 230, 240);

stroke(0);

fill(255);

//eyeball

fill(random(230,255), random(100, 230), random(200, 255));

rect(200, 125, 100, 200);

rect(400, 125, 100, 200);

//pupil

if (mouseY < 125){

noStroke();

fill(mouseY, 230, mouseX);

ellipse(260, 250, 75, 130);

ellipse(460, 250, 75, 130);

}

else if ((mouseY > 125) && (mouseY < 250)){

noStroke();

fill(mouseY, 230, mouseX);

ellipse(250, 250, 75, 130);

ellipse(450, 250, 75, 130);

}

else if (mouseY > 250){

noStroke();

fill(mouseY, 230, mouseX);

ellipse(240, 250, 75, 130);

ellipse(440, 250, 75, 130);

}

//eyelid

if ((mouseY > 125) && (mouseY < 325)){

fill(255, 230, 240);

noStroke();

rect(195, mouseY-250, 110, 250);

rect(395, mouseY-250, 505, 250);

stroke(0);

line(180, mouseY, 320, mouseY);

line(380, mouseY, 520, mouseY);

}

else if (mouseY >= 325){

noStroke();

fill(255, 230, 240);

rect(195, 120, 320, 325);

rect(395, 120, 520, 325);

stroke(0);

line(180, 325, 320, 325);

line(380, 325, 520, 325);

}

else if (mouseY <= 125){

stroke(0);

line(180, 125, 320, 125);

line(380, 125, 520, 125);

}

if (keyPressed){

if (key == 'a'){

noStroke();

fill(255, 230, 240);

rect(180, 120, 150, 325);

stroke(0);

line(180, 325, 320, 325);

}

//bouncing bar

fill(random(230,255), random(100, 230), random(200, 255));

noStroke();

rect(rectX, random(rectY), 30, 30);

rect(random(rectX), rectY, 30, 30);

rectX = rectX + xspeed;

rectY = rectY + yspeed;

if((rectX > width) || (rectX < 0)){

xspeed = xspeed * -1;

}

if((rectY > height) || (rectY < 0)){

yspeed = yspeed * -1;

}

When It All Falls Down

March 3, 2014AnimationKathryn Ruhl

For this project I wanted to create more than one circle and have them almost fall down the screen. I had to create a circle object to do this for more than one circle to appear.

Here is a link to the video of the output

float transparency = random(80, 100);
int count = 600;
Circle [] circles;
float x,y;

void setup(){
  size (600,600);
  circles = new Circle[count];
  for (int k = 0; k < count; k++) {
      circles[k] = new Circle(x, y);
    }

}//setup

void draw(){

   background(255);
   for (int i =0; i<count; i++){
      circles[i].rainCircles();
      circles[i].draw();
     }

}//draw

class Circle {
  float x = random(0,width);
  float y;
  float radius = random(1,30);
  float speed = random (0.5, 4.0);

  // Contructor
  Circle(float x,float y) {
    x --;

  }
  void rainCircles(){
     if (y < 600 || y >=  0) {
        y+=speed;
      }
    }

  void draw() {
    float r = random(0,255);
    float g = random(0,255);
    float b = random(0,255);
    fill(r,g,b,transparency);
    noStroke();  
    ellipse(x, y, radius, radius);  
  }

}

float transparency = random(80, 100);

int count = 600;

Circle [] circles;

float x,y;

void setup(){

size (600,600);

circles = new Circle[count];

for (int k = 0; k < count; k++) {

circles[k] = new Circle(x, y);

}

}//setup

void draw(){

background(255);

for (int i =0; i<count; i++){

circles[i].rainCircles();

circles[i].draw();

}

}//draw

class Circle {

float x = random(0,width);

float y;

float radius = random(1,30);

float speed = random (0.5, 4.0);

// Contructor

Circle(float x,float y) {

x --;

}

void rainCircles(){

if (y < 600 || y >= 0) {

y+=speed;

}

void draw() {

float r = random(0,255);

float g = random(0,255);

float b = random(0,255);

fill(r,g,b,transparency);

noStroke();

ellipse(x, y, radius, radius);

}

The Big Cheese

March 3, 2014AnimationIeva Urbaite

I made a really simple animation with a bouncing ball and the image of a mouse. The mouse follows your computer mouse. I would have liked to have the ball disappear when the mouse goes over the cheese ball, but I wasn’t sure how to do that.

mouse and cheese

float circleX;
float xspeed = 1;
void setup (){
  loadPixels ();
  size(1000,1000);
  circleX = 5;
}

void draw (){

background (255,15,155);
 fill (255,196,105);
 stroke (255);
   float h = random (0,1000);
 ellipse (circleX,h,200,200);

 image( loadImage("mouse_icon.png"),mouseX,mouseY);

  circleX = circleX + xspeed;

if (circleX > width || circleX < 0) {
    //turn around

 xspeed  = xspeed + -1.1;
}

}

float circleX;

float xspeed = 1;

void setup (){

loadPixels ();

size(1000,1000);

circleX = 5;

}

void draw (){

background (255,15,155);

fill (255,196,105);

stroke (255);

float h = random (0,1000);

ellipse (circleX,h,200,200);

image( loadImage("mouse_icon.png"),mouseX,mouseY);

circleX = circleX + xspeed;

if (circleX > width || circleX < 0) {

//turn around

xspeed = xspeed + -1.1;

}

<span style="background-color: #ffffff;font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif;font-size: 14px;line-height: 1.5em"> </span>

1	<span style="background-color: #ffffff;font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif;font-size: 14px;line-height: 1.5em"> </span>

Bouncing mini seizure

March 3, 2014AnimationCaleb Ferguson

With some help from the very animated video teacher and Anna, I figured out the basics of the direction changes via if statements. After getting the bare bones, I added some elements of randomness to the color, size, and speed of the ball for a slightly-more exciting bouncing mini-seizure.

Here is the .pde file

Just for fun, here is the .pde file of the interactive drawing I made in class

Code:

float xpos;
float ypos;
float xspeed=random(10);
float yspeed=random(10);
float circlesize = random(30,40);

void setup() {
size(700,700);
background(88,30,106,1);

}

void draw() {
  float t = random(255);
  float r = random (255);
  float g = random (255);
  float b = random (255);
  background(88,30,106,1);
  fill(r,g,b,t);
  ellipse(xpos,ypos,circlesize,circlesize);
  xpos=xpos+xspeed;
  ypos=ypos+yspeed;
  if(xpos>=width||xpos<=0){
    xspeed=xspeed*-1;
    circlesize = random(20,50); 
  }
  if (ypos>=height||ypos<=0){
    yspeed=yspeed*-1;
    circlesize = random(20,50);
  }
}

float xpos;

float ypos;

float xspeed=random(10);

float yspeed=random(10);

float circlesize = random(30,40);

void setup() {

size(700,700);

background(88,30,106,1);

}

void draw() {

float t = random(255);

float r = random (255);

float g = random (255);

float b = random (255);

background(88,30,106,1);

fill(r,g,b,t);

ellipse(xpos,ypos,circlesize,circlesize);

xpos=xpos+xspeed;

ypos=ypos+yspeed;

if(xpos>=width||xpos<=0){

xspeed=xspeed*-1;

circlesize = random(20,50);

}

if (ypos>=height||ypos<=0){

yspeed=yspeed*-1;

circlesize = random(20,50);

}

Sorry Leo

March 3, 2014Animationxl642

Last week’s been crazy and I’ve missed the Oscars because I was on the plane. So I made this to let out my anger and despair.

here’s the video for it :3.

bounce oscar

The result turned out a bit too simplistic. I was trying to make the letters stay on the screen for a bit, and when you move the cursor over the letters would start to wiggle, and when you click your mouse, it triggers the movement. But somehow I couldn’t manage for it to work. Anyways, here it is.

It’s alright, next year, Leo.

String message = "Oscar";
PImage bg;
PImage bg1;
PImage bg2;

float x;
float y;     

float hr;  //horizontal radius
float vr;// vertical radius

float xspeed = 4; 
float yspeed = 5;  

int xdirection = 1; 
int ydirection = 1;  

void setup() 
{
  size(600, 372);
  bg = loadImage("http://moviesofhollywood.com/wp-content/uploads/2013/11/leonardo-dicaprio-the-wolf-of-wall-street-photo-600x372.jpg");
  textFont(createFont("Georgia", 36));

  textAlign(CENTER, CENTER);

  background(bg);

  hr = textWidth(message) / 2;
  vr = (textAscent() + textDescent()) / 2;
  noStroke();
  x = width / 2;
  y = height / 2;
}

void draw() 
{

  background(bg);

    x = x + ( xspeed * xdirection );
    y = y + ( yspeed * ydirection );

  //flash

    if (x > width-hr || x < hr) {
      xdirection *= -1; 
    }
    if (y > height-vr || y < vr) {
      ydirection *= -1;

    }

    //wanted to try make it wiggle

      if (dist(mouseX, mouseY, x, y) < hr) {

        //if (abs(mouseX - x) < hr &&
        // abs(mouseY - y) < vr) {
        x += random(-50, 50);
        y += random(-50, 50);
      }
        // the actual text
    fill(253, 219, 0);
    text("Oscar", x, y);
  }

 void mousePressed() {
  noStroke();
  fill(255, 0, 255);
  rectMode(CENTER);
  rect(mouseX,mouseY,16,16);
}

//after the oscar is outside of the screen, change background

String message = "Oscar";

PImage bg;

PImage bg1;

PImage bg2;

float x;

float y;

float hr; //horizontal radius

float vr;// vertical radius

float xspeed = 4;

float yspeed = 5;

int xdirection = 1;

int ydirection = 1;

void setup()

{

size(600, 372);

bg = loadImage("http://moviesofhollywood.com/wp-content/uploads/2013/11/leonardo-dicaprio-the-wolf-of-wall-street-photo-600x372.jpg");

textFont(createFont("Georgia", 36));

textAlign(CENTER, CENTER);

background(bg);

hr = textWidth(message) / 2;

vr = (textAscent() + textDescent()) / 2;

noStroke();

x = width / 2;

y = height / 2;

}

void draw()

{

background(bg);

x = x + ( xspeed * xdirection );

y = y + ( yspeed * ydirection );

//flash

if (x > width-hr || x < hr) {

xdirection *= -1;

}

if (y > height-vr || y < vr) {

ydirection *= -1;

}

//wanted to try make it wiggle

if (dist(mouseX, mouseY, x, y) < hr) {

//if (abs(mouseX - x) < hr &&

// abs(mouseY - y) < vr) {

x += random(-50, 50);

y += random(-50, 50);

}

// the actual text

fill(253, 219, 0);

text("Oscar", x, y);

}

void mousePressed() {

noStroke();

fill(255, 0, 255);

rectMode(CENTER);

rect(mouseX,mouseY,16,16);

}

//after the oscar is outside of the screen, change background

Multiply the Rainbow

March 3, 2014AnimationAnimationpoc215

In this animation, a single bubble will bounce around the screen. However, it will spawn itself upon hitting the walls and the colors will eventually cycle through the rainbow.

Something mysterious will happen when the mouse is pressed (and if it’s too much, you can undo the coolness by pressing a key)

Yellow on Orange — Orange is a terrible color

int circleX;
int circleY;
int velocityX;
int velocityY;
int bubblecount;
int bubblecount2;
boolean bubbleadd;

//MousePressed/keyPressed
boolean disco;

//Use arrays to store color values:
int[] red = {255, 255, 255, 0, 0, 75, 143};
int[] green = {0, 127, 255, 255, 0, 0, 0};
int[] blue = {0,0,0,0,255,130,255};
int cycle_color;
int cycle_color2;

//Use arrays to store coordinates of new bubbles
int[] bubbleX = new int[1000];
int[] bubbleY = new int[1000];

//Use arrays to store velocities of new bubbles
int[] bubblevelocityX = new int [1000];
int[] bubblevelocityY = new int [1000];
void setup() {
  strokeWeight(0);
  stroke(100, 0, 150);
  size(800, 600);
  circleX = mouseX;
  circleY = mouseY;
  velocityX = 7;
  velocityY = 7;
  bubblecount = 0;
  bubblecount2 = 0;
  bubbleX[0]=circleX;
  bubbleY[0]=circleY;
  bubblevelocityX[0]=velocityX;
  bubblevelocityY[0]=velocityY;
//colors of background/bubbles 
cycle_color = 0;
cycle_color2 = 1;

//cool effect
disco = true;

}
void draw() {
  background(red[cycle_color],green[cycle_color],blue[cycle_color]);

  bubbleadd = true;
  bubblecount2 = bubblecount;

  //Array is used to store 
  //For loop checks activities of each bubble that is created 
  //Bubblecount2 is used to prevent the for loop from expanding itself during the iteration 
  //Bubblecount is used to refer to the next index where the new bubble would be created 

  for (int i = 0; i <= bubblecount2; i++) {
    if (disco) {
    fill(red[cycle_color2],green[cycle_color2],blue[cycle_color2]);
    }
    else {
          fill(random(255),random(255),random(255));
    }
    bubbleX[i]+= bubblevelocityX[i];
    bubbleY[i]+= bubblevelocityY[i];

    if (bubbleX[i] >= width || bubbleX[i] <= 0) {
      bubblevelocityX[i] *= -1;

      if (bubbleadd) {
        bubblecount += 1;
        bubbleX[bubblecount] = bubbleX[i];
        bubbleY[bubblecount] = bubbleY[i];
        bubblevelocityX[bubblecount] = bubblevelocityX[i];
        bubblevelocityY[bubblecount] = -bubblevelocityY[i]+(int)random(5);
        bubbleadd = false;
      }
    }

    if (bubbleY[i] >= (height) || bubbleY[i] <= 0) {
      bubblevelocityY[i] *= -1;
      if (bubbleadd) {
        bubblecount += 1;
        bubbleX[bubblecount] = bubbleX[i];
        bubbleY[bubblecount] = bubbleY[i];
        bubblevelocityX[bubblecount] =-bubblevelocityX[i]+(int)random(5);
        bubblevelocityY[bubblecount] = bubblevelocityY[i];
        bubbleadd = false;
      }
    }

    //drawing new bubbles
    strokeWeight(0);
    stroke(red[cycle_color2],green[cycle_color2],blue[cycle_color2]);
    ellipse(bubbleX[i], bubbleY[i], 120, 120);
  }

  if (bubblecount2 > 500){
    bubblecount2=0;
    bubblecount=0;
    cycle_color += 1;
      if (cycle_color >= 7)
        cycle_color=0;

    cycle_color2 += 1;
     if (cycle_color2 >= 7)
       cycle_color2=0;
  }

}

//Cool effect (on)
  void mousePressed(){
    disco=false;

  }

//Cool effect (off)
  void keyPressed() {
    disco=true;
  }

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

int circleX;

int circleY;

int velocityX;

int velocityY;

int bubblecount;

int bubblecount2;

boolean bubbleadd;

//MousePressed/keyPressed

boolean disco;

//Use arrays to store color values:

int[] red = {255, 255, 255, 0, 0, 75, 143};

int[] green = {0, 127, 255, 255, 0, 0, 0};

int[] blue = {0,0,0,0,255,130,255};

int cycle_color;

int cycle_color2;

//Use arrays to store coordinates of new bubbles

int[] bubbleX = new int[1000];

int[] bubbleY = new int[1000];

//Use arrays to store velocities of new bubbles

int[] bubblevelocityX = new int [1000];

int[] bubblevelocityY = new int [1000];

void setup() {

strokeWeight(0);

stroke(100, 0, 150);

size(800, 600);

circleX = mouseX;

circleY = mouseY;

velocityX = 7;

velocityY = 7;

bubblecount = 0;

bubblecount2 = 0;

bubbleX[0]=circleX;

bubbleY[0]=circleY;

bubblevelocityX[0]=velocityX;

bubblevelocityY[0]=velocityY;

//colors of background/bubbles

cycle_color = 0;

cycle_color2 = 1;

//cool effect

disco = true;

}

void draw() {

background(red[cycle_color],green[cycle_color],blue[cycle_color]);

bubbleadd = true;

bubblecount2 = bubblecount;

//Array is used to store

//For loop checks activities of each bubble that is created

//Bubblecount2 is used to prevent the for loop from expanding itself during the iteration

//Bubblecount is used to refer to the next index where the new bubble would be created

for (int i = 0; i <= bubblecount2; i++) {

if (disco) {

fill(red[cycle_color2],green[cycle_color2],blue[cycle_color2]);

}

else {

fill(random(255),random(255),random(255));

}

bubbleX[i]+= bubblevelocityX[i];

bubbleY[i]+= bubblevelocityY[i];

if (bubbleX[i] >= width || bubbleX[i] <= 0) {

bubblevelocityX[i] *= -1;

if (bubbleadd) {

bubblecount += 1;

bubbleX[bubblecount] = bubbleX[i];

bubbleY[bubblecount] = bubbleY[i];

bubblevelocityX[bubblecount] = bubblevelocityX[i];

bubblevelocityY[bubblecount] = -bubblevelocityY[i]+(int)random(5);

bubbleadd = false;

}

if (bubbleY[i] >= (height) || bubbleY[i] <= 0) {

bubblevelocityY[i] *= -1;

if (bubbleadd) {

bubblecount += 1;

bubbleX[bubblecount] = bubbleX[i];

bubbleY[bubblecount] = bubbleY[i];

bubblevelocityX[bubblecount] =-bubblevelocityX[i]+(int)random(5);

bubblevelocityY[bubblecount] = bubblevelocityY[i];

bubbleadd = false;

}

//drawing new bubbles

strokeWeight(0);

stroke(red[cycle_color2],green[cycle_color2],blue[cycle_color2]);

ellipse(bubbleX[i], bubbleY[i], 120, 120);

}

if (bubblecount2 > 500){

bubblecount2=0;

bubblecount=0;

cycle_color += 1;

if (cycle_color >= 7)

cycle_color=0;

cycle_color2 += 1;

if (cycle_color2 >= 7)

cycle_color2=0;

}

//Cool effect (on)

void mousePressed(){

disco=false;

}

//Cool effect (off)

void keyPressed() {

disco=true;

}

The Remix to Ignition

March 2, 2014Animationamr627

For my bounce project, I decided to incorporate R. Kelly’s lovely jam: “Ignition (Remix)”

I tried to make the edges solid by having it bounce off of the diameter, rather than the center, but I encountered some difficulties with making it work on the 0 X and 0 Y axis. Maybe you guys could tell me why.

The ball is programmed to cycle through a random rainbow of colors while bouncing faster and faster (as it gets more and more excited by the smoothness of the tunes) until it is eventually moving too fast for us to see.

kellybounce

Here is a video of my program running, followed by the code. The screencap quality isn’t the best, so I apologize for the jumpiness.

PImage photo;
float circleX;
float circleY;
float xspeed = 10;
float yspeed = 10;
float diameter;

void setup() {
  size (944, 700);
  photo = loadImage ("rkelly.jpeg");
  smooth ();
  circleX = 0;
  circleY = 0; 
  diameter = 100;
}

void draw() {
  image(photo, 0, 0);
  //background(51);
  //fill (100,0,100);
  noStroke ();
  ellipse (circleX, circleY, diameter, diameter);

  circleX = circleX + xspeed;
  circleY = circleY + yspeed;

  if (circleX >= width || circleX <= 0) {
    xspeed = xspeed * -1.5;
    println("Runnin' her hands through my 'fro");
    fill(random (255), random (255), random (255));
  }

  if (circleY >= height || circleY <= 0) { // had + diameter / 2, but it didnt work on the 0 axis
    yspeed = yspeed * -1.12;
    println("Bouncin' on 24's");
    fill(random (255), random (255), random (255));
  }
}

PImage photo;

float circleX;

float circleY;

float xspeed = 10;

float yspeed = 10;

float diameter;

void setup() {

size (944, 700);

photo = loadImage ("rkelly.jpeg");

smooth ();

circleX = 0;

circleY = 0;

diameter = 100;

}

void draw() {

image(photo, 0, 0);

//background(51);

//fill (100,0,100);

noStroke ();

ellipse (circleX, circleY, diameter, diameter);

circleX = circleX + xspeed;

circleY = circleY + yspeed;

if (circleX >= width || circleX <= 0) {

xspeed = xspeed * -1.5;

println("Runnin' her hands through my 'fro");

fill(random (255), random (255), random (255));

}

if (circleY >= height || circleY <= 0) { // had + diameter / 2, but it didnt work on the 0 axis

yspeed = yspeed * -1.12;

println("Bouncin' on 24's");

fill(random (255), random (255), random (255));

}

With Caleb’s help, I fixed the aforementioned bugs, making my edges solid. Not as concise, I could combine the X and the Y into || statements, but I may want to insert a random change depending on the wall that the ball hits, so I will leave it as is. I also added a random speed change when the mouse is pressed and took out the auto acceleration. Here is my new code and a video:

bounce 2

PImage photo;
float circleX = 300;
float circleY = 300;
float xspeed = 2;
float yspeed = 2;
float diameter = 100;

void setup() {
  size (930, 700); //x,y
  photo = loadImage ("rkelly.jpeg");
  smooth ();
 // circleX = 0;
 // circleY = 0; 
}

void draw() {
  image(photo, 0, 0);
  //background(51);
  //fill (100,0,100);
  noStroke ();
  ellipse (circleX, circleY, diameter, diameter);

  circleX = circleX + xspeed;
  circleY = circleY + yspeed;

  if (circleX + diameter / 2 >= 930) {
    xspeed = xspeed * -1;
    println("Runnin' her hands through my 'fro");
    fill(random (255), random (255), random (255));
  }

  if (circleX <= diameter / 2) {
    xspeed = xspeed * -1;
    println("Bouncin' on 24's");
    fill(random (255), random (255), random (255));
  }

  if (circleY + diameter / 2 >= 700) {
    yspeed = yspeed * -1;
    println("Runnin' her hands through my 'fro");
    fill(random (255), random (255), random (255));
  }

  if (circleY <= diameter / 2) { // had + diameter / 2, but it didnt work on the 0 axis
    yspeed = yspeed * -1;
    println("Bouncin' on 24's");
    fill(random (255), random (255), random (255));
  }
}

void mousePressed (){
  xspeed = random (0,100);
  yspeed = random (0,100);
}

PImage photo;

float circleX = 300;

float circleY = 300;

float xspeed = 2;

float yspeed = 2;

float diameter = 100;

void setup() {

size (930, 700); //x,y

photo = loadImage ("rkelly.jpeg");

smooth ();

// circleX = 0;

// circleY = 0;

}

void draw() {

image(photo, 0, 0);

//background(51);

//fill (100,0,100);

noStroke ();

ellipse (circleX, circleY, diameter, diameter);

circleX = circleX + xspeed;

circleY = circleY + yspeed;

if (circleX + diameter / 2 >= 930) {

xspeed = xspeed * -1;

println("Runnin' her hands through my 'fro");

fill(random (255), random (255), random (255));

}

if (circleX <= diameter / 2) {

xspeed = xspeed * -1;

println("Bouncin' on 24's");

fill(random (255), random (255), random (255));

}

if (circleY + diameter / 2 >= 700) {

yspeed = yspeed * -1;

println("Runnin' her hands through my 'fro");

fill(random (255), random (255), random (255));

}

if (circleY <= diameter / 2) { // had + diameter / 2, but it didnt work on the 0 axis

yspeed = yspeed * -1;

println("Bouncin' on 24's");

fill(random (255), random (255), random (255));

}

void mousePressed (){

xspeed = random (0,100);

yspeed = random (0,100);

}

dem bouncy linez

March 2, 2014AnimationEmily Dubovoy

float lineX = 0;
float lineY = 0;
float xspeed = 10;
float rotation = 0;
float square1; 
float x = 0;

void setup() {
  x = 50;
  background (255);
  size(1000, 800);
  square1 = x;
}

void draw() {

  // cyan line bounce
  stroke(7, 221, 218, random(255));
  line(lineX, height, 1, 1);

  lineX = lineX + xspeed;

  if (lineX > 1000) {
    xspeed = -5;
  }

  if (lineX < 0) {
    xspeed = 5;
  }  

  // magenta line bounce
  stroke(241, 76, 119, random(255));
  line(width, lineY, 1, 1);
  lineY = lineY + xspeed;
  if (lineY > 1000) {
    xspeed = -5;
  }

  if (lineY < 0) {
    xspeed = 5;
  }

  rotation=rotation+0.06;
  fill(255, 255, 255, 100);
  noStroke();
  translate(500,400);
  rotate(rotation);
  ellipse(50, 50, 10, 10);

  rotation=rotation+0.06;
  fill(255, 255, 255, 100);
  noStroke();
  rotate(rotation);
  ellipse(100, 100, 10, 10);

  rotation=rotation+0.06;
  fill(255, 255, 255, 100);
  noStroke();
  rotate(rotation);
  ellipse(200, 200, 10, 10);

  rotation=rotation+0.06;
  fill(255, 255, 255, 100);
  noStroke();
  rotate(rotation);
  ellipse(300, 300, 10, 10);

  rotation=rotation+0.06;
  fill(255, 255, 255, 100);
  noStroke();
  rotate(rotation);
  ellipse(300, 300, 10, 10);
}

float lineX = 0;

float lineY = 0;

float xspeed = 10;

float rotation = 0;

float square1;

float x = 0;

void setup() {

x = 50;

background (255);

size(1000, 800);

square1 = x;

}

void draw() {

// cyan line bounce

stroke(7, 221, 218, random(255));

line(lineX, height, 1, 1);

lineX = lineX + xspeed;

if (lineX > 1000) {

xspeed = -5;

}

if (lineX < 0) {

xspeed = 5;

}

// magenta line bounce

stroke(241, 76, 119, random(255));

line(width, lineY, 1, 1);

lineY = lineY + xspeed;

if (lineY > 1000) {

xspeed = -5;

}

if (lineY < 0) {

xspeed = 5;

}

rotation=rotation+0.06;

fill(255, 255, 255, 100);

noStroke();

translate(500,400);

rotate(rotation);

ellipse(50, 50, 10, 10);

rotation=rotation+0.06;

fill(255, 255, 255, 100);

noStroke();

rotate(rotation);

ellipse(100, 100, 10, 10);

rotation=rotation+0.06;

fill(255, 255, 255, 100);

noStroke();

rotate(rotation);

ellipse(200, 200, 10, 10);

rotation=rotation+0.06;

fill(255, 255, 255, 100);

noStroke();

rotate(rotation);

ellipse(300, 300, 10, 10);

rotation=rotation+0.06;

fill(255, 255, 255, 100);

noStroke();

rotate(rotation);

ellipse(300, 300, 10, 10);

}

I made a screensaver type animation with bouncing lines with random opacity and a bullseye pattern in the corner to play with the rotate function.

Here is a sketch.

The Impossible Game!

March 2, 2014AnimationNicole Kim

A simple game where the player tries to stop the moving square inside one of the grid boxes. To stop the square, press ‘g’. Try to get the square to fit inside a box before it turns ~~red~~ green! The game is (almost) impossible because depending on the screen size the square and the box might not align, and the rotation of the square might also throw off the alignment! Muahaha…

float squareX=0;
float squareY=0;
float xspeed=2;
float yspeed=2;
float s=50;
float k=0;
float rotation;
float colour;

void setup() {
  size(600, 400);
  smooth();
  println("the impossible game");
}

void draw() {
  background(255);
  grid();

  squareX=squareX+xspeed;
  squareY=squareY+yspeed;
  rotation = rotation+0.1;
  colour = colour+squareX/100;

  if (squareX>width-s/2||squareX<0) {
    xspeed = -xspeed;
    colour = -colour;
  }
  if (squareY>height-s/2||squareY<0) {
    yspeed = -yspeed;
    colour = -colour;
  }
  translate(squareX, squareY);
  rotate(rotation);
  rectMode(CENTER);
  fill(0, colour, 0);
  rect(0, 0, s, s);
}

void keyPressed() {
  if (key =='g') {
    delay(300);
  }
}

void grid() {
  for (k=0;k<width/s;k++) {
    stroke(0);
    line(k*s, 0, k*s, height);
    line(0, k*s, width, k*s);
  }
}

float squareX=0;

float squareY=0;

float xspeed=2;

float yspeed=2;

float s=50;

float k=0;

float rotation;

float colour;

void setup() {

size(600, 400);

smooth();

println("the impossible game");

}

void draw() {

background(255);

grid();

squareX=squareX+xspeed;

squareY=squareY+yspeed;

rotation = rotation+0.1;

colour = colour+squareX/100;

if (squareX>width-s/2||squareX<0) {

xspeed = -xspeed;

colour = -colour;

}

if (squareY>height-s/2||squareY<0) {

yspeed = -yspeed;

colour = -colour;

}

translate(squareX, squareY);

rotate(rotation);

rectMode(CENTER);

fill(0, colour, 0);

rect(0, 0, s, s);

}

void keyPressed() {

if (key =='g') {

delay(300);

}

void grid() {

for (k=0;k<width/s;k++) {

stroke(0);

line(k*s, 0, k*s, height);

line(0, k*s, width, k*s);

}

ICM

Creative Computing

Category Archives: Animation

Miracle Flower – Make it Grow!

Omnipotent Creepy Clown

Moving Circles

Help Pacman!

Confetti-eating clouds

Interactive Screen Saver… what?

bouncing travolta

Animated Eyes

When It All Falls Down

The Big Cheese

Bouncing mini seizure

Sorry Leo

Multiply the Rainbow

The Remix to Ignition

dem bouncy linez

The Impossible Game!