スケジュールなど
HTML・CSSの基礎（演習１）
Processingとの連携（参考）
Sublime Text（エディタ）
今回の演習では、エディタとして「Sublime Text」を使用します（WINでもMACでも可）。
こちらからダウンロードしてください。
インストールの仕方がわからない場合、（例えば）以下を参照してください。
「HTML-CSS-JS Prettify」プラグインを使うと、「cmd + shift + H」のショートカットでコードの整形をしてくれます。ただし、事前に「Node.js」がインストールされている必要があります。
参考となるページ
- 要素：HTML5要素一覧
- 色：カラーチャート
- CSS：CSSの属性一覧
- フォント：font-familyプロパティで指定できるフォント名, 有名サイトのフォントの設定
- ページ内リンク
- 箇条書きの記号を変える
イントロダクション
授業のすすめかた
- 初回の授業のみZoomでライブ配信による授業をします。それ以降は、各人のPC環境で、小鷹が作成するYoutube資料を教材として、演習を進めてもらいます。
- 基本的に一つの演習を二周で完了するサイクルで進みます。一周目に講義とともに最後に課題を出します。課題は、通常２週間後の授業までに提出を求めますので、二周目の授業では課題のための学習に使ってください。なお二周目の段階で、課題の一部の解答を解説する動画を挙げる予定でいます。
- オンデマンド用の動画は可能な限り、授業日の1日前には確認できるようにします。必ずしも、金曜日の対応する時間に受講する必要はありません。
PC環境・受講場所について
- PC環境はWinでもMacでも大丈夫ですが、個人の環境が不調であれば、工場のPCを使ってもらって構いません。
- 小鷹はMacを使用して講義をすすめます。
課題提出の方法
- ファイルリクエストで課題提出が求められた際には、名前入力の際に、冒頭に学籍番号をつけてください（例：2050xx_kenrikodaka）。dropboxにログインしている場合は、dropboxのアカウントで設定された名前が使われてしまいますので、一旦ログアウトしてもらえると助かります。
事前準備
- 各人所有のPCにあらかじめ最新版のProcessing（3.5.4）をダウンロードしておいてください。WinでもMacでも問題ありませんが、授業資料はMacベースですすめていきます。
関連資料
- [AMAZON] – Processingをはじめよう 第2版 (Make: PROJECTS)
- [PDF] – Keyboard（Mac）の対応表
- [WEB] – e-typing
- [YOUTUBE] – Boids are confused / Scraps are scrapped again
- [WEB] – imd.nagoya
ICC キッズ・プログラム 2021「チューンナップ じぶんをととのえる」オンライン展示は，一部コンテンツをのぞき，アーカイヴ公開しています．
小鷹研究室（名古屋市立大学）
《東京即錯2021》
↓https://t.co/npw7Rasc4I*スマートフォン，タブレット環境では体験できるコンテンツが限定されます． pic.twitter.com/eiFUY54KF0
— NTT ICC (@NTTICC) August 31, 2021
-
卒業制作
カーソルの動きを工夫して没入感を高めるサイトを制作しました。PCではもちろん、スマホでもカーソルを操作するという特殊なインターフェイスを実装しています。
正直まだ修正やブラッシュアップしたい点が山盛りですが、一旦区切りとします。※Chrome推奨ですhttps://t.co/w6B6oqPCTW pic.twitter.com/MJ5pvBhT6f
— かまぼこ｜web (@bokoko33) March 2, 2021
授業でやること（教員用メモ）
- 授業のすすめかた
- Processingのダウンロード
- PC環境のアンケート（WIN or MAC）
- 受講場所のアンケート（学内、自宅）
- Processingでできること（最近の学生の作品）
- ProcessingとWEB [p5js]
- 課題提出の練習
- タイピングの練習
- 個別相談