Processing 2: Creative Programming Cookbook

Table of Contents

Processing 2: Creative Programming Cookbook

Credits

About the Author

About the Reviewers

www.PacktPub.com

Support files, eBooks, discount offers and more

Why Subscribe?

Free Access for Packt account holders

Preface

What this book covers

What you need for this book

Who this book is for

Conventions

Reader feedback

Customer support

Downloading the example code

Errata

Piracy

Questions

1. Getting Started with Processing 2

Introduction

Installing Processing on your computer

Getting ready

How to do it...

How it works...

There's more...

Exploring the Processing Development Environment

How to do it...

How it works...

Installing libraries

Getting ready

How to do it...

How it works...

Installing tools

Getting ready

How to do it...

How it works...

Switching modes

Getting ready

How to do it...

How it works...

See also

Understanding the coordinate system

Getting ready

How to do it...

How it works...

Writing your first Processing sketch

Getting ready

How to do it...

How it works...

There's more...

Using math functions

Getting ready

How to do it...

How it works...

There's more...

Responding to mouse events

How to do it...

How it works...

Responding to keyboard events

How to do it...

How it works...

There's more...

2. Drawing Text, Curves, and Shapes in 2D

Introduction

Drawing basic shapes

How to do it...

How it works...

Working with colors

How to do it...

How it works...

There's more...

See also

Working with images

Getting ready

How to do it...

How it works...

There's more...

Drawing text

Getting ready

How to do it...

How it works...

Drawing curves

How to do it...

How it works...

Calculating points on a curve

How to do it...

How it works...

Drawing custom shapes

How to do it...

How it works...

There's more...

Manipulating SVG files

Getting ready

How to do it...

How it works...

There's more...

Offscreen drawing

How to do it...

How it works...

There's more...

3. Drawing in 3D–Lights, Camera, and Action!

Introduction

Understanding 3D space

How to do it...

How it works...

Drawing 3D primitives

How to do it...

How it works...

There's more...

Using lights

How to do it...

How it works...

Making polygon soup

How to do it...

How it works...

There's more...

Mixing 2D and 3D objects

How to do it...

How it works...

Drawing triangle and quad strips

How to do it...

How it works...

Using textures

Getting ready

How to do it...

How it works...

Using the 3D camera

How to do it...

How it works...

There's more...

4. Working with Data

Introduction

Loading text files from the hard drive

Getting ready

How to do it...

How it works...

Parsing CSV

How to do it...

How it works...

There's more...

Parsing XML

How to do it...

How it works...

Converting datatypes

How to do it...

How it works...

Working with Strings

How to do it...

How it works...

Working with arrays

How to do it...

How it works...

Working with ArrayLists

How to do it...

How it works...

There's more...

Working with HashMaps

How to do it...

How it works...

5. Exporting from Processing

Introduction

Saving images

How to do it...

How it works...

Exporting applications

How to do it...

How it works...

Saving PDF files

How to do it...

How it works...

There's more...

Calculating PDF sizes

How to do it...

How it works...

Saving text files

How to do it...

How it works...

Exporting 3D files

How to do it...

How it works...

There's more...

Saving binary files

How to do it...

How it works...

There's more...

6. Working with Video

Introduction

Playing a video

Getting ready

How to do it...

How it works...

Exporting image sequences

How to do it...

How it works...

Manipulating pixels in a video

How to do it...

How it works...

Using filters

How to do it...

How it works...

Controlling the speed of a video

How to do it...

How it works...

Jumping to a specific frame

How to do it...

How it works...

Blending video

How to do it...

How it works...

7. Audio Visualization

Introduction

Importing the Minim library

How to do it...

How it works...

Playing audio files

Getting ready

How to do it...

How it works...

Using live audio

How to do it...

How it works...

Drawing a waveform

How to do it...

How it works...

Using Fast Fourier Transforms

How to do it...

How it works...

Audio reactive particles

How to do it...

How it works...

Creating a drum machine

How to do it...

How it works...

Creating a synthesizer

How to do it...

How it works...

Using effects

How to do it...

How it works...

8. Exploring Computer Vision

Introduction

Using a webcam

How to do it...

How it works...

Thresholding video

How to do it...

How it works...

Blob tracking

How to do it...

How it works...

Color tracking

How to do it...

How it works...

Installing the OpenCV library

How to do it...

How it works...

There's more...

Accessing a webcam with OpenCV

How to do it...

How it works...

Face detection with OpenCV

How to do it...

How it works...

