PROPERTY OF THE MIT PRESS

FOR PROOFREADING, INDEXING, AND PROMOTIONAL PURPOSES ONLY

Processing
Second edition

Reas_000.indd 1

7/16/2014 3:10:32 PM

PROPERTY OF THE MIT PRESS

FOR PROOFREADING, INDEXING, AND PROMOTIONAL PURPOSES ONLY

Reas_000.indd 2

7/16/2014 3:10:32 PM

PROPERTY OF THE MIT PRESS

FOR PROOFREADING, INDEXING, AND PROMOTIONAL PURPOSES ONLY

Processing:
a programming
handbook for
visual designers
and artists
Second edition

Casey Reas
Ben Fry

The MIT Press

Cambridge, Massachusetts
London, England

Reas_000.indd 3

7/16/2014 3:10:32 PM

PROPERTY OF THE MIT PRESS

FOR PROOFREADING, INDEXING, AND PROMOTIONAL PURPOSES ONLY

2014 Massachusetts Institute of Technology

All rights reserved. No part of this book may be reproduced in any form by any electronic or mechanical means
(including photocopying, recording, or information storage and retrieval) without permission in writing from
the publisher.
MIT Press books may be purchased at special quantity discounts for business or sales promotional use. For
information, please email special_sales@mitpress.mit.
This book was set in 9/12.5 pt The serif Plain by Toppan Best-set Premedia Limited. Printed and bound in the
United States of America.
Library of Congress Cataloging-in-Publication
Reas, Casey.
Processing : a programming handbook for visual designers and artists / Casey Reas and Ben Fry.Second
edition.
pages cm
Includes bibliographical references and index.
ISBN 978-0-262-02828-8 (hardcover : alk. paper) 1. Computer programming. 2. Computer graphics
Computer programs. 3. Digital artComputer programs. 4. ArtData processing. 5. Art and
technology. I. Fry, Ben. II. Title.
QA76.6.R4138 2014
006.60285dc23

2014016283

10 9 8 7 6 5 4 3 2 1

Reas_000.indd 4

7/16/2014 3:10:32 PM

PROPERTY OF THE MIT PRESS

FOR PROOFREADING, INDEXING, AND PROMOTIONAL PURPOSES ONLY

Contents
ix
xi

xi
xii
xii
xiv
xv

4
4
6
6

Foreword
Preface

Contents

How to read this book

Caseys introduction
Bens introduction

Acknowledgments
1. Processing ...
Software
Literacy
Open

Education
Network
Context

9 2. Using Processing

39 4. Color
40

Color by number

45

RGB, HSB

43
48

51

Data types

54

Variable names

52
55
56
58
59
61
62

Download, Install

65

10

Export

69

Environment

11

Example walk-through

16

Comments

16
17
17
19
19
20
20

Coding is writing
Functions

Expressions, Statements
Case sensitivity

Curves

35

77
79
81

Mind the data types

Data conversion

Order of operations
Shortcuts
6. Flow

Looping

Controlling the flow

Relational expressions
Conditionals

Logical operators
Variables scope

Formatting code blocks

89

28

34

72

Arithmetic

Reference

Coordinates

32

70

Processing variables

83 7. Interactivity

Console

21

32

65

Variables

Whitespace

21 3. Draw
23

Hexadecimal

51 5. Variables

9
9

Blend

Basic shapes
Drawing order
Gray values
Attributes

84

Mouse data

90

Keyboard data

93
94
94

97
98
100

Mouse buttons
Coded keys
Events

Mouse events
Key events
Event flow

Cursor icon

Modes

Reas_000.indd 5

7/16/2014 3:10:32 PM

PROPERTY OF THE MIT PRESS

FOR PROOFREADING, INDEXING, AND PROMOTIONAL PURPOSES ONLY
103 8. Repeat

173

104

174

103

Iterate

105

for loop

109
111

while loop
Loop and draw()
Nested loops

115 9. Synthesis 1
115

Sketching software

117

Examples

116

123

125

129

133

137

141

142

143
144
147

148
149
150
153
154

156
157
161

162
164
167
170

Programming techniques

10. Interviews: Image

Manfred Mohr, Une

Esthetique Programmee
LettError, RandomFont

173
176
176
177
181
182
185

185

187
188
189
192

Beowolf

197

Substrate

202

Jared Tarbell, Fractal.Invaders,

Benjamin Maus, Perpetual
Storytelling Apparatus
11. Text

