Good! I am not against helping, even for homework, but tradition (here and in other forums) is to ask for some work first!

And trying to push in the right direction instead of doing all the work.
First thing: avoid putting stuff with "load" in draw(): it means the file will be loaded on each frame, a bit too much...
Second thing:
angle += TWO_PI; If you do a full revolution on each frame, nothing will seem to move!
Make that
angle += 0.1; or if you want "precision" (given number of steps),
angle += TWO_PI/100;Lastly, beside the above issues, your code is correct. The only problem is that you rotate
circles around their center. Well, you won't see much...

Try changing a radius or use rect to see something.
Or, like I like to do, add a some reference point:
Code:float angle;
void setup() {
size(355, 355);
smooth();
ellipseMode(CENTER);
PFont font = createFont("Arial", 42); // Simpler for me
textFont(font);
}
void draw() {
background(235);
fill(#5A555D);
text("rotation", 10, 330);
angle += TWO_PI/100;
pushMatrix();
translate(width*0.325, height*0.325);
rotate(angle);
noStroke();
fill(#930483);
ellipse(0, 0, width/2, height/2);
fill(0);
ellipse(10, 10, 10, 10);
popMatrix();
pushMatrix();
translate(width*0.7, height*0.7);
rotate(-angle);
noStroke();
fill(#D349C3);
ellipse(0, 0, width/2, height/2);
fill(0);
ellipse(10, 10, 10, 10);
popMatrix();
}
If you want to rotate around some central point, you have to do an additional translate after the rotate: the first translate position the center of the rotation, the second one will shift the circle of the radius of its revolution.