Defining the region of interest with OpenCV

How to do it...

How it works...

Manipulating video with OpenCV

How to do it...

How it works...

9. Exploring JavaScript Mode

Introduction

Creating your first Processing sketch for the Web

Getting ready

How to do it...

How it works...

There's more...

Creating a custom HTML template

Getting ready

How to do it...

How it works...

Working with fonts

Getting ready

How to do it...

How it works...

There's more...

Working with images/SVG files

Getting ready

How to do it...

How it works...

There's more...

Creating 3D sketches for the Web

How to do it...

How it works...

Using Processing.js without the Processing editor

Getting ready

How to do it...

How it works...

Writing sketches with JavaScript

How to do it...

How it works...

Using Processing.js with jQuery

Getting ready

How to do it...

How it works...

Getting started with the Toxiclibs.js library

Getting ready

How to do it...

How it works...

10. Exploring Android Mode

Introduction

Installing the Android SDK

How to do it...

How it works...

Running your sketch in the Android Emulator

How to do it...

How it works...

Running your sketch on an Android device

How to do it...

How it works...

Accessing screen size and density

Getting ready

How to do it...

How it works...

Responding to touch interaction

How to do it...

How it works...

There's more...

Using the accelerometer

Getting ready

How to do it...

How it works...

There's more…

Using the GPS

Getting ready

How to do it...

How it works...

There's more...

Creating 3D sketches on Android

How to do it...

How it works...

Adding an icon to your Android App

How to do it...

How it works...

11. Using Processing with Other Editors

Introduction

Installing Eclipse

Getting ready

How to do it...

How it works...

Installing the Processing plugin for Eclipse

How to do it...

How it works...

There's more…

Write your first sketch with the Processing Eclipse plugin

How to do it...

How it works...

There's more...

Installing the Processing library template in Eclipse

Getting ready

How to do it...

How it works...

Writing Processing libraries

Getting ready

How to do it...

How it works...

Installing the Processing tool template

Getting ready

How to do it...

How it works...

Writing Processing tools

Getting ready

How to do it...

How it works...

Using Processing with IntelliJ IDEA

Getting ready

How to do it...

How it works...

Index

Processing 2: Creative Programming Cookbook

Processing 2: Creative Programming Cookbook

Copyright © 2012 Packt Publishing

All rights reserved. No part of this book may be reproduced, stored in a retrieval system, or transmitted in any form or by any means, without the prior written permission of the publisher, except in the case of brief quotations embedded in critical articles or reviews.

Every effort has been made in the preparation of this book to ensure the accuracy of the information presented. However, the information contained in this book is sold without warranty, either express or implied. Neither the author, nor Packt Publishing, and its dealers and distributors will be held liable for any damages caused or alleged to be caused directly or indirectly by this book.

Packt Publishing has endeavored to provide trademark information about all of the companies and products mentioned in this book by the appropriate use of capitals. However, Packt Publishing cannot guarantee the accuracy of this information.

First published: September 2012

Production Reference: 1100912

Published by Packt Publishing Ltd.

Livery Place

35 Livery Street

Birmingham B3 2PB, UK.

ISBN 978-1-849517-94-2

www.packtpub.com