Characters

Words, Sentences

Strings are objects

12. Typography

Draw text

197
204
209
213

213
216
218
219
221

Load media

225

Pixel fonts

226

Vector fonts
Text attributes
Typing

Typography and interaction

13. Image

Display

Tint, Transparency
Mask
Filter

225
227
243

245
249

253
257

14. Transform

Translate

Controlling transformations
Rotate
Scale

Combining transformations

Transformation and interaction

New coordinate systems
15. Vertices

Vertex

Points, Lines
Geometry
Curves

Contours
16. 3D Drawing
3D form
Camera

Lights, Materials
Texture maps
17. Shapes

Display SVG
Display OBJ
Transform
Create

Modify
18. Synthesis 2

Iteration

Debugging
Examples

19. Interviews: Interaction

Lynn Hershman Leeson, Lorna

Robert Winter, Ludwig van

Beethoven: Symphony No. 9

Josh On, They Rule

Steph Thirion, Eliss

vi

Reas_000.indd 6

7/16/2014 3:10:32 PM

PROPERTY OF THE MIT PRESS

FOR PROOFREADING, INDEXING, AND PROMOTIONAL PURPOSES ONLY
261

261
262
264
267
270
272
275
283
285
289

289
292
295
296
301

301
306
310
314
317
323

323
326
327
329

330
331

20. Calculate

Exponents, Roots
Normalize, Map
Simple curves

Constraining numbers
Distance
Easing

Angles, Waves

Circles, Spirals
Direction
21. Random

Unexpected values

355

355

358
368
370
371
373
377

377
377
378

Distributions

391

Noise

Random seed

22. Motion

Controlling motion

Motion along curves

Mechanical motion
Organic motion

Kinetic typography
23. Time

Seconds, Minutes, Hours

Milliseconds
Date

24. Functions

Abstraction

Why functions?

393
399
403

407
411

413
414
416
419
422
425
427

428

431

334

Create functions

343

Calculate and return values

435

350

Recursion

438

342
345

Overload functions
Parameterize

432

436
440
441

443
444

25. Objects

Object-oriented programming
Classes and objects
Multiples files

Multiple constructors
Composite objects
Inheritance
26. Synthesis 3

Modularity, reusability
Algorithm
Examples

27. Interviews: Motion, Performance

Larry Cuba, Calculated
Movements

Bob Sabiston, Waking Life

Golan Levin and Zachary

Lieberman, Messa di Voce

SUE.C, Mini Movies
28. Arrays

Define an array

Read array elements

Record data

Array functions

Arrays of objects

Two-dimensional arrays
29. Animation

Arrays of images

Animation format, resolution

Save sequential images
30. Dynamic Drawing
Simple tools

Draw with media

Speed

Orientation

Drawings in motion
Active tools

vii

Reas_000.indd 7

7/16/2014 3:10:32 PM

PROPERTY OF THE MIT PRESS

FOR PROOFREADING, INDEXING, AND PROMOTIONAL PURPOSES ONLY
449

449
453
460

468
475
485

485
486
489
491

31. Simulate

Motion

Particle systems
Springs

Cellular automata

Autonomous agent
32. Data

514

516
519
525

525
529
530
531

536
540
543

543
544
548
550
555

555
558
562

565
569

XML

33. Interface

Rollover, Button
Drag and drop
Check boxes

Radio buttons
Scrollbar

34. Image Processing

Scriptographer

585

Jennifer Steinkamp, Madame

Curie

589

595

Strings

JSON

512

Jrg Lehni, Hektor and

Mark Hansen, Listening Post

Data structure

500

506

581

593

Export files

Table

505

37. Interviews: Environment

577

Format data

493

495

575

593

Ash Nehru, Origin

38. Continuing ...

Extend Processing

Processing and Java

595
597

599

Other programming languages

Appendix A: Order of Operations
Appendix B: Reserved Words

600 Appendix C: ASCII, Unicode

605

Appendix D: Bit, Binary, Hex

615

Appendix F: Programming Languages

623

Related Media

633

Index

609 Appendix E: Optimization

629

Glossary

Read pixels

Write pixels
Copy pixels

Color components
Pixel array

Pixel components
35. Render Techniques
Renderers

Another drawing surface

OpenGL surfaces

Combine surfaces
36. Synthesis 4

Collage engine
Waves

3D letter

Noise landscape
Network

viii

Reas_000.indd 8

7/16/2014 3:10:32 PM