Gabonese Flag Helper explainer

The aim of this puzzle: Use drawBoxes() and newLine() function calls to create the Gabonese flag.
Walkthrough of the solution: Instead of drawing the first row of boxes using:


we can simplify that by using the drawBoxes function. drawBoxes() uses a string and turns each letter of the string into a box. A string is a group of letters and/or numbers that always have quote marks around it: 'this is a string'. The important part about a string is that it is seen as a sequence of keyboard characters – so green is an identifier, but 'green' is just the word “g-r-e-e-n” made up of five letters.

To make green, yellow, and blue boxes, you use the letters 'g', 'y', and 'b'. The first row of the flag is created with one function call: drawBoxes('ggg'); Then a newLine() is used to move the grasshopper to the next row. The starter code only draws one yellow box, but you need three to make the row long enough. That means you need to edit the string from 'y' to 'yyy'. Then there’s a newLine() to move the grasshopper to the third row. Finally, you need to add one more drawBox() function call to create a row of three blue boxes. To do that you use the command drawBoxes('bbb');
Sample code solution:
(Tap below to reveal)


JavaScript Concepts: Calling Functions, Identifiers
Grasshopper Concepts: drawBoxes(), newLine()


If we code drawboxes (byb) then it will show blue yello blue.why not black or any other starting from b or y


drawBoxes() is a custom grasshopper function.. There is code that matches each letter with a specific color, and ‘b’ was simply chosen to draw blue. If you want to create a black box, try using ‘k’. ‘e’ will also create a very dark grey.

The color associated with each letter might not be clear from the name alone, but here is the list of color names:

    a: 'amber',
    b: 'blue',
    c: 'cyan',
    d: 'dandelion',
    e: 'ebony',
    f: 'flame',
    g: 'green',
    h: 'honeydew',
    i: 'indigo',
    j: 'jade',
    k: 'key',
    l: 'lime',
    m: 'magenta',
    n: 'navy',
    o: 'orange',
    p: 'pink',
    q: 'quartz',
    r: 'red',
    s: 'smoke',
    t: 'teal',
    u: 'umber',
    v: 'violet',
    w: 'white',
    x: 'xanadu',
    y: 'yellow',
    z: 'zinfandel'



Those letter-color-coding are really weird. What will happen if i choose a color not mentioned in the list? How do i color “dark brown” for example?

1 Like

Yes, some of the names are unusual. The purpose of this list is to ensure that every letter has a color associated with it, not to assign every color possible to a letter.

To create a dark brown box, you can use a color object which is taught in a later lesson (Custom Colors).

A color object has a red, green, and blue property. Each property has a value between 0 and 255. Here’s an example dark brown color object:

var darkBrown = {
  red: 101,
  green: 67,
  blue: 33

You could then use drawBox(darkBrown) to create a dark brown box. Give it a try in the playground :slight_smile:



I received a Correct message for incorrect code. See attached image.


Hey there, thanks for flagging!


1 Like

i dont get the gabonese flag helper

1 Like

I was nervous I would end up with brown, beige, black, (or the worst… BLONDE) so I decided to spell out blue like when I was a grade school html wanna be 20some years ago. It said my answer was correct, but I beg to differ…

1 Like

Soo… What’s the problem?


The puzzle’s validation is just looking for 3 b’s in the last drawBoxes(). It’s a bit lenient.

While you’ve typed out 'blue', the drawBoxes() function is looking at each individual character, and not seeing what you’ve spelled with it, which is why you are getting the design that you have.

Hope this clears things up!


So ‘key’= black? O_o

1 Like

i don’t understand the helper Gabonese its hard can i get some help please google recommended this to me and i enjoy it but don’t understand to much


im going to do other coding apps but i just wanted to let you know i will do this here and there


I am doing the Gabonese flag and my code is the same as the answer in the explanation but whenever I try to run the code, it says: “Make sure you have a 3 blue boxes at the end of your code. For example: drawBoxes('bbb') .” when I have this as my answer. Can someone explain why this is happening and did I do something wrong?


I am on the third one and there is no new line!!!There is only draw box and string!!! :rage: :rage: :rage:

No!You did not do anything wrong!!!I tried it too but it said it was wrong!!! this is getting ridiculous!!! :rage: :rage: :rage:

Ok whats the help that you need ma’am or sir :soon:This text will be blurred

and is any one here :upside_down_face: :upside_down_face: :upside_down_face: :upside_down_face: :upside_down_face: :upside_down_face: :upside_down_face:

1 Like

me katie parsons sergio

1 Like