# Trying to turn static collage image into animation

**URL:** <https://discourse.processing.org/t/trying-to-turn-static-collage-image-into-animation/5066>\
**Category:** Coding Questions\
**Created:** [October 31, 2018, 5:30pm UTC](https://discourse.processing.org/t/trying-to-turn-static-collage-image-into-animation/5066 "2018-10-31T17:30:12Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![chisholmem](https://avatars.discourse-cdn.com/v4/letter/c/bbe5ce/32.png) [@chisholmem](https://discourse.processing.org/u/chisholmem)\
**Post date:** [October 31, 2018, 5:30pm UTC](https://discourse.processing.org/t/trying-to-turn-static-collage-image-into-animation/5066/1 "2018-10-31T17:30:12Z")

</div>

Hi there, I am new to processing and trying to figure out an assignment for class. I am currently trying to figure out how to incorporate millis() into this code, to scale/descale the images I have and to add a colored stroke around each image. Does anyone know how I can do this?

```auto
PImage p0, p1, p2, p3, p4, p5, p6;

PImage [] picArray = new PImage [7];
void setup () {
  size(1000, 1000);
  p0 = loadImage("0.png");
  p1 = loadImage("1.png");
  p2 = loadImage("2.png");
  p3 = loadImage("3.png");
  p4 = loadImage("4.png");
  p5 = loadImage("5.png");
  p6 = loadImage("6.png");
  
  picArray[0] = p0;
  picArray[1] = p1;
  picArray[2] = p2;
  picArray[3] = p3;
  picArray[4] = p4;
  picArray[5] = p5;
  picArray[6] = p6;
  
  imageMode(CENTER);
}
void draw(){
    int m= millis();
    stroke (25);
    fill (m %255);
    picArray [p0, p1, p2, p3, p4, p5, p6];
  }

void mouseMoved(){
  background(255);
  for(int b=0; b<100; b++){
  image(picArray[int(random(picArray.length))], random(width), random(height));
}
}

void keyPressed() {

if (keyCode == ENTER) {

saveFrame("####.tif"); }

}

```

---

<div class="post-metadata">

**Author:** ![Lexyth](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/lexyth/32/7403_2.png) [@Lexyth](https://discourse.processing.org/u/Lexyth)\
**Post date:** [November 1, 2018, 4:15am UTC](https://discourse.processing.org/t/trying-to-turn-static-collage-image-into-animation/5066/2 "2018-11-01T04:15:32Z")

</div>

You can do so by using the value you get from millis() within a method to resize you images. So something like img.resize(millis(), millis()); But don’t execute this! millis() returns 1000 for 1 second, so it will be at 10000 in 10 seconds, and so will be the size of your image. Do something like millis() / 100 or so. You can make different things by just having fun with it and trying out different formulae.  
Same for the stroke. Just add a stroke(millis()); where you want it 😉