Two eyes, one height

Challenge 10 of 12

Both eyes sit at exactly the same height, which is what a variable is for: write the height once and use the name twice.

Draw a YELLOW circle at 200, 200 and 240 across, then BLACK circles 30 across at 160 and at 240, both 160 down, on BLUE.

Your code JavaScript

Draw a YELLOW circle at 200, 200 and 240 across, then BLACK circles 30 across at 160 and at 240, both 160 down, on BLUE.

Console print() output

0 / 30 frames · 400×400

Target

Yours

Yours over Target — ghosted shapes are in the target but missing from yours

Results

Press Run to check your code

Penalties: none this run

Report this challenge

Lesson Code it yourself

Everything in this topic starts the same way: an empty editor. There is nothing to fill in, because there is nothing there — you write all of it.

That is a bigger step than it sounds, so the buttons above the editor do the fiddly part for you. Click everyFrame and the whole block appears, curly brackets and all, with the cursor already sitting inside it. Click circle and you get a circle line with numbers in it to change. Nothing a button gives you is ever the answer; it is a piece of the shape of the code, and the choosing is still yours.

Build the picture in the order it is painted. The background goes first, because it covers whatever was drawn before it. Then choose a colour, draw the shapes that colour, then choose the next one. A shape always comes out in whichever colour was chosen last, so a colour line in the wrong place is the commonest way for a picture to come out wrong.

Everything else here you already know: a variable to hold a number or a word, the four sums, joining words to numbers with a plus, and width and height for finding middles and quarters. Nothing new is being taught. What is new is that nobody is holding the pen.

Press Run early and often. One line at a time, checked as you go, is far easier than eight lines and a blank canvas — and when a name is misspelt the error panel says so, with the line number.