​​プログラミングB #02
​​#02 アカウントの登録／p5.js入門（1）基本的な図形描画
​​
​​高尾俊介（takawo@konan-wu.ac.jp）
​​甲南女子大学 文学部 メディア表現学科 講師
​​
​​

​​今日の授業内容

​​
  • ​​p5.js入門
  • ​​p5.jsとは
  • ​​プログラムのプロセスについて
  • ​​座標
  • ​​基本的な図形描画
  • ​​p5.jsを学んでいくにあたっての準備
  • ​​アカウントの作成
  • ​​p5.js editor（エディタ）
  • ​​openProcessing（授業課題の提出公開）
​​
​​p5.jsを学んでいくにあたっての準備は，次回以降の授業でも関連してくる項目です．欠席した人は自習までに必ず2つのアカウントの登録を済ませておいてください．
​​
​​

​​p5.jsのアカウント作成

​​
​​登録画面へ移動
​​
 
User-uploaded image: 1p5_js_Web_Editor___First_monkey.png
​​Log in or Sign upをクリックする
​​
​​アカウントを登録する
​​
 
User-uploaded image: p5_js_Web_Editor___Signup.png
​​ユーザ名（まかせます），メールアドレス，パスワード（忘れないように！）を入力してサインアップ（登録）する
​​
​​ログイン後画面
​​
 
User-uploaded image: 3_2018-10-01_12_31_52.png
​​
  • ​​アカウント登録によってファイルの保存や読み込み，また画像や音声などのアップロードができるようになります．
​​
​​

​​Open Processingについて

​​
  • ​​授業ではOpenProcessingというサイトでコードを登録する形で進めていきます．
  • ​​今回はOpenProcessingでアカウントの登録を行いたいと思います
  • ​​すでにもっているひとは新しくアカウントを作成する必要はありません．
​​
​​

​​Open Processingのアカウント作成

​​
  1. ​​Google Chromeで「OpenProcessing」を検索 
  1. ​​検索結果一番上のリンクをクリック
​​
​​
​​
 
User-uploaded image: 0OpenProcessing_-_Creative_Coding_for_the_Curious_Mind.png
​​
​​