Processing程序交互與動態視覺設計實戰

Processing是一款使用方便、靈活的創意編程工具，語法簡潔易學，使用它可以非常高效地創作豐富多樣的動態視覺效果和交互作品。《Processing程序交互與動態視覺設計實戰》重點引導讀者學習Processing在動態視覺設計方面的基礎知識和實踐創作技能，同時也介紹Processing如何通過鼠標、鍵盤、攝像頭等進行數據讀取，從而創作程序交互的新媒體作品。 《Processing程序交互與動態視覺設計實戰》通過大量的編程範例，帶領讀者從基礎的圖形繪制開始學習，從創意文本到創建動畫，直到生成各種令人驚艷的圖案，或者定製用戶界面，再重點講解與鼠標、鍵盤的互動以及聲音、圖像讀取等的控製程序，最後展示如何用編程創作互動海報招貼的實例，讓讀者在此基礎上自行擴展，創作更多的互動效果作品。 《Processing程序交互與動態視覺設計實戰》附贈全部程序代碼源文件和教學課件。讀者可掃描前言中的二維碼獲取。 《Processing程序交互與動態視覺設計實戰》可作為新媒體、數字媒體、視覺藝術等相關專業的學慣用書，也可供設計師、程序員和藝術工作者等閱讀參考。

創意編程入門 001

1.1　認識Processing 001

1.2　運行環境 002

1.3　變量與運算 007

1.3.1　變量 007

1.3.2　簡單運算 011

1.4　繪制第一個圖形 015

1.5　創建第一個動畫 017

1.6　演示第一個交互效果 019

1.7　本章小結 021

————

繪制圖形 022

2.1　基礎圖形 022

2.2　填充與描邊 025

2.3　貝塞爾曲線與弧線 027

2.4　虛線與網格 030

2.5　復雜圖形 031

2.6　圖形繪制實戰 035

2.6.1　漸變組合橢圓 035

2.6.2　曲線模擬搖曳的草 036

2.6.3　仿生圖案 038

2.6.4　卡通飛鳥 040

2.7　本章小結 046

————

創意文字設計 047

3.1　文字顯示 047

3.2　創建字體 051

3.3　文字屬性 053

3.4　文字排列 055

3.5　版式設計實戰 060

3.5.1　文字沿曲線逐個顯示 060

3.5.2　文字信息指示 061

01

第1章

03

第3章

02

第2章

Processing程序交互與動態視覺設計實戰.indd 2 2023-08-21 17:00:36

目　錄

III

04

第4章

05

第5章

3.5.3　動態文字海報 064

3.5.4　陣列文字效果 068

3.6　本章小結 070

————

色彩運用 071

4.1　色彩模式 071

4.2　顏色設置 074

4.3　漸變色 076

4.4　顏色混合 077

4.5　應用顏色實戰 082

4.5.1　變幻的彩虹 082

4.5.2　顏色對比產生深度 083

4.5.3　混合顏色動態海報 085

4.5.4　動態版式設計 089

4.6　本章小結 095

————

創建動畫 096

5.1　變換動畫 096

5.1.1　移動 096

5.1.2　角度 099

5.1.3　平移 101

5.1.4　旋轉 103

5.1.5　縮放 104

5.1.6　push()和pop()函數 106

5.2　路徑動畫 107

5.3　隨機動畫 109

5.4　運動緩沖 112

5.5　事件流 114

5.6　動畫實戰 116

5.6.1　星空效果 116

5.6.2　飄動的卡片 118

5.6.3　動態進度表 120

5.6.4　運動感海報 124

5.7　本章小結 130

————

Processing程序交互與動態視覺設計實戰.indd 3 2023-08-21 17:00:36

Processing程序交互與動態視覺設計實戰

IV

生成抽象圖案 131

6.1　理解for循環 131

6.2　幾何抽象圖案 133

6.3　自由抽象圖案 140

6.4　圖案組織形式 141

6.4.1　單獨式圖案 141

6.4.2　重復式圖案 142

