目次

Introduction

• Introduction 01　Processingの世界へようこそ！
• Introduction 02　Processingをインストールしよう
• Introduction 03　はじめてのプログラミング

Step 01　画面に絵を描こう

このSTEPで学ぶこと

01-01　座標を指定して図形を描こう

• Practice
• Point 1　画面に画を描く準備をするには
• Point 2　絵筆の太さを決めるには
• Point 3　図形を描くには
• Point 4　上から順に実行される

01-02　キャラクターの顔を描こう

• Practice
• Point 1　線や塗りつぶしの色を変えるには
• Point 2　複雑な図形を描くには

01-03　キャラクターに色をつけよう

• Practice
• Point 1　背景に色をつけるには
• Point 2　カラーモードを設定するには
• Column　プログラムで使う色を探すには

Challenge

• Challenge 1　キャラクターの顔を変化させよう
• Challenge 2　キャラクターを別の色で塗ってみよう

Step 02　いろんなデータを扱おう

このSTEPで学ぶこと

02-01　キャラクターをアレンジしよう

• Practice
• Point 1　変数を用意するには
• Point 2　変数にデータを入れるには
• Column　データ型とは
• Point 3　変数を活用するには
• Point 4　ランダムな数値データを使うには
• Column　プログラムの中での計算式

02-02　画像でキャラクターを表示しよう

• Practice
• Point 1　画像データを読み込むには
• Point 2　画像を画面に描くには
• Point 3　画像の大きさを指定して描くには
• Column　Processing変数（システム変数）

02-03　文字を描こう

• Practice
• Point 1　文字を描くための準備をするには
• Point 2　画面に文字を描くには
• Point 3　文字のそろえや色を変えるには
• Column　日本語の文字を画面に表示するには

02-04　音を鳴らそう

• Practice
• Point 1　Processingの拡張機能を使うには
• Point 2　音を鳴らすには

Challenge

• Challenge 1　2つの画像を画面に表示しよう
• Challenge 2　画像の位置に文字を表示しよう

Step 03　動かそう！

このSTEPで学ぶこと

03-01　画面をキャラクターで埋め尽くそう

• Practice
• Point 1　命令を関数にまとめるには
• Point 2　繰り返し呼び出される関数をつくるには
• Point 3　データをつくって結果として返す関数をつくるには
• Point 4　呼び出すときにデータを渡せる関数をつくるには

03-02　動きのアニメーション

• Practice
• Point 1　どの関数からも使える変数をつくるには
• Point 2　キャラクターの動きを表現するには
• Point 3　加速度を使った動きを表現するには

03-03　キャラクターをマウスで動かそう

• Practice
• Point 1　マウスポインタの座標を使うには
• Point 2　マウスポインタを遅れて追いかける動きを表現するには
• Point 3　マウスボタンに反応するには

Challenge

• Challenge 1　縦の動きも加えてみよう
• Challenge 2　マウスの動きで色を変化させよう

Step 04　動きをコントロールしよう

このSTEPで学ぶこと

04-01　画面にボタンをつくろう

• Practice
• Point 1　条件分岐をつくるには
• Point 2　いろいろな条件分岐をつくる
• Column　「 = 」と「 == 」
• Point 3　マウスポインタがボタンの上にあるかを判定するには

04-02　キャラクターを操作しよう

• Practice
• Point 1　画面端で反対端にワープするには
• Point 2　キーボード入力に反応するには
• Point 3　たくさんのキーを判別するには

04-03　キャラクターをジャンプさせよう

• Practice
• Point 1　キャラクターをジャンプさせるには
• Point 2　床でバウンドする動きを表現するには
• Column　NOT演算と「!=」

Challenge

• Challenge 1　キー操作で上下左右に動かそう
• Challenge 2　落下運動をコントロールしよう

Step 05　「オブジェクト」で考えよう

このSTEPで学ぶこと

05-01　キャラクターをクラスにまとめよう

• Practice
• Point 1　キャラクターをクラスにまとめるには
• Point 2　キャラクターのクラスをつくるには
• Column　クラスの名前のつづり方
• Point 3　クラスからオブジェクトをつくって使うには
• Column　オブジェクト変数とNull

05-02　キャラクターを複数登場させよう

• Practice
• Point 1　ほかのプログラムでつくったクラスを読み込むには
• Point 2　キャラクターのふるまいを増やすには

05-03　オブジェクトを活用しよう

• Practice
• Point 1　別のオブジェクトを含むオブジェクトをつくるには
• Point 2　実際の仕事はオブジェクトにさせる
• Point 3　オブジェクトを引数に使う

Challenge

• Challenge 1　Buttonクラスをつくってみよう
• Challenge 2　クラスに機能を追加してみよう

Step 06　たくさんのデータを扱おう

このSTEPで学ぶこと

06-01　配列と繰り返しを使おう

• Practice
• Point 1　配列を使うには
• Point 2　配列にデータを格納するには
• Column　配列のインデックス指定エラー
• Point 3　配列のデータを繰り返し処理するには
• Point 4　2次元の配列をつくるには
• Point 5　多重の繰り返しをするには
• Column　無限ループ

06-02　パターンアニメーションをつくろう

• Practice
• Point 1　連番の画像ファイルを読み込むには
• Point 2　パターンアニメーションを行うには

06-03　ボタンを並べてリズムマシンをつくろう

• Practice
• Point 1　ボタンを並べた床をつくるには
• Point 2　すべてのボタンをマウスボタンに反応させるには
• Point 3　ワープ中のキャラクターの位置を判定するには
• Point 4　ボタンにキャラクターが一度だけ反応するようにするには
• Column　剰余を計算する「%」演算

Challenge

• Challenge 1　2次元の配列を扱ってみよう
• Challenge 2　Buttonクラスで使う画像を共通化するクラスをつくろう

Step 07　作品を完成させよう

このSTEPで学ぶこと

07-01　座標変換でリズムパートを複数にしよう

• Practice
• Point 1　座標を動かして表示位置を変えるには
• Point 2　座標変換を使ったあとで画面上での座標を知るには

07-02　3次元座標を使おう

• Practice
• Point 1　3次元座標を使うには
• Point 2　複雑な座標変換を行うには

07-03　フルスクリーン表示にしよう

• Practice
• Point 1　外部ライブラリをProcessingにインストールするには
• Point 2　プログラムをフルスクリーンで起動するには
• Point 3　プログラムを実行ファイルにするには

Challenge

• Challenge 1　選択できる音色を増やしてみよう
• Challenge 2　さらに自分なりの改良をしてみよう

Appendix

• Appendix 01　Processing命令リファレンス
• Appendix 02　プログラムにエラーが起きたら
• Appendix 03　Androidスマートフォンでも動かそう
  • Android SDKをインストールする
  • AndroidモードでProcessingを使ってみよう
  • Androidモードでエラーが出たら？
  • Androidデバイスでアプリを動かそう