36620001

Webサイト表現演習応用A

2025年度1Q(前期)

演習

Web

栗谷 幸助

実務家教員

3~4

2.00単位

水曜3限、水曜4限

このクラスの授業は【オンライン：ZOOMなど】にて実施をします。

Webサイト制作の基礎知識（HTML、CSS、JavaScript）がある初学者が、さらなるスキルアップのために、最新の技術を学び、ユーザーに刺さるインタラクティブなWebページを作成する。

＜授業内容のキーワード＞
Webデザイン、HTML、CSS、JavaScript、JavaScriptライブラリ、SVG、Webアニメーション、LP（ランディングページ）など

※ オンライン授業のため、ZOOMにて 授業参加ができる環境が必須です。それは単にZOOMにて授業を視聴できるということではなく、「途切れのない快適な接続環境である」「グループディスカッションや作品発表があるため、音声でのやり取りができる環境である」「制作進捗や作品発表のためのスムーズな画面共有ができる環境である」ことを指しますので、ご承知おきください。

Webサイト表現演習応用Aは、ターゲットユーザーに最適な形で適応したインタラクティブなWebページの作成を行なえるようになるための科目です。

①Webサイト表現演習
②Webサイト制作実践演習Ⅰ

上記①または②の単位修得

・平常点　２０％（授業態度や学習への意欲、授業アンケートの提出状況など）
・授業内の演習・課題への点数　３０％
・最終課題評価点　５０％
※　大学の定める出席率を満たさない場合は、単位を付与することは出来ません。

以上をもって、トータルで成績評価を行ないます。「毎回出席をした」「最終課題を提出した」ということだけで単位認定をすることはありませんので、充分に理解をしておくこと。

・試験方法　　課題の提出（提出締切厳守）
・実施日　　　第８週までに実施
・提出〆切　　授業内で発表される最終課題資料を参照
・追試験の実施　　無　　
・再試験の実施　　無

※　追再試はありませんが、提出課題の状態によっては再提出を指示する場合があります。

インタラクティブなWebページのデザイン
・授業内で発表される最終課題資料の内容に基づき、指定されたテーマで、モバイル用・PC用のそれぞれに対応したWebサイトを制作していただきます。

Webデザインとは
・Webデザインとは
・Webデザイナーの仕事について
・Webデザインの工程について
・良いwebデザインとはなにか
・ワークショップ

最近のフロントエンドの技術や知識を身につける
・最近のフロントエンド事情
・フロントエンドの技術
・フロントエンドの知識
・ワークショップ

SVGとWebアニメーション
・SVGとは
・Webアニメーションとは
・CSSアニメーション
・SVGアニメーション

ワクワクするページをデザインしよう（１）
・Webデザインにおける色
・Webデザインにおける文字
・Webデザインにおける配置（レイアウト）
・LP（ランディングページ）とは
・「お題」発表
・情報整理 / 設計
・ワイヤーフレーム作成

ワクワクするページをデザインしよう（２）
・モックアップを作成しよう

ワクワクするページをコーディングしよう（１）
・レスポンシブデザインとは
・なぜレスポンシブデザインか
・コーディング

ワクワクするページをコーディングしよう（２）
・実装

発表
・この科目で作成をした作品の発表と講評

・筆記用具
・各自のPCを使用する場合は、テキストエディタやデザインツールなどを用意
（Adobe ID（ソフト利用のためのライセンス）があることが望ましい）

※ オンライン授業となりますので、ZOOMにて 授業参加ができる環境が必須です。それは単にZOOMにて授業を視聴できるということではなく、「途切れのない快適な接続環境である」「グループディスカッションや作品発表があるため、音声でのやり取りができる環境である」「制作進捗や作品発表のためのスムーズな画面共有ができる環境である」ことを指しますので、ご承知おきください。

教材については、授業各回で配布します。また、参考図書については適切な書籍を授業内で紹介していく。