36310003

Webデザイン演習 I

2024年度2Q(前期)

演習

Web

栗谷 幸助

実務家教員

2〜3

2.00単位

金曜5限、金曜6限

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

WebサイトのベーシックなUIの制作を体験しましょう。
使用ソフトの基本操作 および Webページのデザイン方法については、映像教材にて学習をしていただきます。
主に Photoshop、Illustratorを使用します。内容によっては、Adobe XDを使用する場合もあります。

※ オンラインによる授業のため、最適な通信状況でのZOOMなどの受講環境が必要です。
※ ソフトの使用には、Adobe ID（有料版）が必要です。
※ 映像教材の範囲については、別途お知らせします。

【展示対象科目】
本科目は展示対象科目のため授業課題や制作物を８月実施予定の『初展』にて展示（発表）します。
『初展』の概要ついては、別途デジキャンで配信されているお知らせを確認してください。

Webデザイン演習Ⅰは、Webページのベーシックな画面デザイン（UI）と、画像制作ツールの操作を学ぶための科目です。

【学習目標】
・制作に必要な知識、調査、分析が出来るようになる。
・テーマに沿った企画が出来るようになる。
・テーマに沿ったWebページのデザインが出来るようになる。
・制作物に対して、制作の意図やコンセプトを言えるようになる。
・他者のデザインに対して、自分の意見を言えるようになる。

基礎ツール演習Ⅰの単位修得

課題点70%、授業点30%の総合点数で評価を行います。
・課題点は、ワークや提出作品で授業の理解度やデザイン性等を評価します。
・授業点は、授業態度や学習への意欲、積極性、FSの回答状況などを評価します。

※ 大学の定める出席率70%を満たさない場合は、単位を付与することが出来ません。
※「毎回出席をした」「最終課題を提出した」ということだけで単位認定をすることはありません。

・試験方法　　課題の提出（提出締切厳守）
・制作テーマ　　都度指示します。
・諸注意　　授業データのまま提出した場合は単位を認めません。
・提出方法　　都度指示します。

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

■Webページのデザイン
・テーマに沿った内容で、モバイル用、PC用、それぞれのデザインをしていただきます。

■Webページのデザイン分析①
・Webページの色々／Webページの情報やデザイン要素を観てみよう。
・普段閲覧しているWebページの幅やカラー、フォントなどについて調べてみよう。

■Webページのデザイン分析の発表

■Webページのデザイン分析②
・Webページを構成しているパーツや要素について深く調べてみよう。

■Webページのデザイン分析の発表

■WebサイトUIデザインを制作してみよう／大まかなデザイン／カラー構成など
・シンプルなTOPページの作成を通して、制作の流れとデータの整理を学習します。

■WebサイトUIデザインを制作してみよう／ワイヤーフレーム①
・ペーパーワイヤーの練習。
・実在するWebページをペーパーワイヤーに起こしてページの構成を確認する。
・実在するWebページをトレースしてレイアウトの感覚を掴む。

■WebサイトUIデザインを制作してみよう／ワイヤーフレーム②
・ペーパーワイヤーの練習。
・実在するWebページをペーパーワイヤーに起こしてページの構成を確認する。
・実在するWebページをトレースしてレイアウトの感覚を掴む。

■WebサイトUIデザインを制作してみよう／フォント／メインヴィジュアル／ロゴ・アイコンの制作
・テーマに合わせたデザインパーツの制作を行ないます。
・映像教材によるWebサイトUIデザインの学習

■最終課題：課題内容の説明
・テーマの発表と制作内容の説明を行ないます。
・企画にあたり、関連情報の調査
・素材収集
・構成の確認
・ワイヤー制作

■WebサイトUIデザインを制作
・WebサイトUIデザインのさまざまな表現や手法について再確認をする。

■最終課題：企画発表
・PowerPoint、KeyNote、XDなどで企画内容をまとめ、発表していただきます。

■最終課題：デザイン制作①
・PC用、モバイル用のデザイン制作に入ります。
・制作に必要なソフトの操作などは、映像教材にて学習をしていただきます。

■最終課題：デザインチェック①
・PC用デザインの制作進行とデザインのチェックを発表形式で行ないます。

■最終課題：デザイン制作②
・PC用、モバイル用のデザイン制作に入ります。
・制作に必要なソフトの操作などは、映像教材にて学習をしていただきます。

■最終課題：デザインチェック②
・モバイル用デザインの制作進行とデザインのチェックを発表形式で行ないます。

■最終課題の提出と発表・修正
・最終課題の作品を発表していただきます。
・また、調整が必要な項目については、修正を行なって提出していただきます。

・Adobe ID（学生ライセンス）
・筆記用具（消せるボールペン）
・定規（15〜20cm程度）
・映像教材用のイヤフォン、ヘッドフォン（スピーカーから音を出せない環境で受講の場合）

映像教材や配布資料を使用します。