For my mini coding project, I chose to do the create your own self portrait option on Hour of Code. I tried a few of the other tutorials like the Code a Healthy Meal App, but I found that one to be sort of confusing as there was not an as in-depth tutorial included. The self portrait tutorial is very in-depth with instructions as well as explains the why of each line of code. It even has some tips and tricks to make sure everything moves efficiently!

To start the project, you must first go to P5JS. This is a site that is essentially an IPad you can draw on with your keyboard. It has a bunch of examples, shortcuts, and presettings for you to use for free with an account. I will also link the tutorial video here: Code Your Self Portrait.

-the first step is to create a background colour. In this stage, you can google RGB colour picker, which will give you the codes you need to choose the colours for your project. 

-To start, you must first draw the shape of your head. In this program ellipse is the code for circle. You can then adjust the dimensions of your circle in your coding.

-I then added eyes to my project by adding more ellipses. Adding the different colours to your picture is easy, as you just use the fill code above the shape you want coloured.

-I then added a neck to my portrait. To add the neck, you must use a “rect(CENTER)” code to center your shape, and then you must copy and paste your code above your head shape. In the tutorial, this is explained as the shapes being stickers on a paper, so to layer them properly you must go in the right order for your picture.

-After changing my skin colour to a more Cookie Monster feel, I also added a mouth by cutting an ellipse in half. The coordinates that were provided in the video were giving me a strange shape, so I had to play around with my numbers to get a half circle.

-In this stage I was adding a nose, I don’t know exactly why my mouth became a line and my nose was only a half nose, but I liked the look so I didn’t bother to try and figure it out. (I guess I’m just a pro coder now?)

-The next step in the tutorial was to add eyebrows by creating straight lines. This did not go well for me at all. Again, I don’t really know what I was doing incorrectly, but when trying to create the eyebrows my lines would in all sorts of crazy directions so I decided to leave them out of my portrait.

-Removing the eyebrows created an error, and I thought I lost all my progress! I watched the tutorial and tried googling the issue but nothing was coming up. After staring at my screen trying to solve my problem, I realized that I accidentally removed a very crucial part of my picture, a curly end bracket! ( } ) After adding that back to the end of my code list, my project thankfully came back!

-This is my end result at the moment, but I plan to go back in and add some hair to my portrait!

Overall, I think that Hour of Code is a great resource for students that are interested in learning code. There are lots of options to peak everyone’s interests! Through this short tutorial I feel that I learned a lot of little tidbits about the ins and outs of code, as well as how cool it can actually be. Personally I don’t think this is a hobby that I would pick up as I found it a tiny bit tedious. I do think though that coding is an important skill for students to learn with the way our world is becoming more and more technology centred. It also opens a lot of doors for students to show what they know in a creative way!

Thanks for reading!