Tuesday, June 20, 2017

The Hour of Code

We worked with the program khanacademy.com, that is an online academy that helps you with different subject like maths, Science, Computing, etc. We learned how to make several figures like circles, rectangles, triangles, etc. We were able to "draw" things like a snowman, a penguin and a face with some simple codes. The first code we learned was: ellipse( x, y, w, h );
The x means were the circle is the coordinate of the center (up and down )The Y means the coordinate of the center (right and left) The W means "width" (the width of the ellpise) and the h means "height" ( the height of the ellipse), If you wanna learn more codes like this one, you should try Khan Academy,it is really easy to use and to learn so I hope you use it someday. 











This is the logo of the academy.







The fist step of ¨Drawing with code¨ is a video that teaches you how to make a circule with the command ellipseIn this case the girl , Pamela, used ellipse() because it's the simplest way to draw a human face. She could have used rect() if she wanted to draw something more like a robot face.

The reason there is no circle() is because you can always draw an exact circle by specifying the exact same width and height with ellipse().So ellipse() serves the same purpose as a circle() function would.


When you are almost finished with "the hour of code", you can choose between three different projects to draw on your own, a snowman, a self-portrait or a wild animal. We both choose the snowman project. One of the most important concept is how to add colors to the figure you're drawing, the code for this is: fill(r, g, b); , you can also add color to the background by using: background(r, g, b); , one of the first things they teach you is that the background code must be in the number 1 or in the beginning of everthing. This is basically all the codes we used to draw this snowman, but we'll show you how we did the self-portrait (for example):




The first code you see is //hair is just so you can remember for what are the codes below because at the end there are so any that you can't remember for what is which,(same with //face, //left eye and etc). The follow one is noStroke(); and we use this so the image has no stroke, before I continue telling you this, it's important to remind you that the ; is of major importance. The next code is rect(x, y, w, h); , we use this to draw a rectangle and we control everthing like the height, the width, etc with the different coordinates inside the gap. The rest is what we already explained.









Candela E and Ma.Elisa G




No comments:

Post a Comment