• Warmup activity
• Review camera software
• Sound
  • String data type
  • String methods
    • charAt()
    • length()
    • change case with toUpperCase() or toLowerCase()
    • equals()
    • Combining Strings aka Concatenation
  • Display text onscreen
    • The general process:
    • Example Using a system font
    • Example Using a custom (downloaded) font
    • Text properties
  • Importing Data
    • Importing a text file
• Final Project
  • Your final project should have a separate document page with the following
  • Your code must:
  • Your final project design must:
• Homework
  • Final Project proposal
  • Write your first weekly log file

Today:

• checkin
• warmup
• Sound library
• Strings and Fonts
• Intro final project
• Other Languages
• Next week: 3d

Warmup activity

Review camera software

We’re not going to review everyone’s but just a few examples of different kinds of camera software.

• Heavan’s Vintage Star Camera
• Anthony’s Big Pixels Cam
• Michael’s Phat YoshiCam
• Sean’s Magical Ever-Shifting GridCam

Sound

To play audio, we can use the Processing Sound library.

import processing.sound.*;

SoundFile song;

void setup(){
  size(200,200);
  song = new SoundFile(this, "song.mp3");
  song.play();
}

void draw(){
}

void mousePressed(){
 if (song.isPlaying()){
   song.pause();
 } else {
   song.play(); 
 }
}

String data type

This semester we’ve already used text in a few basic ways using the text() built-in function.

We’ve also printed text to the console using the println() and print() functions.

Processing also comes with a built-in data type called String. Unlike int, boolean, and float for example, String is built out of a class, thus it is capitalized. Other similar data types that are built from classes are Capture and Movie.

String is not just from Processing. It comes from the underlying Java language, so you can find documentation

More info on String in the Processing reference. You could also look at the extensive Java reference for String for a glimpse into the wider world of Java.

A string is an array of characters. It is defined in a String class. Since we’ve worked with and created classes we know that means we can create individual string objects, and that objects have defined methods.

String methods

There are a number of built-in methods for working with Strings.
Here are a few:

charAt()

String name = "Purchase College";
char c = name.charAt(0);
print(c);

length()

Don’t confuse this with the length property of an array. When you want the length of a String object you must use the parenthesis since it is a method.

String name = "Purchase College";
print(name.length());

change case with toUpperCase() or toLowerCase()

String name = "Purchase College";
println(name.toUpperCase());
println(name.toLowerCase());

equals()

Technically, a String object’s name references a location in memory. When we use a String name in our code and then compile and run the code, Processing looks up what is stored in memory at that location. Depending on how a String was created, it’s possible that two strings that look the same might actually not come up as equivalent if we compare using our standard == comparator. For this reason, it’s best practice to use the equals() method.

Example:

String greeting1 = "Hi";
String greeting2 = "Hola";
String greeting3 = "Hi";

println(greeting1.equals(greeting2);
println(greeting1.equals(greeting3);

Combining Strings aka Concatenation

It’s quite easy to combine two strings.

String message = "Hi";
String name = "Raoul";
println(message + " " + name);

Display text onscreen

You must start with a font. You have two choices:

• Use a system font that all computers have (Helvetica, Arial)
• OR use a custom font

The general process:

To show text on screen you must render it in pixels.

1. Create a global PFont you can use to store the font in memory.
2. Use createFont() to specify the specific font and size. This is usually done in setup() as it only should happen once.
3. Somewhere in your sketch, specify that you want to display that font with textFont()
4. Specify a fill() color for displaying your text onscreen.
5. Use the text() function, specifying the String, x and y positions. It is helpful to have a background color in order to make your text more crisp.

Example Using a system font

PFont f;

void setup(){
  size(400,400);
  //use a system font
  f = createFont("Helvetica", 18);
}

void draw(){
  fill(0);
  textFont(f, 18);
  text("The quick brown fox jumped over the lazy dog.", 50, 100);
}

Example Using a custom (downloaded) font

Processing uses a font format called vlw to load and display custom bitmapped fonts. A bitmapped font is a font rendered into pixels. The process is to place a custom/special font in your sketch’s data folder. This would also let you package up a sketch with a custom font and send to another person who might not have that font installed. The easiest way to do this is to use the Create Font tool in the Tools > Create Font… menu. This will let you select a font installed on your machine to be package with your sketch.

Now that you’ve added in a custom font file, you can use loadFont() to load and use it in your sketch.

PFont f

void setup(){
  size(400,400);
  f = loadFont("ZXX-18.vlw");
}

void draw(){
  fill(0);
  textFont(f, 18);
  text("The sky above the port was the color of television, tuned to a dead channel", 50, 100);
}

Text properties

textAlign() - You can specify the alignment of text when it’s drawn. Options: LEFT, RIGHT, CENTER.

Importing Data

Importing a text file

String[] lines = loadStrings("filename.txt");
println("There are "+lines.length+" lines of text.");
for (int i = 0; i < lines.length; i++){
  println(lines[i]);
}

In-class exercise: Star Wars crawl text

Final Project

Our assignments so far have been fairly restrictive. For your final project, I want to open up the field for you to create a project of your choice. The project should use skills and tools we developed this semester. You may create a new project, or build off of another program from earlier in the semester. Your final project could be a tool, game, visualization, animation, interactive artwork or other software project.

So far in this course we have covered:

• variables and types
• loops
• conditionals
• functions
• arrays
• the debugging process
• classes and objects
• history of computation and binary and machine code
• algorithms
• 3D Space, translation, rotation
• lighting and 3d objects
• working with libraries: live capture, video and sound
• manipulating the pixel array
• working with images
• Strings and fonts

Consider these elements in the creation of your own work for the final project.

Your final project should have a separate document page with the following

1. Final Project title
2. 1 paragraph description
3. 1 page about your project
   • What was your approach or strategy did you take in creating your project?
   • How does someone use your software?
   • What libraries, tools or other resources did you use, if any?
   • Notes about challenges when working on the projects. What barriers did you run into and how did you solve it?
4. Include your weekly log files.
5. Include at least 3 screenshots of your project running, including opening screen, while the program is running, and potentially a final page. Add your help page or any other pages.

Your code must:

• be clear and organized
• use comments to make sections and particular parts of your code clear
• work without bugs
• work properly in fullscreen

Your final project design must:

• Be a compelling and interesting program made with code
• Properly cite any code that you found and used online
• Create a compelling interactive work synthesizing both concept and technical execution
• Have an info page, which could be on a landing page/start page, or be a separate page
• Have clear indicated instructions for interaction (visual keys or a help/info page)
• Have a way to reset and start the sketch over again

Homework

Read Chapter 17, text

Read Chapter 20, sound

Final Project proposal

Review the requirements for your final project.

1. Post a proposal for your final project. What is the concept? What tools or resources will you use? Give specifics. Respond to any questions.

Write your first weekly log file

For the first weekly log file, write the following:

1. Write out in pseudocode the flow of your program. If it helps, draw a flowchart that shows your software and any interactivity. What happens first? What happens next, and in what order? Where do branching choices occur?
2. What questions do you have? What are you concerned about?
3. How will you get started?