目次
第1章 Processingでプログラミングを始めよう!
- 1-1 なぜプログラミングをするの?
- プログラミングは「道具」
- 本書の目的
- 1-2 「Processingがオススメ!」の理由
- プログラミング言語とは?
- なぜProcessingがオススメなの?
- 1-3 Processingを始めよう!
- Processingの実行環境
- Processingをダウンロードしよう
- Processingをインストールしよう
- Processingを起動しよう
第2章 Processingで図形を描こう
- 2-1 「 こんにちは,世界」~ Processingの世界にようこそ
- Hello Worldとは?
- プログラムのコードを入力しよう
- 「Hello World」プログラムを実行しよう
- 2-2 画面のサイズと座標を理解しよう
- 画面のサイズを指定する
- 画面の座標を理解しよう
- 2-3 いろいろな図形を描こう
- 線を描こう
- 四角形を描こう
- 円を描こう
- 三角形を描こう
- 2-4 図形に色をつけよう
- 図形を黒く塗りつぶしてみよう
- 光の三原色を使って色をつけよう
- カラーコードを使って色をつけよう
- 画面の背景の色を指定しよう
- 2-5 課題図形を組み合わせてクマを描いてみよう
- 図形を組み合わせてクマを描く
- クマの顔の輪郭を描く
- クマの耳を描く
- クマの手を描く
- クマの目を描く
- クマの口周りを描く
- クマの鼻を描く
第3章 Processingプログラミングの基本―関数,変数,画像表示,乱数
- 3-1 絵を動かすために必要なsetup関数とdraw 関数を作ろう
- まず関数とは何かを理解しよう
- マウスの位置に四角形を表示するプログラムを作ろう
- setup 関数とdraw関数の役割を知ろう
- setup 関数とdraw関数を書いてみよう
- setup 関数とdraw関数を書くときの注意点
- 3-2 「変数」とは何かを理解しよう
- 変数=名前付きの箱
- 自動で右に移動する四角形を表示するプログラムを作ろう
- 変数の宣言方法を理解しよう
- 1つの四角形が自動で右に移動するプログラムを作ろう
- マウスの位置に四角形がついてくるプログラムを作ろう
- draw関数の実行回数をカウントしよう
- 算術演算子を利用しよう
- 3-3 画像を画面に表示しよう
- まずは画像を準備しよう
- 耳の長いネコの画像を表示しよう
- 耳の長いネコの画像がマウスについてくるプログラムを作ろう
- 3-4 「乱数」を使って画面の表示を変化させよう
- なぜ乱数を利用するのか
- 実行のたびに色が変わる円を表示するプログラムを作ろう
- 値を返す関数と値を返さない関数
- 実行のたびに色がカラフルに変わる円を表示するプログラムを作ろう
- クリックするたびに円の色がランダムに変化するプログラムを作ろう
- 初心者あるある問題~変数のスコープ
- 3-5 課題マウスにクマの絵がついてくるプログラムを作ろう
- クマの絵を動かすためのヒント
- setup 関数とdraw関数を使う
- 変数を使って座標を指定する
- クマの絵の表示位置を調整する
第4章 Processingプログラミングの基本―条件分岐,繰り返し
- 4-1 条件分岐を理解しよう
- if ~もし○○なら□□をする
- 比較演算子を使って条件式を書く
- 左右に動く円を描くプログラムを作ろう
- キーボードで円を動かすプログラムを作ろう
- 4-2 画像のアニメーションを作ろう
- アニメーションの基本と画像の準備
- ネコが歩くアニメーションを作ろう
- ネコが自然に歩くようにアニメーションを修正しよう
- 4-3 条件分岐を使って「当たり判定」を行おう
- 「画面がクリックされたら」~当たり判定
- マウスを四角形の上に置いたら色が変わるプログラムを作ろう
- 4-4 繰り返し処理を理解しよう
- 四角形を60 個並べるプログラムを作ろう
- for ~条件を満たす間処理を繰り返す
- 複数の四角形がいっせいに動くプログラムを作ろう
- 4-5 関数を自分で定義しよう
- 関数について今まで学んできたこと
- オリジナルの関数を作ろう
- 4-6 まとめチュートリアル間違い探しゲームを作ろう
- 間違い探しゲームを作ろう
- ① setup 関数とdraw関数を書こう
- ②まずは黒い四角形を1つ描こう
- ③黒い四角形を横に5 個並べよう
- ④繰り返し処理を使って黒い四角形を横に5 個並べよう
- ⑤今度は黒い四角形を縦に5 個並べよう
- ⑥横5×縦5=25 個の四角形を描こう~その1
- ⑦横5×縦5=25 個の四角形を描こう~その2
- ⑧四角形の色をランダムに変更しよう
- ⑨1個目の四角形だけ色を変えよう
- ⑩色が変わる四角形をランダムに変更する
- ⑪ クリックされるたびに色が違う四角形が変わるようにしよう
- ⑫関数を作って同じ処理を1つにまとめよう
- ⑬正解の四角形をクリックできるようにしよう
- ⑭スコアを表示しよう
- ⑮間違い探しゲームの完成!
- ⑯カスタマイズしてみよう
第5章 配列と繰り返し処理でさまざまな表現を作ろう
- 5-1 配列とは何かを理解しよう
- まずは配列を体験してみよう
- 配列の宣言方法を理解しよう
- 配列の要素を個別に操作しよう
- 初心者あるある問題~配列の添字
- 5-2 配列を使ってさまざまな表現を作ろう
- 雨を降らせるプログラムを作ろう
- 雪を降らせるプログラムを作ろう
- 宇宙を表現するプログラムを作ろう
- 5-3 配列を使ってアクションゲームを作ろう
- アクションゲームを作ろう
- ① setup 関数とdraw関数を書こう
- ②プレイヤーとなる白の球体を動かそう
- ③敵となる球体を表示しよう
- ④敵の球体を1体ずつ出現させてみよう
- ⑤敵のスピード,サイズ,色をランダムにしよう
- ⑥当たり判定を作ろう
- ⑦敵が自動で出現するようにしよう
- ⑧敵とぶつかったときの処理を修正しよう
- ⑨ゲームオーバーの処理を作ろう
- ⑩スタート画面を作成しよう
第6章 クラスとオブジェクトを活用しよう
- 6-1 クラスを理解しよう
- 「モノ」を表すオブジェクトに値をまとめよう
- クラスを定義しよう
- オブジェクトを生成して利用しよう
- 6-2 配列と一緒にクラスとオブジェクトを使ってみよう
- 風船が上昇するプログラムを作ろう
- 配列と一緒に使って風船をたくさん表示するプログラムを作ろう
- 6-3 クラスとオブジェクトを使ってシューティングゲームを
- 作ろう
- シューティングゲームを作ろう
- ① setup 関数とdraw関数を書こう
- ②自機となるプレイヤーを仮表示しよう
- ③プレイヤーを動かそう
- ④プレイヤーの動きをスムーズにしよう
- ⑤敵機を作ろう
- ⑥自機と敵機に共通するクラスを作ろう
- ⑦自機を戦闘機の画像にしよう
- ⑧自機の戦闘機をアニメーションにしよう
- ⑨敵機の戦闘機をアニメーションにしよう
- ⑩配列でアニメーションを管理しよう
- ⑪戦闘機が弾丸を発射できるようにしよう
- ⑫戦闘機がたくさんの弾丸を発射できるようにしよう
- ⑬当たり判定を作ろう
- ⑭ isHit関数を使って弾丸が敵に衝突したかを判定しよう
- ⑮弾丸を遮る壁を作ろう
- ⑯弾丸が壁に跳ね返るようにしよう
- ⑰弾丸とプレイヤーが当たるようにしよう
- ⑱敵機が動くようにしよう
- ⑲壁にしかけを加えよう
- ⑳ゲームクリアとゲームオーバーを作ろう
- ㉑ゲームの演出を強化しよう
第7章 総まとめドローンを操作するアクションゲームを作ろう
- 7-1 プレイヤーが操作するドローンの画像を表示しよう
- アクションゲームを作ろう
- ① setup 関数とdraw関数を書こう
- ②ドローンの画像を表示しよう
- 7-2 キーを押してドローンを動かしてみよう
- ③プレイヤーを表すクラスを作ろう
- ④ Playerクラスを使ってドローンを表示しよう
- ⑤ドローンが上昇,下降,横に移動するようにしよう
- 7-3 安全ブロック,危険ブロック,ゴールブロックを作ろう
- ⑥ブロックを表すクラスを作ろう
- ⑦ Blockクラスを使って安全ブロックを表示しよう
- ⑧衝突を判定するisHit関数を作ろう
- ⑨ドローンがブロックの上に着地するようにしよう
- ⑩危険ブロックとゴールブロックを作ろう
- 7-4 縦と横に画面をスクロールする「カメラ」を作ろう
- ⑪カメラを表すクラスを作ろう
- ⑫カメラからの位置を計算して座標に変換する関数を作ろう
- ⑬カメラの移動範囲を制御しよう
- 7-5 ゲームクリアを作ってゲームを完成させよう
- ⑭ゲームクリアを作ろう
- ⑮自分だけのオリジナルステージを作ろう
- ⑯見た目を整えて完成させよう
- おわりに
- 付録:関数一覧
- 索引