Cover Image by Jan Vantomme (http://www.cloudswimmers.com/)

Credits

Author

Jan Vantomme

Reviewers

Dr. Bryan, Wai-ching CHUNG

Frederik Vanhoutte

Acquisition Editor

Kartikey Pandey

Lead Technical Editor

Kedar Bhat

Technical Editors

Madhuri Das

Kirti Pujari

Copy Editor

Brandt D'Mello

Project Coordinator

Yashodhan Dere

Proofreader

Mario Cecere

Indexer

Hemangini Bari

Production Coordinator

Arvindkumar Gupta

Cover Work

Arvindkumar Gupta

About the Author

Jan Vantomme is a computational designer and artist based in Ghent, Belgium. He runs Cloudswimmers, a small studio with a focus on computational and interaction design. Jan has been using Processing since the early beta versions. He taught the subject at a university college both as faculty staff and as a guest professor. He wrote some Processing libraries to work with colors and shapes in an easy way. Jan also co-founded Processing Ghent, a community for creative coders in Belgium. They organize free lectures and workshops on Processing.

Over the past few years, I've grown a lot as an artist and as a programmer. Without Processing and its amazing community, this book wouldn't have been possible. I'd like to thank the people I've learned from and those who inspired and supported me. Here they are, in no particular order:

Golan Levin, Jan Pillaert, Elise Elsacker, Holger Lippmann, Marcin Ignac, Johan Van Looveren, Ira Greenberg, Andreas Schlegel, Andres Colubri, Stef Bourdon, Ryan Alexander, Matt Pearson, Bert Balcaen, Daniel Shiffman, Andreas Schlegel, Joshua Noble, Casey Reas, Julien Deswaef, Matthew Plummer-Fernandez, Filip Daniels, Jer Thorp, Jessica Rosenkrantz, David Bollinger, Marie-Laure Delaby, Leander Herzog, Corneel Cannaerts, Kim Asendorf, Frederik Vanhoutte, Simon Geilfus, Jared Tarbell, Inge Gobert, Spencer Pieters, Ben Fry, Jonathan McCabe, Andreas Köberle, Marius Watz, Kasper Jordaens, Robert Hodgin, Karsten Schmidt, and John Maeda.

I would also like to thank iMAL and Timelab for organizing workshops on Processing and Arduino, and DOK for letting us use their space for the Processing Ghent meetings.

About the Reviewers

Dr. Bryan, Wai-ching CHUNG is the Assistant Professor of Interactive Art in the Academy of Visual Arts, Hong Kong Baptist University. He is also the founding consultant of the interactive media design company DBIS Interactive (http://www.dbisinteractive.com) in Hong Kong. Dr. Chung obtained his doctoral degree in Fine Arts, master's degree in Multimedia Design, and bachelor's degree in Computer Science. Apart from academic and consultation works, he has produced interactive artworks that have been widely exhibited in Asia and Europe. Currently, he is developing open source software libraries for the Processing community. His works are documented on his personal blog at http://www.magicandlove.com.

Frederik Vanhoutte is a medical radiation physicist with a PhD in experimental solid state physics. When rain hits the windscreen, he sees tracks of alpha particles trace in cells. When he pulls the plug in the bath tub, he stays to watch the little whirlpool. When he sits at the kitchen table, he plays with the glasses to see the caustics. At a candlelight dinner, he stares into the flame. Sometimes at night, he finds himself in front of the computer. When he finally blinks, a mess of code is drawing random structures on the screen. He spends the rest of the night staring.

Working with Processing since 2004, creative coding fuels his curiosity of physical, biological, and computational systems. He shares his constructs on his website wblut.com. Recently, his hemesh Processing library has been gaining a small following for the creation and manipulation of 3D meshes.

www.PacktPub.com

Support files, eBooks, discount offers and more

You might want to visit www.PacktPub.com for support files and downloads related to your book.

Did you know that Packt offers eBook versions of every book published, with PDF and ePub files available? You can upgrade to the eBook version at www.PacktPub.com and as a print book customer, you are entitled to a discount on the eBook copy. Get in touch with us at for more details.

At www.PacktPub.com, you can also read a collection of free technical articles, sign up for a range of free newsletters and receive exclusive discounts and offers on Packt books and eBooks.

http://PacktLib.PacktPub.com

Do you need instant solutions to your IT questions? PacktLib is Packt's online digital book library. Here, you can access, read and search across Packt's entire library of books. 

Why Subscribe?

Fully searchable across every book published by Packt

Copy and paste, print and bookmark content

On demand and accessible via web browser

Free Access for Packt account holders

If you have an account with Packt at www.PacktPub.com, you can use this to access PacktLib today and view nine entirely free books. Simply use your login credentials for immediate access.

Preface

Processing is probably the best-known creative coding environment that helps you bridge the gap between programming and art. It enables designers, artists, architects, students, and many others, to explore graphics programming and computational art in an easy way, thus helping boost creativity.

Processing 2: Creative Programming Cookbook will guide you to explore and experience the open source Processing language and environment, helping you discover advanced features and exciting possibilities with this programming environment, like never before. You'll learn the basics of 2D and 3D graphics programming, and then quickly move up to advanced topics, such as audio and video visualization, computer vision, and much more, with this comprehensive guide.

Since its birth in 2001, Processing has grown a lot. What started out as a project by Ben Fry and Casey Reas has now become a widely used graphics programming language.

Processing 2 has a lot of new and exciting features. This cookbook will guide you through exploring the completely new and cool graphics engine and video library. Using the recipes in this cookbook, you will be able to build interactive art for desktop computers, the Internet, and even Android devices! You don't even have to use a keyboard or mouse to interact with the art you make. The book's next-gen technologies will teach you how to design interactions with a webcam or a microphone! Isn't that amazing?

Processing 2: Creative Programming Cookbook will guide you to explore the Processing language and environment using practical and useful recipes.

What this book covers

Chapter 1, Getting Started with Processing 2, takes a look at installing Processing on your computer and creating your first interactive sketch.

Chapter 2, Drawing Text, Curves, and Shapes in 2D, covers the basics of 2D drawing. We'll take a look at how we can use colors, typography, and images.

Chapter 3, Drawing in 3D—Lights, Camera, and Action!, explores the third dimension. You'll learn how to draw basic 3D shapes and how you can use lights to add some extra depth to your 3D scene.

Chapter 4, Working with Data, will teach you how to load data from text files and parse it to make it useful in your sketch. We also explore some datatypes that will be useful for storing data.

Chapter 5, Exporting from Processing, covers everything to get your work out in the world. You'll learn to save your sketches as an image, PDF file, or standalone application.

Chapter 6, Working with Video, explores how you can work with video and how you can manipulate it to create something interesting.

Chapter 7, Audio Visualization, will show you how to use the Minim library. We'll take a look at how we can visualize audio, and create some basic instruments.

Chapter 8, Exploring Computer Vision, will teach you how computer vision works with Processing. We'll take a look at blob tracking and color tracking and will explore the basics of OpenCV.

Chapter 9, Exploring JavaScript Mode, will show you how you can use your freshly acquired Processing skills to create interactive sketches for the web.

Chapter 10, Exploring Android Mode, covers how you can use Processing to create interactive applications for Android smartphones and tablets.

Chapter 11, Using Processing with Other Editors, shows you how you can use Processing with Eclipse and IntelliJ IDEA. We also take a look at how you can create your own libraries and tools to use with Processing.

What you need for this book

The software you need for the biggest part of the book is Processing, and can be downloaded at http://processing.org/.

For some chapters, you'll need to download some extra software. For Chapter 10, you need the Android SDK, which can be downloaded at http://developer.android.com/sdk/index.html. For Chapter 11, you'll need some other editors to work with Processing. Eclipse can be downloaded at http://eclipse.org/ and IntelliJ IDEA at http://www.jetbrains.com/idea/.

If you need to download or install extra libraries, fonts, or other files, the recipe will mention where you can find what you need.

Who this book is for

This book targets creative professionals, visual artists, designers, and students who have basic knowledge of the Processing development environment and who want to discover the next level of Processing—anyone with a creative practice who wants to use computation in their design process. A basic understanding of programming is assumed. However, this book is also recommended to the non-artistic looking to expand their graphics and artistic skills.

Conventions

In this book, you will find a number of styles of text that distinguish between different kinds of information. Here are some examples of these styles and an explanation of their meaning.

Code words in text are shown as follows: The size() function sets the dimensions of your sketch window.

A block of code is set as follows:

void setup()

{

  size( 640, 480 );

  smooth();

}

void draw()

{

  background(255);

New terms and important words are shown in bold. Words that you see on the screen, in menus or dialog boxes for example, appear in the text like this: Click on the Run button to start Processing.

Note

Warnings or important notes appear in a box like this.

Tip

Tips and tricks appear like this.

Reader feedback

Feedback from our readers is always welcome. Let us know what you think about this book—what you liked or may have disliked. Reader feedback is important for us to develop titles that you really get the most out of.

To send us general feedback, simply send an e-mail to <[email protected]>, and mention the book title via the subject of your message.

If there is a topic that you have expertise in and you are interested in either writing or contributing to a book, see our author guide on www.packtpub.com/authors.

Customer support

Now that you are the proud owner of a Packt book, we have a number of things to help you to get the most from your purchase.

Downloading the example code

You can download the example code files for all Packt books you have purchased from your account at http://www.PacktPub.com. If you purchased this book elsewhere, you can visit http://www.PacktPub.com/support and register to have the files e-mailed directly to you.

Errata

Although we have taken every care to ensure the accuracy of our content, mistakes do happen. If you find a mistake in one of our books—maybe a mistake in the text or the code—we would be grateful if you would report this to us. By doing so, you can save other readers from frustration and help us improve subsequent versions of this book. If you find any errata, please report them by visiting http://www.packtpub.com/support, selecting your book, clicking on the errata submission form link, and entering the details of your errata. Once your errata are verified, your submission will be accepted and the errata will be uploaded on our website, or added to any list of existing errata, under the Errata section of that title. Any existing errata can be viewed by selecting your title from http://www.packtpub.com/support.

Piracy

Piracy of copyright material on the Internet is an