Date post: | 26-Dec-2015 |
Category: |
Documents |
Upload: | alexina-mills |
View: | 216 times |
Download: | 1 times |
LCC 6310Computation as an Expressive Medium
LCC 6310Computation as an Expressive Medium
Lecture 1Lecture 1
OverviewOverview
• Go over the syllabusGo over the syllabus
• Brief introduction to me and my workBrief introduction to me and my work
• Art, programming and JavaArt, programming and Java
SyllabusSyllabus
BackgroundBackground
• Ph.D. in Computer SciencePh.D. in Computer Science• Expressive AI: Artificial Intelligence-based art and entertainment
• Worked in industrial research labs (Intel, Tektronix) Worked in industrial research labs (Intel, Tektronix) doing HCI researchdoing HCI research
• Expressive AI: AI-based art and entertainmentExpressive AI: AI-based art and entertainment
Some of my workSome of my work
Terminal Time – interactive video
FaçadeFaçade – interactive drama – interactive drama
Office Plant #1 – robotic sculpture
Some directionsSome directions
• I’m someone to chat with about…I’m someone to chat with about…• Interactive story (particularly procedural approaches)
• Robotic sculpture
• Video games (design, technology and culture)
• Director of the Experimental Game Lab
• Procedurally generative art
Introduce yourselves Introduce yourselves
Programming languagesProgramming languages
• Abstract, “human understandable” language for Abstract, “human understandable” language for telling computer what to dotelling computer what to do
• The abstract language must be translated into the low The abstract language must be translated into the low level language understood by the machinelevel language understood by the machine
• This translation is accomplished by an interpreter or This translation is accomplished by an interpreter or compilercompiler
• We will be learning the compiled language JavaWe will be learning the compiled language Java
A simple Java programA simple Java program
for (int i = 0; i < 10; i++) { println(i);
}
Just prints the numbers 0 to 9 on the screen
Human readable?!?
“Human readable” is relative“Human readable” is relative
Java compiler translates this into…
for (int i = 0; i < 10; i++) { println(i);
}
Java VM assembly codeJava VM assembly code
public static void main(java.lang.String[]); Code: 0: iconst_0 1: istore_1 2: goto 30 5: getstatic 8: new 11: dup 12: ldc 14: invokespecial #23 17: iload_1 18: invokevirtual #27 21: invokevirtual #31
24: invokevirtual #34 27: iinc 1, 1 30: iload_1 31: bipush 10 33: if_icmplt 5 36: return
test.PrintLoop(); Code: 0: aload_0 1: invokespecial #43; 4: return
Object Oriented vs. Procedural LanguagesObject Oriented vs. Procedural Languages
Procedural (e.g. C)Procedural (e.g. C)• We create some data
representing an image (array of pixels to draw on the screen)
• We write a procedure than can be passed the image and will draw it
Object Oriented (e.g. Java)Object Oriented (e.g. Java)• We create a class that
contains an image AND a routine draw it
• The data and the behavior (ability to draw) are in one "container"
A couple of Java’s relativesA couple of Java’s relatives
• Smalltalk 80Smalltalk 80• Alan Kay and the Dynabook (PARC)
• C++C++• Managing big C programs: Bjarne Stroustrup
JavaJava
• Designers started with C++Designers started with C++• Smaller
• Simpler
• Safer
• Programming embedded systemsProgramming embedded systems• Toasters, microwave ovens, TV set top boxes
• Reliability very important--avoid costly recalls
• Web programmingWeb programming• Incorporated into web browsers at critical moment
The virtual machineThe virtual machine
• Since Java was designed to run on embedded Since Java was designed to run on embedded systems, it was designed around a systems, it was designed around a virtual virtual machinemachine• “Write once, run everywhere”
x86
Windows OS X
G3/4/5 ProcessorPhone OS
Java VM Java VM Java VM
Java VM
“Java OS”
PC Mac Cell Phone
Java Machine
But we’re using ProcessingBut we’re using Processing
• Processing is built on top of JavaProcessing is built on top of Java
• Supports script-like codingSupports script-like coding
• Easy to get simple programs up fast
• But allows transition to full Java programming
• Has built-in methods and classes to make drawing Has built-in methods and classes to make drawing easyeasy
• Easy to export program to appletEasy to export program to applet
Drawing in ProcessingDrawing in Processing
• Automatic creation of display windowAutomatic creation of display window
• Window has a coordinate system for drawingWindow has a coordinate system for drawing
x
y
0 50 1000
50
100
Let’s draw a point: point()Let’s draw a point: point()
• point(x, y) – draws a point at the location x, ypoint(x, y) – draws a point at the location x, y
• Let’s try it: point(50, 50)Let’s try it: point(50, 50)
Unexpected token: null – what the #@#$ !?!Unexpected token: null – what the #@#$ !?!
• Compiler errors appear in the bottom paneCompiler errors appear in the bottom pane
All lines must be terminated with a semicolon ;All lines must be terminated with a semicolon ;
Drawing several pointsDrawing several points
point(30, 20); point(30, 20);
point(85, 20); point(85, 20);
point(85, 75); point(85, 75);
point(30, 75); point(30, 75);
CommentsComments
• Comments are non-program text you put in the file to describe to Comments are non-program text you put in the file to describe to others (and yourself) what you’re doingothers (and yourself) what you’re doing
• Important for being able to look back at your code and Important for being able to look back at your code and understand itunderstand it
• Single-line comments begin with Single-line comments begin with ////
• Multi-line comments begin with Multi-line comments begin with /*/* and end with and end with */*/
Commenting and uncommenting lines useful for figuring Commenting and uncommenting lines useful for figuring out code out code
Drawing shapes: some primitivesDrawing shapes: some primitives
• line(x, y)line(x, y)
• triangle(x1, y1, x2, y2, x3, y3)triangle(x1, y1, x2, y2, x3, y3)
• rect(x, y, width, height)rect(x, y, width, height)• rectMode() – CORNER, CENTER_DIAMETER, CORNERS
• elipse(x, y, width, height)elipse(x, y, width, height)• ellipseMode() – CORNER, CENTER_DIAMETER, CORNERS,
CENTER_RADIUS
Controlling color and lineControlling color and line
• Colors represented as Red Green Blue (RGB) valuesColors represented as Red Green Blue (RGB) values• Each one ranges from 0 to 255• Can also use Hue Saturation Value (HSV) space, but we won’t worry about this for now
• background(R, G, B) – set the background colorbackground(R, G, B) – set the background color
• stroke(R, G, B) – set the colors of the outline (default black)stroke(R, G, B) – set the colors of the outline (default black)• noStroke() – no outline drawing around shapes
• fill(R, G, B) – set the fill color for shapes (default white)fill(R, G, B) – set the fill color for shapes (default white)• noFill() – don’t fill the shapes (background shows through)
• strokeWeight(w) – line width for outlines (default 1)strokeWeight(w) – line width for outlines (default 1)
Playing aroundPlaying around
• To learn how to program it is necessary to To learn how to program it is necessary to play around with code!!!play around with code!!!• Don’t just wait for me to show you things
• Processing makes this easyProcessing makes this easy• Use the Reference in the Help menu
• Play with the examples
Saving your workSaving your work
• You should install Processing on your own You should install Processing on your own machine machine • Do this for Thursday
• Processing saves all projects in a default Processing saves all projects in a default directory – no way to change itdirectory – no way to change it• This means that you should always copy your code to your
local disk
• Don’t depend on your project remaining undisturbed on lab machines