6.5　圖案設計實戰 153

6.5.1　網格排列的色塊 153

6.5.2　立方塊 154

6.5.3　生成海浪紋理 155

6.5.4　動態組合圖案 157

6.6　本章小結 159

————

應用位圖 160

7.1　加載位圖 160

7.1.1　加載和顯示單張圖片 160

7.1.2　加載和播放序列圖片 162

7.2　圖像蒙版 166

7.3　圖像混合 168

7.4　應用濾鏡 171

7.5　像素化特效 173

7.6　位圖效果實戰 178

7.6.1　利用圖像創建圖案 178

7.6.2　動態蒙版 180

7.6.3　多重曝光海報 183

7.6.4　交互青綠山水畫 186

7.7　本章小結 189

————

互動響應 190

8.1　鼠標交互 190

8.1.1　鼠標相關的系統變量 190

8.1.2　坐標變量 192

8.1.3　特殊坐標變量 192

8.1.4　鼠標圖標函數 193

8.2　鍵盤交互 194

06

第6章

08

第8章

07

第7章

Processing程序交互與動態視覺設計實戰.indd 4 2023-08-21 17:00:36

目　錄

V

8.2.1　鍵盤相關的系統變量 194

8.2.2　鍵盤事件函數 196

8.3　時間觸發 198

8.3.1　時間函數 198

8.3.2　計時器 198

8.4　攝像頭跟蹤 201

8.4.1　實時亮度跟蹤 202

8.4.2　設定顏色跟蹤 203

8.4.3　運動檢測 204

8.5　互動響應實戰 207

8.5.1　拖動圖片滑動 207

8.5.2　手勢控制圖案變化 211

8.5.3　鍵盤交互字符變幻 215

8.5.4　手繪彩色粒子 218

8.6　本章小結 220

————

GUI設計 221

9.1　圖形界面設計 221

9.2　製作UI組件 222

9.2.1　按鈕 222

9.2.2　GUI庫 227

9.2.3　GUI庫——ControlP5 230

9.2.4　GUI庫——G4P 235

9.3　GUI設計實戰 237

9.3.1　飛屏效果 237

9.3.2　滑動菜單展示 242

9.3.3　繪畫板 246

9.3.4　三維演示效果 248

9.4　本章小結 252

————

實時動態影像 253

10.1　視頻應用 253

10.1.1　視頻控制 253

10.1.2　視頻特效 256

10.2　粒子效果 261

10.2.1　創建粒子 261

10.2.2　粒子運動 264

10

第10章

09

第9章

Processing程序交互與動態視覺設計實戰.indd 5 2023-08-21 17:00:36

Processing程序交互與動態視覺設計實戰

VI

10.2.3　互動粒子 266

10.2.4　連續粒子流 267

10.2.5　作用力效果 270

10.3　3D空間 271

10.3.1　3D坐標系 271

10.3.2　三維燈光 274

10.3.3　攝像機 277

10.3.4　應用OBJ模型 278

10.4　實時動態影像實戰 282

10.4.1　動態筆畫效果 282

10.4.2　音樂變幻背景 283

10.4.3　旋轉空間粒子 285

10.5　本章小結 288

————

互動海報招貼設計 289

11.1　海報設計基礎知識 289

11.2　國風海報 291

11.2.1　準備圖片素材 291

11.2.2　創建動畫天空 292

11.2.3　創建群山 293

11.2.4　添加標題文字 294

11.3　交互圖形海報 295

11.3.1　準備素材 295

11.3.2　鼠標交互的多邊形 295

11.3.3　實時合成人像 296

11.3.4　擴展練習 299

11.4　地面互動海報 301

11.4.1　編輯範例程序 301

11.4.2　調整粒子效果 302

11.4.3　導入位圖素材 302

11.4.4　添加光效和標題 303

11.4.5　擴展練習 304

11.5　手勢互動流體海報 304

11.5.1　編輯範例程序 304

11.5.2　添加海報圖形元素 306

11.5.3　調整流體效果參數 307

11.6　本章小結 308