createCanvas(400, 400);  //Make a 400px x 400px canvas to draw on

    frameRate(25);           //Show 25 frames per second

    noStroke();              //Don’t make anything with a stroke or border

    createLoop({duration:4, framesPerSecond:25, gif:{render:false, download:true, fileName:"grow-sin.gif"}});

    //Library:  4 sec long, 100 frames (25*4),       show?         download gif?        name your gif!

}

function draw() {

    background(255);        //Background goes from 0 (black) to 255 (white)

    translate(width / 2, height / 2);   //Start drawing from center of canvas

    fill(0,(1-animLoop.progress)*255);  //Color 0 (black), but change opacity from 255 (visible) to 0 (invisible)

    //        animLoop.progress tells us how far in the animation we are, from 0 (start) to 1 (finish)

  // Instead of   animLoop.progress*width,animLoop.progress*width);

    ellipse(0, 0, sin(animLoop.theta/2)*width,sin(animLoop.theta/2)*width);

    //      X  Y  Same width & height, start by 0, end at 1*width, but use a sin() function

    //                         theta goes from 0 to 2PI

}