Author: Mang

Week 1 – Amazing Mangportrait

Amazing writing answering all the prompts.

 

This code for the circles is amazing:

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
fill(color(x, y, x+y)); // Set the fill color based on the position
ellipse(x, y, x, 80);
fill(color(x, y, x+y)); // Set the fill color based on the position ellipse(x, y, x, 80);
fill(color(x, y, x+y)); // Set the fill color based on the position
ellipse(x, y, x, 80);

In future I would use diagonal lines to represent my dynamic spirit.

Week 1 – Self-portrait

Concept

 

 

Code snippet

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
// Declare in the global scope
// All functions will have access to this variable
let myRandomNumber;
function setup() {
createCanvas(300, 400);
myRandomNumber = random(255); // How can we find out what a variable's value is? print()
let myRoundedNumber = round(myRandomNumber);
print('myRandomNumber = ' + myRandomNumber);
print('myRoundedNumber = ' + myRoundedNumber);
}
// Declare in the global scope // All functions will have access to this variable let myRandomNumber; function setup() { createCanvas(300, 400); myRandomNumber = random(255); // How can we find out what a variable's value is? print() let myRoundedNumber = round(myRandomNumber); print('myRandomNumber = ' + myRandomNumber); print('myRoundedNumber = ' + myRoundedNumber); }
// Declare in the global scope
// All functions will have access to this variable
let myRandomNumber;


function setup() {
  createCanvas(300, 400);
  
  myRandomNumber = random(255); // How can we find out what a variable's value is? print()

  let myRoundedNumber = round(myRandomNumber); 
  
  print('myRandomNumber = ' + myRandomNumber);
  print('myRoundedNumber = ' + myRoundedNumber);

  
}

 

Self-portrait as a young robot

Concept

For my digital self-portrait I tried to represent my inner robot.

Code

The drawing consists of simple shapes that use a mix of manual and calculated coordinates.

The location of the mouth is automatically calculated to be horizontally centered and 3/4 of the way down the canvas. The code uses variables that allow the size of the mouth rectangle to be easily changed and the position will be automatically recalculated.

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
// Set the mouth width and height
let rectangleWidth = 150;
let rectangleHeight = 90;
{...}
// Draw a centered rectangle
rect((width / 2) - (rectangleWidth / 2), height * 0.75 - rectangleHeight / 2, rectangleWidth, rectangleHeight);
// Set the mouth width and height let rectangleWidth = 150; let rectangleHeight = 90; {...} // Draw a centered rectangle rect((width / 2) - (rectangleWidth / 2), height * 0.75 - rectangleHeight / 2, rectangleWidth, rectangleHeight);
// Set the mouth width and height
let rectangleWidth = 150;
let rectangleHeight = 90;

{...}

// Draw a centered rectangle
rect((width / 2) - (rectangleWidth / 2), height * 0.75 - rectangleHeight / 2, rectangleWidth, rectangleHeight);

Completed self-portrait:

Reflection / Future Work

The robot expresses my inner coder. In future I would like to add animated laser beams shooting from the eyes that automatically track the mouse cursor.