Clean Code using Function()

Week 4 | Assignment
Clean Code


Click on the Player to Drag & Drop anywhere on the field.

 

Apart from cleaning up the code via the use of function(), I also added and tweaked the sketch a little bit from last week. The added features are:

  1. Ball's movement trials.
  2. Player's movement trials.
  3. The ball now bounce within the field.

LEFT: Cleaner Code: https://alpha.editor.p5js.org/projects/ByRswwgA

RIGHT: Last Week (very long) Code: https://alpha.editor.p5js.org/projects/rkbsUwgC

 

I wonder if there is an easier way to attach or add .js files into the sketch.js file that I'm working on. From what I can tell p5 IDE cannot drag and drop file from a file in the IDE. In order for me to clean up a very long code from last week, I have to separate the player, the field, the ball into individual files, then downloaded them into my laptop, and then added these files back into a new sketch in the p5 IDE in the project-folder. Maybe, there is a way but I couldn't find it yet.

American Football

Week 3
Assignment

 

This week I was paired up with Grant to work on the homework together. I really enjoyed working with him! He tried to teach me the basic rules of American Football, but….. I still don’t really get it....

 

We agreed on that we should create something that we like and I overheard him talking about American Football a few times already so it was perfect because I’ve been obsessing with bubbles, ellipse() and bouncing balls since week 1.

 

I learned that using image() is very different than drawing ellipse() to bounce off the canvas, especially when I want it to spin too! rotate() and translate() is still pretty confusing to me, But, I eventually got it to work with the help of Wippy, the second year ITPers. However, the football (image file) still couldn’t bounce correctly…..

After we’ve combined our sketches, the result is AWESOME!!!

 

Elements

Looking at the code, I learned that there are a lot of elements needed to break down and drawn. Thank You Grant!!

  1. Ball
  2. Player
  3. Numbers
  4. Lines
  5. Endzones