Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Processing によるプログラミング入門 第1回

10,420 views

Published on

Processing によるプログラミング入門の第 1 回目。研究室の勉強会で発表しました。
PowerPoint のファイルが欲しい場合は連絡をください。

[←前回] Kinect 入門 http://www.slideshare.net/Reputeless/kinect-20715686
[次回→] 第 2 回 http://www.slideshare.net/Reputeless/processing-2

Published in: Technology
  • DOWNLOAD THAT BOOKS/FILE INTO AVAILABLE FORMAT - (Unlimited) ......................................................................................................................... ......................................................................................................................... Download FULL PDF EBOOK here { http://bit.ly/2m77EgH } ......................................................................................................................... .............. Browse by Genre Available eBooks ......................................................................................................................... accessibility Books Library allowing access to top content, including thousands of title from favorite author, plus the ability to read or download a huge selection of books for your pc or smartphone within minutes Christian, Classics, Comics, Contemporary, Cookbooks, Art, Biography, Business, Chick Lit, Children's, Manga, Memoir, Music, Science, Science Fiction, Self Help, History, Horror, Humor And Comedy, Suspense, Spirituality, Sports, Thriller, Travel, Young Adult, Crime, Ebooks, Fantasy, Fiction, Graphic Novels, Historical Fiction, Mystery, Non Fiction, Paranormal, Philosophy, Poetry, Psychology, Religion, Romance,
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • If you want to download or read this book, copy link or url below in the New tab ......................................................................................................................... DOWNLOAD FULL PDF EBOOK here { https://urlzs.com/UABbn } .........................................................................................................................
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • -- DOWNLOAD THIS BOOKS INTO AVAILABLE FORMAT -- ......................................................................................................................... ......................................................................................................................... Download FULL PDF EBOOK here { http://bit.ly/2m77EgH } ......................................................................................................................... (Unlimited)
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • DOWNLOAD THAT BOOKS/FILE INTO AVAILABLE FORMAT - (Unlimited) ......................................................................................................................... ......................................................................................................................... Download FULL PDF EBOOK here { http://bit.ly/2m77EgH } ......................................................................................................................... .............. Browse by Genre Available eBooks ......................................................................................................................... accessibility Books Library allowing access to top content, including thousands of title from favorite author, plus the ability to read or download a huge selection of books for your pc or smartphone within minutes Christian, Classics, Comics, Contemporary, Cookbooks, Art, Biography, Business, Chick Lit, Children's, Manga, Memoir, Music, Science, Science Fiction, Self Help, History, Horror, Humor And Comedy, Suspense, Spirituality, Sports, Thriller, Travel, Young Adult, Crime, Ebooks, Fantasy, Fiction, Graphic Novels, Historical Fiction, Mystery, Non Fiction, Paranormal, Philosophy, Poetry, Psychology, Religion, Romance,
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • (Unlimited)....ACCESS WEBSITE Over for All Ebooks ................ accessibility Books Library allowing access to top content, including thousands of title from favorite author, plus the ability to read or download a huge selection of books for your pc or smartphone within minutes ......................................................................................................................... DOWNLOAD FULL PDF EBOOK here { http://bit.ly/2m6jJ5M } ......................................................................................................................... Download Full EPUB Ebook here { http://bit.ly/2m6jJ5M } ......................................................................................................................... Download Full PDF EBOOK here { http://bit.ly/2m6jJ5M }
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here

Processing によるプログラミング入門 第1回

  1. 1. 早稲田大学 基幹理工学部 表現工学科長研究室 B4 鈴木 遼21 May 2013
  2. 2. (講座の前に)準備と動作確認 http://processing.org/download/ からOS に応じた最新版をダウンロード processing を起動(ショートカットを作っておこう) と入力し、▶ ボタンをクリックsize(400,400);background(0,0,255);
  3. 3. (講座の前に)準備と動作確認
  4. 4. 今日やること Processing とプログラミングの基礎 簡単なことを 22 項目だけ覚えます
  5. 5. 今日やること C 言語の授業を覚えていなくても OK 新しい気持ちでメディアアートプログラミングの世界へ旅立とう
  6. 6. 今日やること 英語の勉強で言えばアルファベットを覚えるところ 文章を作れるようになるのはこれから
  7. 7. 1. Processingとは [1/4] Java というメジャーなプログラミング言語をシンプルにして、アートやビジュアルデザイン機能に特化させた言語とシステム 視覚的なフィードバックをすぐに得られる 基本文法は Java と同じなので、Java の勉強にもなる!
  8. 8. 1. Processingとは [2/4] デジタルアート・ビジュアルデザインhttp://www.openprocessing.org/
  9. 9. 1. Processingとは [3/4] 2001 年 MIT メディアラボの Casey Reasと Benjamin Fry が最初のバージョンを開発 Windows や Mac など様々なプラットフォームで動作 人気が上昇するにつれ、3D 描画や MIDI,Arduino, Kinect といった様々なシステムとの連携が拡張され、活用範囲が広がっている
  10. 10. 1. Processingとは [4/4] 国内でも多くの書籍
  11. 11. 2. 画面の説明 [1/2]ディスプレイウィンドウPDE (Processing DevelopmentEnvironment) ウィンドウ
  12. 12. 2. 画面の説明 [2/2]Run ボタンテキストエディタテキストエリア
  13. 13. プログラミング これの意味がなんとなく読み解けるなら、素質があります! さっぱりわからなくても、今日の講座でわかるようになりますsize(400,400);background(0,0,255);
  14. 14. 3. 整数リテラル 整数を書くと、それは整数リテラルと呼ばれる数値データになる100-50
  15. 15. 4. テキストエリア出力 [1/3] println() は ( ) の中のデータをテキストエリアに表示するprintln(xxx);テキストエリア
  16. 16. 4. テキストエリア出力 [2/3]println(100);
  17. 17. 4. テキストエリア出力 [3/3]println(100);println(50);
  18. 18. セミコロン 命令の終了を意味する 文章の句点と同じ「眠い 。」println(100);println(50);
  19. 19. 5. 計算 [1/6] 数値データは計算ができる 演算子 + 足し算, - 引き算, * 掛け算, / 割り算100+50100-50100*50100/50
  20. 20. 5. 計算 [2/6] 計算結果を表示println(100+50);println(100-50);println(100*50);println(100/50);
  21. 21. 5. 計算 [3/6] % 余り算println(13%5);println(111%50);
  22. 22. 5. 計算 [4/6] 計算は連続できるprintln(1+2+3+4+5);println(2*2*2*2);
  23. 23. 5. 計算 [5/6] 計算順序は算数と同じ 掛け算・割り算・余り算が優先 必要なら( )を使うprintln(2+3*5);println((2+3)*5);
  24. 24. 5. 計算 [6/6] 注意: 整数の割り算は小数以下切り捨てprintln(10/3);println(71/7);
  25. 25. 6. 型 型は、あるデータで扱える値と可能な計算を決める 整数リテラルは int 型 int 型 扱える値はおよそ -21 億~21億の整数 できる計算は + - * / % など
  26. 26. 7. 変数 [1/5] 名前の付いたデータ 型名 名前 = 初期値; 「int 型の変数 x を定義、初期値は 100」int x = 100;
  27. 27. 7. 変数 [2/5]int x = 100;println(x);println(x+10);println(x*x);
  28. 28. 7. 変数 [3/5] 名前が異なれば、変数をいくつでも作れるint x = 100;int y = 50;println(x+y);int a = 1, b = 2, c = 3;println(a+b+c);
  29. 29. 7. 変数 [4/5] 変数の値は 代入演算子= で変更できる 「x に新しい値を代入する」と言うint x = 100;println(x);x = 200;println(x);
  30. 30. 7. 変数 [5/5]int x = 100;println(x);x = x+5;println(x);
  31. 31. 8. 複合代入演算 [1/2] 複合代入演算子は計算と代入を同時に行うint x = 100;println(x);x += 5;println(x);x *= 2;println(x);
  32. 32. 8. 複合代入演算 [2/2] 結果は?int x = 10;x -= 2;x *= 5;println(x);x /= 4;println(x);
  33. 33. 9.インクリメントとデクリメント ++ 1 増やす、-- 1 減らすint x = 10;++x;++x;println(x);--x;println(x);
  34. 34. 10. 比較演算 [1/3] 数値の大小を比較する計算 等しい == 等しくない != 右辺未満 < 右辺以下 <= 右辺より大きい > 右辺以上 >=
  35. 35. 10. 比較演算 [2/3] 比較演算の結果は true か false 100<200 true 50==50 true 80>90 false 5!=5 false
  36. 36. 10. 比較演算 [3/3]int x = 100;println(x<150);println(x<=-50);println(x>150);println(x>=-50);
  37. 37. 11. forループ [1/3] 継続条件を満たす間 {} の中身を繰り返すfor(int i=0; i<3; ++i){println(i);}for(初期設定; 継続条件; ターン終了時にやること){何らかの処理;}
  38. 38. 11. forループ [2/3] [問題 1] 10から 0 までカウントダウン
  39. 39. 11. forループ [2/3] [問題 1] 10から 0 までカウントダウンfor(int i=10; i>=0; --i){println(i);}
  40. 40. 11. forループ [3/3] [問題 2] 0から 100 までの偶数を表示
  41. 41. 11. forループ [3/3] [問題 2] 0から 100 までの偶数を表示for(int i=0; i<=100; i+=2){println(i);}for(int i=0; i<=50; ++i){println(i*2);}
  42. 42. 復習50%ProcessingディスプレイウィンドウPDE ウインドウテキストエディタテキストエリア整数リテラルprintln();+ - * / %型int 型変数複合代入演算 += *= など++ --比較演算== != < <= > >=true falsefor ループ
  43. 43. 12. 画面サイズ [1/2] ディスプレイウィンドウのサイズを設定 w : 幅 h : 高さsize(w,h);幅高さ
  44. 44. 12. 画面サイズ [2/2]size(600,200);
  45. 45. 13. 画面背景 [1/3] 背景の色を設定 r : Red [0,255] g : Green [0,255] b : Blue [0,255]background(r,g,b);
  46. 46. 13. 画面背景 [2/3]size(600,400);background(0,0,0);
  47. 47. 13. 画面背景 [3/3] [問題] 背景を黄色にしよう
  48. 48. 13. 画面背景 [3/3] [問題] 背景を黄色にしようsize(600,400);background(255,255,0);
  49. 49. 画面の設定 本講座では、このサイズのウィンドウを使いますsize(600,400);
  50. 50. 14.画面の座標 size(600x400) の場合(0,0) (599,0)(0,399) (599,399)+ X+ Y
  51. 51. 15. 円を描く [1/2] 円を描く x : 中心の X 座標 y : 中心の Y 座標 w : 円の幅 h : 円の高さellipse(x,y,w,h);
  52. 52. 15. 円を描く [2/2]size(600,400);ellipse(300,200,200,200);
  53. 53. 16. 線を描く [1/2] 線を描く x1 : 始点の X 座標 y1 : 始点の Y 座標 x2 : 終点の X 座標 y2 : 終点の Y 座標line(x1,y1,x2,y2);
  54. 54. 16. 線を描く [2/2]size(600,400);line(0,100,300,200);
  55. 55. 17. 長方形を描く [1/2] 長方形を描く x : 左上の X 座標 y : 左上の Y 座標 w : 幅 h : 高さrect(x,y,w,h);
  56. 56. 17. 長方形を描く [2/2]size(600,400);rect(300,200,250,150);
  57. 57. 18. 枠を消す [1/2] これ以降は枠をつけないようにするnoStroke();
  58. 58. 18. 枠を消す [2/2]size(600,400);noStroke();rect(300,200,250,150);
  59. 59. 19. 枠をつける [1/2] これ以降は枠を描くようにする r, g, b : 枠の色stroke(r,g,b);
  60. 60. 19. 枠をつける [2/2]size(600,400);noStroke();ellipse(200,200,200,200);stroke(255,0,0);ellipse(400,200,200,200);
  61. 61. 20. 塗りつぶしの色を変える [1/2] 塗りつぶしの色を変える r, g, b : 塗りつぶしの色fill(r,g,b);
  62. 62. 20. 塗りつぶしの色を変える [2/2]size(600,400);fill(0,0,255);rect(300,200,250,150);
  63. 63. 21. 塗りつぶしをしない [1/2] これ以降は塗りつぶしをしないnoFill();
  64. 64. 21. 塗りつぶしをしない [2/2]size(600,400);noFill();rect(300,200,250,150);
  65. 65. 22. 透過 [1/2] r,g,b に続き、不透明度 a [0,255] を指定 255 は透過しない、0 は完全に透過fill(r,g,b,a);
  66. 66. 22. 透過 [2/2]size(600,400);rect(50,50,300,200);fill(0,0,255,100);rect(100,100,300,200);
  67. 67. Complete!size(x,y)background(r,g,b)画面の座標ellipse(x,y,w,h)line(x1,y1,x2,y2)rect(x,y,w,h)noStroke()stroke(r,g,b)fill(r,g,b)noFill()fill(r,g,b,a)100%
  68. 68. Practice [1/2] 円をたくさん表示size(600,400);for(int x=0; x<7; ++x){ellipse(x*100,200,100,100);}
  69. 69. Practice [2/2] 円をもっと表示size(600,400);for(int x=0; x<7; ++x){for(int y=0; y<5; ++y){ellipse(x*100,y*100,100,100);}}
  70. 70. Challenge 好きな色でグラデーションを作ろう
  71. 71. 補足|『ジェネラティブ・アート』 講座で紹介した Processing の本 「メディアアート表現論」授業の沖先生が翻訳 コンピュータ生成アートの醍醐味の紹介ジェネラティブ・アート- Processingによる実践ガイド
  72. 72. 補足| 公式リファレンス
  73. 73. 補足| 公式サンプル
  74. 74.  続きは再来週の第 2 回で!
  75. 75. Questions?@Reputeless

×