CS1335 Java and Processing
  • CS 1335 Computer Science 1
  • Getting Started
    • Processing IDE
    • Java vs Javascript
    • Review: Processing, Functions
    • HSB Color Mode
      • HSB Color Wheel
        • Example Code
      • HSB Color Palette Tool
    • Recursion
      • Recursion Call-Stack
      • Example Code
        • Example Code Feb 5 S20
        • Feb 12 Code
  • Project 1
    • Subjective Modeling of Emotions
    • Emotions represented using color, form, space
      • Kandinsky Color - Emotion
      • Emotional Intelligence
    • Project 1: PShapes
      • Example Code
      • Inspiration
    • PShape with Cutout - Inner Contour
    • VertexShape - Recursion
    • Project 1: Recursive Drawing
    • Project 1: Programmatic Variations in Color
      • Recursion with rotate, scale
      • Plan Region Size, Color
    • Map Function
    • Transforms for Mirroring
    • Project1-Steps
  • Grid Based Designs
    • Computational Design
      • Generative Design
    • Artist: Victor Vasarely
    • Grid Pattern Design
    • 1D - Array of PShapes for Grid Layout
      • Truchet Tiling
      • Example Code
    • PShapes in Grid Regions
    • Grid Region Logic
    • Pattern Preview - Transforms: Translate & Scale
  • Project 2
    • Project 2 - 2D Arrays for Gradient Logic
      • 2D Array Grid with Labels
    • Grid Patterns using 2D Array Indexes: i, j
      • Example Class Code
    • lerpColor( ) and map( ) Functions
    • Demo Lerp Colors
    • 2D Arrays with lerpColor
    • Create PShape 2D Array
    • Function: Populate2DArray( )
    • Function: DisplayShapeMatrix()
    • Transforms for Position, Rotation, Scale of ShapeMatrix Elements
    • Project 2 - Steps
    • Animation for ShapeMatrix
      • Animation w/Noise
  • Object Oriented Programming
    • Introduction to Objects
    • OOP vs Data-Flow
    • Button States
    • Buttons as Objects
      • Button Class
    • Create Object Instances
    • Button Types
    • Modeling Buttons: States and Events
    • OOP - Inheritance
    • OOP - Polymorphism
    • Child-Class: PImageButton
    • PShape - SVG Objects
    • Menu of Buttons
    • ButtonGroup - Final Version
    • Slider Controller
    • UML Class Diagram
  • Project 3
    • Project 3 - Logic, Steps
    • Example Code S20
      • Code Wed Apr 1
      • Code Wed Apr 8 v1
      • Code Wed Apr 8 v2
      • Code Mon Apr 13
      • Code Wed Apr 15
      • Code Mon Apr 20
      • Code Wed Apr 22
      • Code Mon Apr 27
      • Code Wed Apr 29
    • Project 3 - Class Definitions
      • Button
      • PImageButton
      • ButtonGroup
      • Pattern
        • PShapes - SVG, Vertex Shapes
        • Setting Colors For Patterns
        • Pattern - With Child-PShapes
      • Slider
      • Particles
  • Java Syntax
    • Java Syntax
      • Typed-Variables
      • Float - Integer Conversion Errors
      • Modulus
      • Functions
      • Object Reference Data Types
      • Arrays
        • Class Example Code
      • Switch-Case Statement
      • Ternary Operator
      • Class
      • Learning Science
    • UML Class Diagram
    • Glossary
  • Resources and References
    • Resources
    • Random Inspiration
      • Ulm School
      • Heart-Mind, Mind, Body
      • Statistical Uncertainty
Powered by GitBook
On this page

Was this helpful?

  1. Project 1

Project1-Steps

PreviousTransforms for MirroringNextComputational Design

Last updated 5 years ago

Was this helpful?

  1. Conceptual Art to Express Emotion / Energy

Step 1: Determine Emotions to express:

See , ,

Create Personal Situation Concept Map Select a personal situation that has an associated range of positive and negative emotions. Sketch a concept-map to brainstorm the concepts and emotions associated with your situation.

  • Divide your concept-map sketch into 2 regions: Negative, Positive

  • Put 'Situation' as the center concept ( no need to provide specific details about situation )

  • Add associated concepts to negative or positive sides

  • Add emotions to each side, position the emotions to indicate the strength of emotion - with the strongest emotions located at the outer edges of the regions, neutral emotions near the central dividing line

  • Result: Select at least 5 emotions to represent in your artwork, list these along the bottom of your concept map.

  • Complete Project Planning Document

    • Tables:

      • Define variables:

        • colors ( minimum of 3 custom colors required )

        • Pshape length ranges (minLen, maxLen)

      • Main Emotions: ordered list of 5 emotions

      • Determine Design Attributes

        • map function parameters for values on both sides of the negative / positive regions: how do values change as mouseX changes?

  • Use planning document as a guide to complete the logic to determine input parameters the RecursivePattern functions, for each region, negative, positive.

    • Negative - region: 0 < mouseX < balancePoint

    • Positive - region: balancePoint < mouseX < width

  • RecursivePattern function parameters: are determined in the draw( ) function, depending region and mouseX value:

//recursivePattern functions with parameters
void recursivePattern1(float len, int count, color c1  )
void recursivePattern2(float len, int count , color c1 )

These are the main customizations you will do for this project

float len - determined by region and mouseX

  • use map( ) to determine len for each region

float len = map( mouseX, 0, balancePoint, maxLen, minLen); // negative region

  • you must determine logic for positive region

color c1, color cMain - determined by region and mouseX

  • use map( ) to determine gradientFraction

float gradientFraction = map( mouseX, 0, balancePoint, 0.0, 1.0); // negative region

  • use colorLerp( ), gradientFraction to determine color for current MouseX position

color curNegColor = colorLerp( colorMax, colorMin, gradientFraction); // negative region

  • you must determine logic for positive region

  • determine probability for random pop of color, this can be set for each region, or can vary within each region using map( ) to set value of float randPopColor

    float randPopColor = map( mouseX, 0, balancePoint, 0.3, 0.6); //negative region example

int count - recursion termination variable use map( ) to vary this value as mouseX changes (optional), or it can be constant across both ranges

float numRepeats = map( mouseX, 0, balancePoint, 8, 4); //negative region example

RecursivePattern Functions: You will have 2 different ones

 **Modify Brightness within the RecursivePattern functions:**

 - you must modify brightness
     float brightFraction = map( len, lenMin, lenMax, 0.5, 1.0); //example
     float bright = brightness( c1 ) * brightFraction;
  • you can add small variation in hue

      float hue = hue( c1 ) + random( -5,5);  ///add or subtract small amount to get analogous colors

Recursive Function Call

  • You must modify count for each recursive call, this can be done when setting the input parameters as below.

    You will modify len for each recursive call because we are creating nested shapes, multiply by a fractional value.

      //Recursive call within Recursive Function - must modify count, len values;
     RecursivePattern( len * 0.8,  count-1, c1 ); //reduce values: len, count
Models of Emotion:
Concept Maps
Mental Models