​​" ' プログラミングB #14

​​#14 DOM，モバイルデバイス向けのプログラミング

​​
​​高尾俊介（takawo@konan-wu.ac.jp）
​​甲南女子大学 文学部 メディア表現学科 講師
​​
​​

​​授業のアーカイブ

​​一部編集しました．変換後閲覧できるようになります．（1/25（月） 15:00）
​​
 
​​
​​https://youtu.be/lxgMKf9vWS8
​​

​​ZOOM 

​​https://us02web.zoom.us/j/84515130499?pwd=MW9rdFNjTCtlV1FsVjJmYlVrc2JwUT09
​​
​​ミーティングID: 845 1513 0499
​​パスコード: 833307
​​
​​
​​
​​
 
User-uploaded image: image.png
​​http://www.chigasaki-museum.jp/netart2021/
​​p5.jsでこども向けのプログラミング学習のコンテンツを作成しました．
​​http://www.chigasaki-museum.jp/netart2021/
​​

​​Teachable Machineを試してみる

​​
​​
 
Teachable Machine
Train a computer to recognize your own images, sounds, & poses. A fast, easy way to create machine learning models for your sites, apps, and more – no expertise or coding required.
teachablemachine.withgoogle.com
Teachable Machine • teachablemachine.withgoogle.com
​​
​​
​​

​​デバイスでのプログラミング

​​
  • ​​p5.jsはJavaScriptで記述されているため，ウェブ上であれば実行可能
  • ​​インターネットが繋がる環境であればスマートフォンでも実行できる
  • ​​今回はスマートフォンの特性を利用したプログラミングをやってみる
​​
​​
​​
 
​​
​​https://twitter.com/takawo/status/1353507718141632513
​​

​​p5.js Editor をスマートフォンで開く方法

​​
  • ​​スマートフォンからp5.js Web Editorへアクセスして，ログインしてスケッチを開く
  • ​​フルスクリーンでスケッチを実行する
​​
​​
​​

​​デバイスの向きを取得して描画を変更する

​​
​​let permissionGranted = false;
​​let cx, cy;