As mentioned a class typically consists of method definitions and various fields (which we also refer to as member variables) that store information about the current state of the object instantiated from the class. The term fields refers to variables that are members of a particular class, and as a result are encapsulated data that store information about the object itself and are sometimes referred to in Processing as class data.
Typically in Processing creating a class is a four step process that involves,

1. Class Name creation
2. Field declarations
3. Constructor creation
4. Method definitions

The structure of a class looks similar to setup() and draw() and user defined functions, but since a class is not a function, but may contain many functions (called methods) it’s name is not followed by parenthesis. An object variable name which we will have a look at shortly, on the other hand is followed by parenthesis in order to provide a means of communicating with the object’s internal structure.

void setup(){
}
void draw(){
}
class ClassName{
}

As you can see a class definition usually finds it’s place at the very end of a sketch, this is sometimes referred to as an in-line class definition. This simply emphasizes that the class is directly related to the sketch that it is defined within. As defining a class at the end of a sketch, after user defined functions, mouse and keyboard functions etc can create a cluttered looking sketch Processing also provides us with Tabs in which we can place additional code that will be compiled with the sketch we are currently working on. You can create a new tab by clicking the arrow pointing to the right on the far right of the PDE and a fly-off menu relating to Tabs will appear.

The Tab fly-off menu from the PDE

Processing will then ask you to provide a name for the new tab.

Creating a new Tab

Once you supply a unique name and click OK Processing will create a new blank Tab next to the original Tab. What has actually happened is that Processing has created a new .pde file that has the name you specified for the Tab that was just created. This new .pde file resides in the same location as the sketch you are currently working on, as a result it can access anything in the data folder that you can access from the code of the original Tab. Although Processing has created another .pde file this file is only part of a sketch. In a similar way that the original pde file can be reliant on the contents of the data folder, the new .pde file in the same location as the original .pde file can also be reliant on the original .pde and the contents of the data folder. As a result we refer to this collection of elements (i.e. pde files, txt files, spreadsheets, images and anything else that is in the data folder used in the sketch) collectively as the contents or components of a sketch.
Using additional Tabs in a sketch provides us with a convenient location for placing classes. This is useful because it emphasizes the modular design of classes and clears the main .pde file from becoming over-cluttered with code. Working with additional tabs is not synonymous to working with multiple sketches. Multiple tabs are a means of breaking up the current sketch you are working on into smaller manageable portions of code. As a result when a sketch with multiple Tabs is run all the code within all the Tabs of that sketch are compiled together. This means that only one of the Tabs should have setup() and draw() structures, the other Tabs should be used for class definitions, user defined functions or other elements of a sketch that exist outside of setup() and draw() structures.

Car Example
Type the following code into a new Processing sketch:

Car myCar;
Car myCar2;

void setup() {
 size(600,600);
 myCar = new Car(color(255,0,0), 100, random(height),random(10));
 myCar2 = new Car(color(random(255),0,0), 100, random(height) ,random(10));
}

void draw() {
 background(255);
 myCar.drive();
 myCar.display();
 myCar2.drive();
 myCar2.display();
}

Car Class
Now make a new Tab as explained above and type the Class in

class Car {
 color c;
 float xPos;
 float yPos;
 float xSpeed;

Car(color tempC, float tempXpos, float tempYpos, float tempXspeed) {
   c = tempC;
   xPos = tempXpos;
   yPos = tempYpos;
   xSpeed = tempXspeed;
 }

  void display() {
  rectMode(CENTER);
  fill(c);
  rect(xPos, yPos, 20, 10);
  fill(0);
  ellipse((xPos -5 ), (yPos +3), 8,8);
  ellipse((xPos +7), (yPos +3), 8,8);
  fill(255,255,255);
  rect((xPos -4), (yPos -10),13,9);
  fill(0);
 rect((xPos -3), (yPos -10) ,4,4);
 fill(255,255,255);
 rect((xPos-12), (yPos-0),3,3);
}

void drive() {
  xPos = xPos + xSpeed;
  if (xPos > width) {
    xPos = 0;
  }
 }
}

// width) {
xPos = 0;
}
}
}
// ]]>