codexdesign

code and design experiences for beginners

Visual Design Elements ( java )

code notes: Visual Design Elements introduces code for controlling the size of the composition and code for making points, lines, ellipses, rects, quads, triangles, polygons, and curves. Code for controlling the background color, shape strokes and fills, layering of elements, and shape transformations is also introduced.

design notes: Visual Design Elements introduces code for making shapes and designing static compositions.

design card

code: size function
element: composition space

design card

code: point function
element: point

design card

code: line function
element: line

design card

code: ellipse function
element: ellipse, circle

design card

code: rect function
element: rectangle, square

design card

code: quad function
element: 4-sided shape

design card

code: triangle function
element: 3-sided shape

design card

code: beginShape, vertex, endShape functions
element: polygon

design card

code: arc function, using radians or PI parameters
element: curve arc

design card

code: curve function
element: curve line

design card

code: beginShape, curveVertex, endShape functions
element: curve polygon

design card

code: noFill function
element: attribute, no fill

design card

code: fill, noFill functions, with grayscale parameters
element: attribute, fill, noFill

design card

code: fill, noFill functions, with grayscale parameters, and influence
element: attribute, fill, noFill

design card

code: noStroke function
element: attribute, no stroke

design card

code: noStroke, stroke, strokeWeight functions
element: attribute, stroke thickness

design card

code: strokeCap function
element: edge style

design card

code: strokeJoin function
element: joint style

design card

code: stacking order of code
element: layering elements

design card

code: stacking order of code
element: layering elements

design card

code: background function
element: layering elements

design card

code: background function
element: layering elements

design card

code: scale function
element: transformation

design card

code: rotate function
element: transformation

design card

code: translate function
element: transformation

design card

code: translate, rotate functions
element: transformation

design card

code: resetMatrix function
element: transformation

design card

code: pushMatrix, popMatrix functions
element: transformation