作成日

必修 1 駒 総時間数 30時間

講義／演習 0 駒 総単位数 2単位

【評価方法】

評価項目 ①定期テスト ②小テスト ③レポート ④課題 ⑤作品 ⑥ﾎﾟｰﾄﾌｫﾘｵ ⑦成果発表 ⑧その他

割合 70% 20% % % % % 10% %

回数

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

14

Webデザイン技法で学んだ項目を振り返りながら、HTML＆CSSの実習で取り組んでいる制作を元に理解を深めることができる。

サイト制作において役立っているところ　②後期授業に向けて

演習問題

15デザイン技法に関わる問題を解くことが出来る。

Webサイトの種類・ページの構成要素・伝えること・インタラクティブ・情報の分類・情報の関係性・素材・Web制作ワークフローについて復習する。

確認問題試験

12

デザインする目的を考えて、ルールやセオリーをクイズ形式で解きながら正しいデザインかどうか判定できる。

デザインルール・セオリーについて以下を学習する。 ⑤写真・図編　⑥Web編

演習問題

13

Webサイトの制作のフローについて理解し、後期の進級制作授業での作業の流れと内容を確認し、事前準備することが出来る。

「Webサイトのワークフロー」について以下を学習する。 ①オリエンテーション・ヒヤリング　② プランニング（企画立案）　③サイト制作　④テスト検証　⑤納品（サイト公開）　⑥運用・効果検証　⑦進級制作授業について

演習問題

10

デザインする目的を考えて、ルールやセオリーをクイズ形式で解きながら正しいデザインかどうか判定出来る。

デザインルール・セオリーについて以下を学習する。 ①構造編　②文字編

演習問題

11

デザインする目的を考えて、ルールやセオリーをクイズ形式で解きながら正しいデザインかどうか判定出来る。

デザインルール・セオリーについて以下を学習する。 ③色編　④グラフィック編

演習問題

8

Webサイト制作で使用する素材の一つである「文字（テキスト）」について理解し、ユーザーに伝わりやすい文字をデザインすることが出来る。

素材（文字編）について以下を学習する。 ①文字について　②書体の選び方　③書体を選ぶ基準について（ポイント４つ）　④書体の使い方（ポイント４つ）　⑤文字を効果的に見せる基本（ポイント３つ）　⑥文字サイズ　⑦Webフォントについて

演習問題

9

Webサイト制作で使用する素材の一つである「インフォグラフィクス」について理解し、インフォグラフィックス8種類を説明出来る。

Webサイト素材「インフォグラフィックス」について以下を学習する。 ①わかりやすく伝えるということ　②情報の視覚化　③インフォグラフィックスとは　④インフォグラフィックスの種類（8種類）　⑤参考サイト

演習問題

6情報の整理することができる。演習問題を解きながら理解を確認できる。

情報の分類（LATCH法）について以下を学習する。 ①サイトの構造とは　②構造の設計　③情報組織化　④情報を整理する5つの軸　⑤演習問題 サイト構造 ①サイトの構造とは　②サイトマップとは　③サイトストラクチャ（サイトの構造）パターン（5個）　④

演習問題と宿題（次回確認と評価）

7

ユーザーに適切に情報を伝えるために情報の関係性を理解し、その種類を5個説明できる。

情報について以下を学習する。 ①データと情報の違い　②情報の関係とは　③情報の関係（５種類）　④演習問題　⑤データ→情報→知識→知恵

演習問題

4

デザインの概念を理解し、情報を伝えるための基本について説明できる。演習問題を通して、サイトのターゲットと目的を確認できる。

「伝えるということ」を意識し、以下を学習する。 ①デザインとアートの違いは？　②デザインとは？　③伝えるためには　④伝えるって難しい　⑤サイトのターゲットと目的は？

演習問題

5

インタラクティブの概念を理解し、身の回りにあるインターフェースと、普段使用しているツールのユーザインターフェースについて考えながら確認できる。ユーザインターフェースで気を付けたいことをサイトの事例を見ながら説明することができる。

「インタラクティブ」について以下を学習する。 ①インタラクティブとは？　②インターフェースとは？　③ユーザインターフェースとは？　④ユーザインタフェースで気を付けたいこと（13個）

演習問題

1 駒

2Webサイトの種類について理解し、実際のサイトで確認出来る。

「Webサイトの種類」について以下を学習する。 ①Webサイトの種類　②覚えておくと便利なサイトリンク集

サイト確認

3

Webページのレイアウトはどのような要素によって構成されているかを理解し、各要素12個を説明できるようになる。また、実際のサイトで確認出来る。

「Webページのレイアウト」について以下を学習する。 ①Webページの構成要素（15個）　②演習問題（確認）

演習問題

学習目標 学習項目

1

Webにかかわるお仕事について職種と内容を理解し、2年間目指す目標を設定出来るようになる。

ガイダンス（この授業について） 「Webに関わる仕事」について下記を学習する。 ①Webのお仕事　②Webに関わる職種　③就職について

目標（職種）をつくる

関連科目 履修前提 ※選択科目のみ記載

企画書作成＆プレゼンテーション、グラフィック実習、JavaScript実習、HTML&CSS実習

Ｗｅｂデザイン科 シラバス 2020年度入学生

科目名 Ｗｅｂデザイン技法 2020年3月6日

担当教員 小山内 靖美 テキスト・参考文献

　【科目内容に沿った実務経験】　有

オリジナルスライド電気設備会社の社内システムにてUIの設計、ペーパープロトタイプ制作の実務経験がある。その経験から取得した知識とスキルを活かして、本科目のUIデザインに対する職業実践的な教育を行う。

Webサイトを作る上で必要なサイトの種類や特徴、サイト設計、情報整理、ページデザイン、素材、レイアウトなどの基本的なWebデザイン知識を学習することを目的とする。

Webデザインに求められる基礎知識を説明出来る。

評価方法・基準

※左記に示した評価項目の割合（％）を基準に、総合評価点を 算出して成績評価を行う。※出席率が80％未満の場合は、評価対象としない。

【評価基準】

①Webデザインによる専門用語が挙げられ、基本概念を説明出来ること。 ②Webデザインをする際の基本的なルールやセオリーを習得していること。

企業連携 無前期 実習・実験駒数／週

授業の目的 到達目標

区分 開講時期1年次 講義・演習駒数／週

合計駒数／週

作成日

必修 2 駒 総時間数 60時間

講義／演習 0 駒 総単位数 4単位

【評価方法】

評価項目 ①定期テスト ②小テスト ③レポート ④課題 ⑤作品 ⑥ﾎﾟｰﾄﾌｫﾘｵ ⑦成果発表 ⑧その他

割合 % % % 50% % % 50% %

回数

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

14

スライド資料は「見てわかる」シンプルさが重要。「読ませる」スライドは機能しないことを理解する。

「スライド（パワーポイント）作成のポイント」 効果的なスライド（パワーポイント）作成のポイントを学ぶ。納得しやすいロジックとストーリー。文字は見出しのみに絞る細かい文字、複雑な図や資料は必要なら添付資料とする。

15

プレゼンテーションにおける、スライド、企画書、資料の違いとその役割、効果についてを理解出来るようにする。

「成功するなプレゼンテーションとは」 納得させるプレゼンのポイント。相手の用語で話す。相手の理解度に合わせた説明方法を考える。プレゼン用スライド、企画書、添付資料の違い。企画書は一人歩きをする。

12

細かな説明よりも、相手が理解しやすいストーリー、納得出来るロジックが重要であることを理解する。

「ステップ２・効果的なプレゼン/先が聞きたくなるストーリー性」 納得させるためには「話」を聞かせる。そしてうなづかせる。その先が聞きたくなるストーリー性が必要。手元資料は後で渡す。必要なのは論点の見出し3行！。資料を読まずに内容を「語る」。

演習・一枚企画書提出

13

相手は誰か？相手を納得させるためには、相手が本当に欲していることを知ることかが重要であることを理解する。

「ステップ２・効果的なプレゼン/相手が自分自身で納得するようにする」 プレゼンの相手は誰か？再確認する。答えは相手が自分で導き出せるよう「ロジック」を渡す。難しい話にしない。誰にでもわかる言葉で説明出来るようにする。自分たちの専門用語を使わない。

演習・一枚企画書プレゼン

10

相手の立場に立った情報の整理と、相手が自分の問題として納得出来るような組み立てが重要であることを理解する。

「ステップ２・効果的なプレゼン/抽出した課題に「なるほど！」はあるか？」 依頼主の自覚症状だけでなく様々な角度から依頼主に潜在している病根を発見してあげることが重要。依頼主が「なるほど！」と声を上げる自身の問題、課題を提示できれば企画は80％成功。

11

プレゼンを受ける側の気持ち、心理状態を理解することにより、効果的なプレゼンが出来ることを理解する。

「ステップ２・効果的なプレゼン/提案にも「なるほど！」はあるか？」 成功するプレゼンでは、抽出した課題で「なるほど！」があり、その解決策の提案にも「なるほど！」がある。ふたつの「なるほど！」が提案者への信頼感を生む。

8

さらに一枚企画書にまとめ、プレゼンテーションしてみることで自分の説明に納得性がどれだけあるかを確認する。

「メモシートから作成した一枚企画書をプレゼンしてみる」 整理したメモシートから、さらに1枚企画書に整理してみる。それをもとに全員に自分の企画をプレゼンテーションし、相互に評価してみる。理解できるか？納得性はあるか？

演習・一枚企画書プレゼン

9

オリエンされた内容をどう理解するか？先入観や既存概念にとらわれない視点で企画が立てられるようにする。

「ステップ２・効果的なプレゼン/オリエンの読み方」 オリエンを行っているのは誰か？プレゼンの相手は誰か？決定者か、担当者か？　依頼主は患者、デザイナーは医者だと考える。依頼主は自覚症状を訴えているだけであることを知る。

6

（実作業に並行して）メモシートの要点を整理することで企画説明の筋書きを確認することが出来ることを体得する。

「メモシートを整理し企画説明の順番を考える」 メモシートを元に企画説明を想定して要点を整理する。さらにそれを図式に書き起こし、自分の考える企画が論理的に説明出来るかチェックする。

7

論理的な組み立て、骨格からの組み立てが先行していないとプレゼンが破綻することを理解する。

「メモシートから考えた企画説明に沿って、一枚企画書にする」 図式で詳細情報を肉付けしていく。プレゼンテーション（企画書）の骨組みは組み立てられているか？自分だけが理解したつもりになっていないか？５W2H、マジックナンバー３でチェックする。

演習・一枚企画書提出

4

文書を書く前にまず図式で考えることで論理的思考を養う。その中で「課題の抽出」が最も重要であることを理解する。

「企画の進め方・考えを言葉にし、図式にし 一枚企画書にする」 まず一枚企画書を書いてみる。様々な要素を「課題」「到達目標」「解決策の提案」に分けて「言葉」にする。それを図式でつないで考える。「本当の病因（課題）」「治療法の提案」を探り出す。

演習・一枚企画書提出

5

（実作業に並行して）、企画作業から、どのように企画書へ展開していくのかなど、企画書制作の進め方について体得する。

「段階ごとにメモシートを作り、企画書を組み立てる」 オリエン、調査、検討など段階ごとにメモシートを作る。「わかったこと」「見えてきたこと」「考えたこと」をメモに。アイデアが浮かばなくても提案内容シートは必ず作る。要点をまとめ一枚企画書に。

演習・一枚企画書プレゼン

2依頼主を納得させるという企画書の目的を認識し、仕様書、説明書との違いが説明出来る。

「企画とは何か？企画書とは何か？プレゼンとは何か？」2 「研究発表のプレゼン」と「企画提案のプレゼン」は目的も内容も違う。従って「企画書」は「報告書」「説明書」「仕様書」などとは違うことを理解する。　「理解」だけではなく「納得」させることが目的。

3

自分の考えを論理的にまとめ、構成する手法について学び実際の企画立案、企画書制作に活かせるようにする。

「企画の進め方・考え方を論理的に構成する」 プレゼン＋企画書の第一ステップは自分の考えを「理解してもらえるレベル」にすること。そのためには論理的に構成し、論理的に説明できることが必要となる。

学習目標 学習項目

1

デザイン業務の中で、依頼主と「企画」を共有するために「企画書＋プレゼン」が重要であることを理解する。

「企画とは何か？企画書とは何か？プレゼンとは何か？」１　 デザインは依頼主があり、到達目的がある業務。依頼主と課題やその解決策を共有し、コミニュケーションを図るためのプレゼン＋企画書。見栄えやカッコ良さでは無い。

関連科目 履修前提 ※選択科目のみ記載

Webデザイン技法、グラフィック実習、JavaScript実習、HTML&CSS実習

担当教員 峯川 卓 テキスト・参考文献

　【科目内容に沿った実務経験】　有・オリジナル教材 ・「見やすいプレゼン資料の作り方」　森重湧太

広告会社にて長く広告主担当として企画・プレゼンテーションの実務経験がある。これらの知識と経験を活かしてWeb制作における企画立案、プレゼンテーションを指導する。

自分が考えていることを整理し言葉でまとめる力を身に着け、論理的に構成しそれを相手に効果的に伝えるための手法を習得する。

企画書作成、プレゼンテーションの基本は依頼主にとっての「課題の発見」であり、「解決策の提案」であることを理解する。自分が考えていることを的確に効果的に伝えるためのコミュニケーションスキルを、主として演習により体得していく

評価方法・基準

※左記に示した評価項目の割合（％）を基準に、総合評価点を 算出して成績評価を行う。※出席率が80％未満の場合は、評価対象としない。

【評価基準】

①自分の考えを言葉でまとめることができること ②提案内容を論理的に構成することができること ③企画書の基本形を作ることができること④クライアントへの説明の仕方、話し方の基本を習得していること

企業連携 無前期 実習・実験駒数／週

授業の目的 到達目標

区分 開講時期1年次 講義・演習駒数／週

合計駒数／週 2 駒

Ｗｅｂデザイン科 シラバス 2020年度入学生

科目名 企画書作成＆プレゼンテーション 2020年3月6日

作成日

必修 1 駒 総時間数 30時間

演習 0 駒 総単位数 2単位

【評価方法】

評価項目 ①定期テスト ②小テスト ③レポート ④課題 ⑤作品 ⑥ﾎﾟｰﾄﾌｫﾘｵ ⑦成果発表 ⑧その他

割合 % 20% % 50% % % 30% %

回数

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

14

【チーム】「伝える」を「伝わる」に変えるポイントを理解し、相手に伝わる言葉を使ってコミュニケーションできる。

「コミュニケーション」について以下を学習する。 ①伝えるとは　②Web業界あるある　③みえない・きこえない・はなせないを体験する

体験型ワークショップで気づきをまとめる

15チーム制作で大切にしなければならない事項をまとめることができる。 チーム制作について

確認問題

12

論理的思考力をフレームで身につけ、相手の立場に立ったわかりやすいコミュニケーションができる。

「論理的的思考力」について以下を学習する。 ①エレベーターピッチとは？　②ロジカルシンキングとは　③ロジカルシンキングの基本的な考え方（1.MECE　2.So What?/Why so?　④ワークで確認

ワーク１、ワーク２

13

【チーム】「伝える」を「伝わる」に変えるポイントを理解し、相手に伝わる言葉を使ってコミュニケーションできる。

「コミュニケーション」について以下を学習する。 ①伝えるとは　②Web業界あるある　③みえない・きこえない・はなせないを体験する

体験型ワークショップで気づきをまとめる

10チームワークを高めて目標を達成するべくポイントを理解し、アクションすることができる。

「チームワーク」について以下を学習する。 ①チームとは　②チームに必要な５つの要素　③チームワークを最大化させる方法　④気を付けなければならないこと

レゴワークショップ、発表

11

論理的思考力をフレームで身につけ、相手の立場に立ったわかりやすいコミュニケーションができる。

「論理的的思考力」について以下を学習する。 ①エレベーターピッチとは？　②ロジカルシンキングとは　③ロジカルシンキングの基本的な考え方（1.MECE　2.So What?/Why so?　④ワークで確認

ワーク１、ワーク２

8【チーム】情報の整理しながら、ECサイトのトップページを表現することができる。

「情報の分類（LATCH法）について以下を学習する。 ①サイトの目的　②ペルソナ　③情報整理（分類）　④ラベリング　⑤表現　⑥発表

サイトのモックアップ制作、発表

9チームワークを高めて目標を達成するべくポイントを理解し、アクションすることができる。

「チームワーク」について以下を学習する。 ①チームとは　②チームに必要な５つの要素　③チームワークを最大化させる方法　④気を付けなければならないこと

レゴワークショップ、発表

6手順を考えて強調するためのテクニックを使って表現することができる。

「手順を考えてつくる」について以下を学習する。 ①色を使って目立たせる１　②色を使って目立たせる２　③図と地を使って目立たせる　④サイズを使って目立たせる　⑤余白を使って目立たせる　⑥揃えないで目立たせる

演習問題、発表

7【チーム】情報の整理しながら、ECサイトのトップページを表現することができる。

「情報の分類（LATCH法）について以下を学習する。 ①サイトの目的　②ペルソナ　③情報整理（分類）　④ラベリング　⑤表現　⑥発表

サイトのモックアップ制作、発表

4【チーム】課題解決に向けたツールを選び、その理由を伝えることができる。

「課題解決に向けたツール選び」について以下を学習する。 ①役割を決める　②ストーリーをまとめる　③目的に応じたアプリを探す　④アプリの発表をする

演習シートまとめ、発表

5手順を考えて強調するためのテクニックを使って表現することができる。

「手順を考えてつくる」について以下を学習する。 ①色を使って目立たせる１　②色を使って目立たせる２　③図と地を使って目立たせる　④サイズを使って目立たせる　⑤余白を使って目立たせる　⑥揃えないで目立たせる

演習問題、発表

2発想法の一つである「マインドマップ」手法を使ってアイデアを形にすることができる。

「マインドマップ」について以下を学習する。 ①マインドマップとは　②用意するもの　③マインドマップの書き方　④事例　⑤メリット　⑥導入している企業　⑦参考図書　⑧マインドマップ作成と発表

マインドマップ作製と発表

3【チーム】課題解決に向けたツールを選び、その理由を伝えることができる。

「課題解決に向けたツール選び」について以下を学習する。 ①役割を決める　②ストーリーをまとめる　③目的に応じたアプリを探す　④アプリの発表をする

演習シートまとめ、発表

学習目標 学習項目

1発想法の一つである「マインドマップ」手法を使ってアイデアを形にすることができる。

「マインドマップ」について以下を学習する。 ①マインドマップとは　②用意するもの　③マインドマップの書き方　④事例　⑤メリット　⑥導入している企業　⑦参考図書　⑧マインドマップ作成と発表

マインドマップ作製と発表

関連科目 履修前提 ※選択科目のみ記載

Webデザイン技法、企画書作製＆プレゼンテーション、チーム制作Ⅱ

担当教員 小山内 靖美 テキスト・参考文献

　【科目内容に沿った実務経験】　有

オリジナルスライド教材電気設備会社の社内システムにてUIの設計、ペーパープロトタイプ制作の実務経験がある。その経験から取得した知識とスキルを活かして、本科目のUIデザインに対する職業実践的な教育を行う。

チーム制作において、チームワークには何が必要であるのか。その中におけるメンバーの位置づけはどうあるべきかについて学習することを目的とする。

チームワークについて、演習を通じた体験により深く理解し、体験演習の内容を振り返りながらまとめることができます。

評価方法・基準

※左記に示した評価項目の割合（％）を基準に、総合評価点を 算出して成績評価を行う。※出席率が80％未満の場合は、評価対象としない。

【評価基準】

①チーム制作において大切にしなければならない事項が挙げられること。 ②チームやチームメンバーとの関わり方を習得できること。 ③周囲とよい関係を築きながら制作することを意識することができること。

企業連携 無前期 実習・実験駒数／週

授業の目的 到達目標

区分 開講時期1年次 講義・演習駒数／週

合計駒数／週 1 駒

Ｗｅｂデザイン科 シラバス 2020年度入学生

科目名 チーム制作Ⅰ 2020年3月6日

作成日

必修 1 駒 総時間数 30時間

講義／実習 0 駒 総単位数 2単位

【評価方法】

評価項目 ①定期テスト ②小テスト ③レポート ④課題 ⑤作品 ⑥ﾎﾟｰﾄﾌｫﾘｵ ⑦成果発表 ⑧その他

割合 % % % 10% % % % 90%

回数

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

14フォントと文字組の基礎を学び、文字で表現することが出来る。 フォントの種類、組み方、文字詰め、文字が与えるイメージを学ぶ。

課題

15ターゲットやコンセプトに沿った配色を選ぶことが出来る。 指定のターゲットやコンセプトを考慮し、表現する配色を考える。

課題

12自分を表現するデザインを考え、配色を決める。 グラフィック実習での名刺作成にあたって、自分を表現するデザイン・色彩を考える。

課題

13印刷物のデザインの基本を学び、名刺を作成することが出来る。 グラフィック実習課題の名刺デザインを完成させる。

課題

10これまでの振り返り。試験問題の解説を行い、色彩学に対する理解度を再確認出来る。 試験問題の解説

確認問題

11実践的なWebサイト制作⑥ グラフィック実習でのサイトデザインが完成していない学生の制作予備時間

課題

8色彩と生活について理解し、問題に解答することが出来る。 ファッションコーディネートにおける色彩、インテリアにおける色彩効果

確認問題

9試験前の準備。自分の理解度を確認・把握し、試験への対策をまとめる。 過去問題を実施、解説

確認問題

6色彩心理について理解し、問題に解答することが出来る。 色の視覚効果、色の知覚的効果

確認問題

7色彩調和について理解し、問題に解答することが出来る。 配色の基本的な考え方、技法。アクセントカラー、セパレーション、グラデーションについて

確認問題

4PSSC、トーンについて理解し、問題に解答することが出来る。 色相、トーン、トーンによる色の表示方法

確認問題

5色彩心理について理解し、問題に解答することが出来る。 暖色・寒色について、色がもたらす心理的効果

確認問題

2光と色の関係について理解し、問題に解答することが出来る。 光の性質、眼の仕組み、照明と色の見え方

確認問題

3色の表示について理解し、問題に解答することが出来る。 混色について、色の分類と三属性について

確認問題

学習目標 学習項目

1色彩学の意識を持ち、色がもたらす効果・役割を説明出来る。

ガイダンス、願書作成、色のはたらき、世の中のデザインにどのように色が使われているのか分析・解説

確認問題

関連科目 履修前提 ※選択科目のみ記載

グラフィック実習、イラストレーション

担当教員 萬両 小夜子 テキスト・参考文献

　【科目内容に沿った実務経験】　有

文部科学省後援　色彩検定公式テキスト　3級編 オリジナルスライド教材

Webデザイナーとして、さまざまなWebサイト制作の実務経験がある。 その経験から取得した知識とスキルを活かして、デザインに応用できる色彩の考え方、色彩力について教育を行う。

色彩検定3級の合格を目指し、色彩の基礎知識を身につけながら、デザインに活かせる色彩力を高める。

色彩検定3級取得（試験実施：6月28日） デザインなど制作に色彩学を活かすことが出来る。

評価方法・基準

※左記に示した評価項目の割合（％）を基準に、総合評価点を 算出して成績評価を行う。※出席率が80％未満の場合は、評価対象としない。

【評価基準】

①色彩検定の合否 ②デザインをする際に、色彩学に基いた色の選定ができること

企業連携 無前期 実習・実験駒数／週

授業の目的 到達目標

区分 開講時期1年次 講義・演習駒数／週

合計駒数／週 1 駒

Ｗｅｂデザイン科 シラバス 2020年度入学生

科目名 色彩演習 2020年3月6日

作成日

必修 0 駒 総時間数 120時間

実習 4 駒 総単位数 4単位

【評価方法】

評価項目 ①定期テスト ②小テスト ③レポート ④課題 ⑤作品 ⑥ﾎﾟｰﾄﾌｫﾘｵ ⑦成果発表 ⑧その他

割合 % % % 30% 60% % % 10%

回数

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

14バナーデザインを通して、情報の整理、優先度を決めることが出来る① 指定された要素からバナーを作成。情報の優先度を整理し、適切なレイアウトで表現する。

課題

15バナーデザインを通して、情報の整理、優先度を決めることが出来る② 指定された要素からバナーを作成。情報の優先度を整理し、適切なレイアウトで表現する。

課題

12印刷物のデザインの基本を学び、名刺を作成することが出来る① Illustratorの設定、印刷物のデザインルール、名刺のデザインコンセプトを考える。

課題

13印刷物のデザインの基本を学び、名刺を作成することが出来る② 名刺デザインを完成させる。入稿用データの作り方。

名刺データの提出

10

実践的なWebサイト制作⑤ トップページを基に、下層ページのデザインを作成することが出来る。

下層ページのデザインを進める。OKが出た学生はPC版トップページを作成する。

課題

11

実践的なWebサイト制作⑥ トップページを基に、下層ページのデザインを作成することが出来る。

スマホ版、PC版ともに完成を目指す。

課題

8

実践的なWebサイト制作③ ワイヤーフレームを基にデザインを作成することが出来る。

前回作成したワイヤーフレームを基にスマホ版トップページのデザインを作成。

課題

9

実践的なWebサイト制作④ ワイヤーフレームを基にデザインを作成することが出来る。

一次チェックのフィードバックの反映。OKが出た学生は下層ページの作成を進める

課題

6

実践的なWebサイト制作① デザインコンセプトを決める。

企画を基に、クライアントの要望、ターゲットユーザーを踏まえデザインコンセプトを考える。

コンセプトシートの提出

7

実践的なWebサイト制作② 上流工程に基づき、企画を落とし込んだワイヤーフレームを作成することが出来る。

前回作成したデザインコンセプトを基に、XDを使いワイヤーフレームを作成。

課題

4ワイヤーフレームを基にスマホサイトのデザインを制作することが出来る① スマホサイトのデザインを作成する。テキストツール、シェイプツール、マスクの活用。

課題

5ワイヤーフレームを基にスマホサイトのデザインを制作することが出来る② スマホサイトのデザインを作成する。拡張子の違い、書き出しについて

課題

2Photoshopを使い、写真の加工・補正が出来る。 写真の加工、補正、パス、マスクの使い方

課題

3XDを使い、ワイヤーフレームを作成することが出来る。

ワイヤーフレームの役割、XDを使ったワイヤーフレームの作り方、良い例と悪い例の比較、既存サイトのワイヤーフレーム化

課題

学習目標 学習項目

1Photoshopの操作に慣れ、簡単なレイアウトを組むことが出来る。

ガイダンス、各アプリケーションの役割、Webサイト制作の流れ、Photoshopの基本操作（シェイプツール、テキストツール）

課題

関連科目 履修前提 ※選択科目のみ記載

Webデザイン技法、企画書作成＆プレゼンテーション、JavaScript実習、HTML&CSS実習、色彩演習、写真撮影・映像演出技法

担当教員 萬両 小夜子 テキスト・参考文献

　【科目内容に沿った実務経験】　有オリジナルスライド教材 Webデザイナーとして、さまざまなWebサイト制作の実務経験がある。

その経験から取得した知識とスキルを活かして、本科目のWebデザインに対する実践的な教育を行う。

Webデザイン制作に必要なアプリケーションの操作と、デザインに関する基礎知識と表現力を身につける。

Adobe Photoshop、Illustrator、XDを使い分けWebサイトのデザインを制作することが出来る。

評価方法・基準

※左記に示した評価項目の割合（％）を基準に、総合評価点を 算出して成績評価を行う。※出席率が80％未満の場合は、評価対象としない。

【評価基準】

①デザイン制作にあたって各アプリケーションの基本操作を習得していること ②上流工程に基づいたデザインを制作、説明出来ること

企業連携 無通年 実習・実験駒数／週

授業の目的 到達目標

区分 開講時期1年次 講義・演習駒数／週

合計駒数／週 4 駒

Ｗｅｂデザイン科 シラバス 2020年度入学生

科目名 グラフィック実習 2020年3月6日

作成日

必修 0 駒 総時間数 120時間

実習 4 駒 総単位数 4単位

【評価方法】

評価項目 ①定期テスト ②小テスト ③レポート ④課題 ⑤作品 ⑥ﾎﾟｰﾄﾌｫﾘｵ ⑦成果発表 ⑧その他

割合 % % % 30% 50% % % 20%

回数

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

14既存サイトを模倣し、表現の手法を解釈出来る① 既存サイトのデザインを模倣し、表現の手法を学ぶ。

課題

15既存サイトを模倣し、表現の手法を解釈出来る② 既存サイトのデザインを模倣し、表現の手法を学ぶ。

課題

12進級制作用パネルを作成することが出来る。 印刷物のデザインルールの再確認。進級制作用パネルの作り方

課題

13デザインの表現の幅を広げ、さまざまなテイストのデザインを作成することが出来る。

指定された要素を基に数パターンのデザインを作成。レイアウト、配色、文字の組み合わせで異なるテイストを表現。

課題

10進級制作のモックアップを作成することが出来る。 進級制作のモックアップを作成する。

課題

11進級制作のモックアップを作成することが出来る。 進級制作のモックアップを作成する。

課題

8進級制作のモックアップを作成することが出来る。 進級制作のモックアップを作成する。

課題

9進級制作のモックアップを作成することが出来る。 進級制作のモックアップを作成する。

課題

6進級制作のモックアップを作成することが出来る。 進級制作のモックアップを作成する。

課題

7進級制作のモックアップを作成することが出来る。 進級制作のモックアップを作成する。

課題

4リッチデザインを作成することが出来る②

Photoshopを使い、リッチデザインの表現方法を学ぶ。テクスチャ、パターン、レイヤースタイルの使い方

課題

5リッチデザインを作成することが出来る③

Photoshopを使い、リッチデザインの表現方法を学ぶ。テクスチャ、パターン、レイヤースタイルの使い方

課題

2プレゼン資料のデザインを考え、情報をより伝えやすくする見せ方を表現出来る②

インフォグラフィック。Illustratorを使用したグラフの作り方。 数値データを視覚化し、情報をより伝わりやすくするための手法。

課題

3リッチデザインを作成することが出来る①

Photoshopを使い、リッチデザインの表現方法を学ぶ。テクスチャ、パターン、レイヤースタイルの使い方

課題

学習目標 学習項目

1プレゼン資料のデザインを考え、情報をより伝えやすくする見せ方を表現出来る①

インフォグラフィック。Illustratorを使用したグラフの作り方。 数値データを視覚化し、情報をより伝わりやすくするための手法。

課題

関連科目 履修前提 ※選択科目のみ記載

進級制作

担当教員 萬両 小夜子 テキスト・参考文献

　【科目内容に沿った実務経験】　有

オリジナルスライド教材Webデザイナーとして、さまざまなWebサイト制作の実務経験がある。 制作現場での経験を活かし、実践的なデザインスキルの習得、応用力に関する教育を行う。

実践的な演習課題により、デザインの手法と表現力を身につける。 デザインの引き出し、表現の幅を広げ、さまざまなテイストのデザインを制作することが出来る。

評価方法・基準

※左記に示した評価項目の割合（％）を基準に、総合評価点を 算出して成績評価を行う。※出席率が80％未満の場合は、評価対象としない。

【評価基準】

①デザイン制作にあたって各アプリケーションの役割を理解し、使い分けが出来ること ②上流工程に基づいたデザインを制作、説明出来ること ③さまざまなテイストのデザインを表現出来ること

企業連携 無通年 実習・実験駒数／週

授業の目的 到達目標

区分 開講時期1年次 講義・演習駒数／週

合計駒数／週 4 駒

Ｗｅｂデザイン科 シラバス 2020年度入学生

科目名 グラフィック実習 2020年3月6日

作成日

必修 4 駒 総時間数 120時間

演習 0 駒 総単位数 8単位

【評価方法】

評価項目 ①定期テスト ②小テスト ③レポート ④課題 ⑤作品 ⑥ﾎﾟｰﾄﾌｫﾘｵ ⑦成果発表 ⑧その他

割合 % % % % 100% % % %

回数

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

14

ZINEの各ページの描写内容を更に具体化し、最適の画材・技法を選定の上、本番制作を進めることが出来る。

【ZINE形式の作品制作(2)】　前授業で計画した展開内容を具体的に描写・表現する方法を画材・技法の検討も含めて実践的に学習する。

課題作品の途中経過の確認。

15

前回からの制作を進め、全ページを通しての表現の質や内容の伝わり易さ等を確認しながら作品を仕上げることが出来る。

【ZINE形式の作品制作(3)】　前授業で進めた制作状況の全体的バランスを確かめながら、作品を仕上げる方法を実践的に学習する。

課題作品の確認、評価。

12

制作当初に思い浮かべた感覚的イメージが充分表現されていることを確認しながら、作品を仕上げることが出来る。

【感覚に重点を置いたイラストレーションの制作(4)】　前授業に引き続き制作を進め、制作意図の反映度合を確認しながら作品を仕上げる方法を実践的に学習する。

課題作品の確認、評価。

13

ZINEの主な表現例を説明出来る。課題テーマに沿って独自のイメージ展開を案出し、それをラフスケッチに描き表すことが出来る。

【ZINE形式の作品制作(1)】　ZINEの表現例を学習する。その後、課題テーマに沿って、ZINE形式でイメージを展開する表現方法を実践的に学習する。

アイディアのヒアリング、ラフスケッチの確認。

10前授業で案出したイメージを更に具体化して、作品の下絵を制作することが出来る。

【感覚に重点を置いたイラストレーションの制作(2)】　前授業で描き起こしたラフスケッチに基づいて、更に具体的な描写を進め、下絵を描く方法を実践的に学習する。

課題作品の途中経過の確認。

11作品の表現に適した画材や技法を選定し、本番制作を進めることが出来る。

【感覚に重点を置いたイラストレーションの制作(3)】　目指す表現に適した画材・技法を選定し、イラストレーションを制作する方法を実践的に学習する。

課題作品の途中経過の確認。

8

前授業で習得した人体の描写方法の知識を応用して、特定の条件に沿ってイメージした視点や動き、また表情等を含めた人物描写が出来る。

【特定の条件下での人物描写】　前授業で習得した対象の捉え方・描写方法を活かして、幾つかの想定状況に沿って人物描写をする方法を実践的に学習する。

課題作品の確認、評価。

9

課題テーマの概念について熟考した上で独自の感覚的なイメージを案出し、具体的なラフスケッチに描き起こすことが出来る。

【感覚に重点を置いたイラストレーションの制作(1)】(コンテスト応募作品)　出題されたテーマに沿って、心に浮かんだイメージをラフスケッチで具体的に描き起こす方法を学習する。

アイディアのヒアリング、ラフスケッチの確認。

6

特定のモチーフをスケッチして、その特徴を把握し、強調してイラストレーションとして表現することが出来る。アクリル絵具で厚塗り表現が出来る。

【スケッチ～イラストレーション表現】　特定のモチーフをスケッチし、その特徴を意識的に強調して表現する方法を学習する。併せて、アクリル絵具の厚塗り表現の方法を実践的に学習する。

課題作品の確認、評価。

7

身近な立体物や人体の基本構造を説明出来る。幾つかの視点や動き等に応じて、立体物や人体の基本形体を描き起こすことが出来る。

【物や人体の作画の基本】　物や人体の基本構造を学習し、その知識を活かして、様々な視点や動き等に応じた作画方法を実践的に学習する。

課題作品の確認、評価。

4モチーフを全体的に捉えて、紙面に鉛筆で大まかな形を描き起こすことが出来る。

【鉛筆デッサン(1)】　モチーフの観察方法や画面への入れ方、鉛筆の使い方等、デッサンの描き起こしの段階の重要点を実践的に学習する。

課題作品の途中経過の確認。

5

更に観察して得たモチーフの情報・印象(形、立体感、質感等)を鉛筆の幅広いグレートーンを用いて表現出来る。

【鉛筆デッサン(2)】　鉛筆のタッチやトーン表現による形体、立体感、質感等の描写の進め方を実践的に学習する。

課題作品の確認、評価。

2

身近な物や人物を下描き無しでドローイングすることが出来る。描いた線画を基に色鉛筆画を制作することが出来る。

【ドローイング～色鉛筆による着彩】　物や人物等の実在のモチーフを観察して、線で描き表す方法を実践的に学習する。併せて、描いた線画に色鉛筆で着彩する方法を実践的に学習する。

課題作品の確認、評価。

3

色面構成作品の線画部分をペンで描くことが出来る。 描いた線画にアクリル絵具で着彩して、作品を仕上げることが出来る。

【色面構成】　前授業で描いた線画を素材にした色面構成の制作を通し、形、色彩、タッチ等の基本的表現方法を実践的に学習する。併せて、アクリル絵具の水彩的表現法も実践的に学習する。

課題作品の確認、評価。

学習目標 学習項目

1

イラストレーションの主な表現例や役割について説明出来る。鉛筆をカッターで削ることが出来る。芯の硬度を使い分けてグレースケールを制作出来る。

【ガイダンス～グレースケールの制作】　前半：イラストレーション表現の多様性や様々な役割を学習する。後半：鉛筆の扱い方、グレースケールの制作方法を実践的に学習する。

課題作品の確認、評価。

関連科目 履修前提 ※選択科目のみ記載

色彩演習、卒業制作

担当教員 半井 馨 テキスト・参考文献

　【科目内容に沿った実務経験】　有

イラストレーターとして出版、広告等、様々なデザイン制作物の中で作品制作を手掛ける。その経験から得た知識とスキルを活かして、視覚伝達の重要な要素としてのイラストレーション表現について実地的な教育を行う。

基本的な描画・着彩表現の実践を通してイラストレーションの表現力を高めることで、Web制作における視覚伝達の基礎力を体得することを目的とする。

各種画材の基本的な扱い方を習得してイラストレーション制作に活かすことが出来る。自分の発想・感覚を活かしてイラストレーションを制作することが出来る。

評価方法・基準

※左記に示した評価項目の割合（％）を基準に、総合評価点を 算出して成績評価を行う。※出席率が80％未満の場合は、評価対象としない。

【評価基準】

①各種画材を使って、色彩・形体における基本的表現ができること。 ②様々なモチーフの特徴を掴み、イラストレーションとして表現できること。 ③自分の発想をイラストレーション表現に活かすことができること。

企業連携 無通年 実習・実験駒数／週

授業の目的 到達目標

区分 開講時期1年次 講義・演習駒数／週

合計駒数／週 4 駒

Ｗｅｂデザイン科 シラバス 2020年度入学生

科目名 イラストレーション 2020年3月6日

作成日

必修 4 駒 総時間数 120時間

演習 0 駒 総単位数 8単位

【評価方法】

評価項目 ①定期テスト ②小テスト ③レポート ④課題 ⑤作品 ⑥ﾎﾟｰﾄﾌｫﾘｵ ⑦成果発表 ⑧その他

割合 % % % % 100% % % %

回数

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

14

キャラクターに動きや表情等の表現を付けることが出来る。一枚のイラストレーションとして、表現に適した画材・技法を用いて作品制作を進めることが出来る。

【キャラクター表現／応用作品への展開(2)】　課題のテーマ・条件に対して、より効果のあるキャラクターの動きや表情を考えながら、作品制作を進める方法を実践的に学習する。

課題作品の途中経過の確認。

15

制作意図を伝える上で効果的なキャラクター表現になっていることを確認しながら、作品を仕上げることが出来る。

【キャラクター表現／応用作品への展開(3)】　制作意図が表現に充分反映されている事を確認しながら、イラストレーションを仕上げる方法を実践的に学習する。

課題作品の確認、評価。

12

キャラクターデザインの概要を説明出来る。課題テーマに沿って独自のアイディアでキャラクターをデザインし、ラフスケッチに描き表すことが出来る。

【キャラクター表現／デザイン画制作(1)】　キャラクターデザインの概要を学習する。課題のテーマ・条件に沿ってキャラクターを案出し、そのデザインをラフスケッチで描き表わす方法を実践的に学習する。

アイディアのヒアリング、ラフスケッチの確認。

13

絵と文章の構成で、キャラクターの特徴等が他者に充分伝わるデザイン設定画を仕上げることが出来る。デザインしたキャラクターが登場する作品のラフスケッチを描くことが出来る。

【キャラクター表現／デザイン画制作(2)～応用作品への展開(1)】　プレゼンテーション用を想定したキャラクターのデザイン設定画を仕上げる方法、及び、その応用作品のイメージをラフスケッチに描く方法を実践的に学習する。

課題作品の確認。ラフスケッチの確認。

10表現に適した画材・技法を選び、作品制作を進めることが出来る。

【イラストマップの制作(3)】　目指す表現に適した画材・技法を決めた上で、イラストマップの制作を進める方法を実践的に学習する。

課題作品の途中経過の確認。

11

イラストレーションの表現力によってマップ情報が充分伝わる作品に仕上げることが出来る。

【イラストマップの制作(4)】　マップとしての情報の伝わり易さと、イラストレーションとしての表現性の双方を確認しながらイラストマップを仕上げる方法を実践的に学習する。

課題作品の確認、評価。

8

イラストマップという表現形態の概要について説明出来る。素材として決定・調査したマップ情報を基に、作品全体の構成や描写内容をラフスケッチに描き表すことが出来る。

【イラストマップの制作(1)】　イラストマップの概要について学習する。その後、取り扱うマップ情報を決定・調査し、全体の構成や描写内容をラフスケッチに描き表す方法を実践的に学習する。

アイディアのヒアリング、ラフスケッチの確認。

9

イラストマップの構成要素(イラスト、キャプション等)の具体的な表現を定めながら全体の構成を整えて、下絵を制作することが出来る。

【イラストマップの制作(2)】　マップ等のイラスト部分やタイトル、キャプション等の具体的内容を定めると共に、全体の構成を整えて下絵を描き進める方法を実践的に学習する。

課題作品の途中経過の確認。

6

表現に適した各種素材を選定・用意し、それらを用いてコラージュ作品の制作を進めることが出来る。

【コラージュ技法を応用したイラストレーションの制作(2)】　目指す表現に適した素材を用意した上で、コラージュ作品を制作する方法を実践的に学習する。

課題作品の途中経過の確認。

7

各種素材や描画部分等の構成による全体感を確認しながら、作品を仕上げることが出来る。

【コラージュ技法を応用したイラストレーションの制作(3)】　各種素材や描画部分等、様々な要素の構成を取りまとめて、コラージュ作品を仕上げる方法を実践的に学習する。

課題作品の確認、評価。

4

制作意図の反映度を中心に作品を客観視することが出来ると共に、その判断に沿って作品を仕上げることが出来る。

【言葉から連想するイメージのイラストレーション表現(4)】　制作意図が充分反映されているかどうかを確認しながら作品を仕上げる方法を実践的に学習する。

課題作品の確認、評価。

5

コラージュの主な技法や表現効果について説明出来る。課題テーマに沿ってイメージを案出し、ラフスケッチに描き起こすことが出来る。

【コラージュ技法を応用したイラストレーションの制作(1)】　コラージュの技法や表現効果について学習する。その後、課題テーマから想起されたイメージをラフスケッチに描き起こす方法を実践的に学習する。

アイディアのヒアリング、ラフスケッチの確認。

2

前授業で描いたラフスケッチからイメージを更に具体化し、作品の下絵を制作することが出来る。

【言葉から連想するイメージのイラストレーション表現(2)】　前授業で描いたラフスケッチを基に具体的描写を進め、作品の下絵を制作する方法を実践的に学習する。

課題作品の途中経過の確認。

3

前授業で制作した下絵を基に、表現に適した画材や技法を決めて作品制作を進めることが出来る。

【言葉から連想するイメージのイラストレーション表現(3)】　目指す表現に適した画材や技法を選定した上で、イラストレーション制作を進める方法を実践的に学習する。

課題作品の途中経過の確認。

学習目標 学習項目

1課題テーマに沿って案出したイメージをラフスケッチに描き表すことが出来る。

【言葉から連想するイメージのイラストレーション表現(1)】　(コンテスト応募作品)　　テーマに沿ってアイディアを出し、そのイメージをラフスケッチで具体的に描き起こす方法を実践的に学習する。

アイディアのヒアリング、ラフスケッチの確認。

関連科目 履修前提 ※選択科目のみ記載

担当教員 半井 馨 テキスト・参考文献

　【科目内容に沿った実務経験】　有

　イラストレーターとして、出版、広告等、様々なデザイン制作物の中で作品制作を手掛ける。その経験から得た知識とスキルを活かして、視覚伝達の重要な要素としてのイラストレーション表現について実地的な教育を行う。

発想・感覚・情報等の伝え方に工夫を要するイラストレーションの制作を通して、充実したWebデザイン制作に必要な視覚的表現力やコミュニケーション能力を体得することを目的とする。

他者とのコミュニケーション性に重点を置いた各課題において、自身の発想や感覚を活かしながら課題条件を満たしたイラストレーション作品を制作することが出来ること。

評価方法・基準

※左記に示した評価項目の割合（％）を基準に、総合評価点を 算出して成績評価を行う。※出席率が80％未満の場合は、評価対象としない。

【評価基準】

①各種画材の扱い方や表現の違いを説明出来、その知識を活かしてイラストレーションを制作出来ること。 ②制作意図や表現内容が他者に充分伝わるイラストレーションを制作出来ること。 ③課題の主旨を充分把握した上で、自身の発想や感覚を作品に活かすことが出来ること。

企業連携 無通年 実習・実験駒数／週

授業の目的 到達目標

区分 開講時期1年次 講義・演習駒数／週

合計駒数／週 4 駒

Ｗｅｂデザイン科 シラバス 2020年度入学生

科目名 イラストレーション 2020年3月6日

作成日

必修 1 駒 総時間数 30時間

講義／演習 0 駒 総単位数 2単位

【評価方法】

評価項目 ①定期テスト ②小テスト ③レポート ④課題 ⑤作品 ⑥ﾎﾟｰﾄﾌｫﾘｵ ⑦成果発表 ⑧その他

割合 % % % 80% % % % 20%

回数

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

14

イメージスケールを用い、デザインの収集、分析を行い、イメージマップから新しいデザインイメージを着想出来る。

基軸(縦軸/横軸)を中心としたフィールドの中で収集した商品、製品などの画像の等価価値を落とし込み、どのエリアのが多いか、少ないかを比較・分析し、隙間エリアの製品デザインはどのようなものが考えられるか提案する。

課題作成

15

イメージスケールを用い、デザインの収集、分析を行い、イメージマップから新しいデザインイメージを着想出来る。

基軸(縦軸/横軸)を中心としたフィールドの中で収集した商品、製品などの画像の等価価値を落とし込み、どのエリアのが多いか、少ないかを比較・分析し、隙間エリアの製品デザインはどのようなものが考えられるか提案する。

課題作成、提出

12属性列挙法で既存 Web サイトを検証し、Webサイトの改善案を作成出来る。

対象となる既存サイトの属性を列挙し、属性の変更、修正するリストを作成し、デザインやコンテンツを改善する方法を演習する。

課題作成、提出

13

イメージスケールを用い、デザインの収集、分析を行い、イメージマップから新しいデザインイメージを着想出来る。

基軸(縦軸/横軸)を中心としたフィールドの中で収集した商品、製品などの画像の等価価値を落とし込み、どのエリアのが多いか、少ないかを比較・分析し、隙間エリアの製品デザインはどのようなものが考えられるか提案する。

課題作成

10属性列挙法で既存 Web サイトを検証し、Webサイトの改善案を作成出来る。

対象となる既存サイトの属性を列挙し、属性の変更、修正するリストを作成し、デザインやコンテンツを改善する方法を演習する。

課題作成

11属性列挙法で既存 Web サイトを検証し、Webサイトの改善案を作成出来る。

対象となる既存サイトの属性を列挙し、属性の変更、修正するリストを作成し、デザインやコンテンツを改善する方法を演習する。

課題作成

8

word-impression法（水平発想と垂直発想）を理解し、キーワードをオリジナルなマーク・様式で表現出来る。

企業のロゴマークにこめられるコンセプチュアルキーワード。例えば「安全・安心」「信頼」「チャレンジ」「エコ」等のキーワードから、水平連想される新たなキーワードを創出し、新たなデザインを考案する。 （キーワード、アイデア、バリエーション展開、作品化）

課題作成

9

word-impression法（水平発想と垂直発想）を理解し、キーワードをオリジナルなマーク・様式で表現出来る。

企業のロゴマークにこめられるコンセプチュアルキーワード。例えば「安全・安心」「信頼」「チャレンジ」「エコ」等のキーワードから、水平連想される新たなキーワードを創出し、新たなデザインを考案する。 （キーワード、アイデア、バリエーション展開、作品化）

課題作成、提出

6テキストの可視化。様々なバリエーションを創案出来る。

「戻る」「進む」「書く」「音」「時間」「右」「左」「送る」等のワードを記号化する。記号化は、できるだけ多くのバリエーションを派生させ、その中からオリジナルな表現を構築する。 （アイデア、バリエーションの展開）

課題作成、提出

7

word-impression法（水平発想と垂直発想）を理解し、キーワードをオリジナルなマーク・様式で表現出来る。

企業のロゴマークにこめられるコンセプチュアルキーワード。例えば「安全・安心」「信頼」「チャレンジ」「エコ」等のキーワードから、水平連想される新たなキーワードを創出し、新たなデザインを考案する。 （キーワード、アイデア、バリエーション展開、作品化）

課題作成

4テキストの可視化。様々なバリエーションを創案出来る。

「戻る」「進む」「書く」「音」「時間」「右」「左」「送る」等のワードを記号化する。記号化は、できるだけ多くのバリエーションを派生させ、その中からオリジナルな表現を構築する。 （アイデア、バリエーションの展開）

課題作成

5テキストの可視化。様々なバリエーションを創案出来る。

「戻る」「進む」「書く」「音」「時間」「右」「左」「送る」等のワードを記号化する。記号化は、できるだけ多くのバリエーションを派生させ、その中からオリジナルな表現を構築する。 （アイデア、バリエーションの展開）

課題作成

2

発想法の中でも重要な「連想創造」について演習を通し、連想発想を理解し、様々なストーリーをビジュアル化出来る。

ポートレート写真を基にその人物のシークエンスをビジュアル化。「ポートレート写真」をテーマに物語を作成し、さらにイラスト、記号、ダイヤグラム等を駆使し、その人物のストーリーをグラフィカルに表現する。

課題作成

3

発想法の中でも重要な「連想創造」について演習を通し、連想発想を理解し、様々なストーリーをビジュアル化出来る。

ポートレート写真を基にその人物のシークエンスをビジュアル化。「ポートレート写真」をテーマに物語を作成し、さらにイラスト、記号、ダイヤグラム等を駆使し、その人物のストーリーをグラフィカルに表現する。

課題作成、提出

学習目標 学習項目

1

発想法を学ぶ前に、授業の全体像と構成を理解する。 Webデザインに限らずデザイン発想の価値とその役割について説明出来る。

Webデザインの発想Ⅰのカリキュラム内容の説明。 「ペットボトル」をテーマに”容器”以外の使用法を50通り以上考えてビジュアル化する。 固定概念を破り、多角的視点から、新しいフライパンを創案する。 作成したラフスケッチの中からベスト3をスケッチ、着色し、なぜそれを選んだかをコメントする。

授業内容説明、質疑応答、課題作成提出

関連科目 履修前提 ※選択科目のみ記載

担当教員 大塚 孝二 テキスト・参考文献

　【科目内容に沿った実務経験】　有

オリジナル教材博物館、美術館のグラフィックデザイン、Webデザインの企画、デザインに従事した経験から、KJ法発想やマインドマップ発想、イメージスケール発想など習得した知識、経験を活かし、本科目におけるデザイン発想法の教育を行う。

WEBデザインに関わるオリジナリティを発揮させるための発想法を学びながら、オリジナリティ創出には、各人が独自の発想手法を習得し、デザインに活かすことが必要不可欠であることを、様々な課題製作を通して身につける。

WEBデザインの発想における意義と価値について、諸々の事例と課題作成を通じて理解を深め、各自のオリジナルなデザインにつなげられる手法を導きだせること。

評価方法・基準

※左記に示した評価項目の割合（％）を基準に、総合評価点を 算出して成績評価を行う。※出席率が80％未満の場合は、評価対象としない。

【評価基準】

授業課題の内容を理解し、製作出来ること。 様々な発想を行いアイデアを導き出し、製作出来ること。 学生自身のWEBデザイン発想文法を見いだし、WEBデザイン製作に活用出来ること。

企業連携 無後期 実習・実験駒数／週

授業の目的 到達目標

区分 開講時期1年次 講義・演習駒数／週

合計駒数／週 1 駒

Ｗｅｂデザイン科 シラバス 2020年度入学生

科目名 Ｗｅｂデザイン発想法 2020年3月1日

作成日

必修 2 駒 総時間数 90時間

実習 1 駒 総単位数 5単位

【評価方法】

評価項目 ①定期テスト ②小テスト ③レポート ④課題 ⑤作品 ⑥ﾎﾟｰﾄﾌｫﾘｵ ⑦成果発表 ⑧その他

割合 % % % 60% % 30% 10% %

回数

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

14作品制作のプロセスをまとめ完結にプレゼンテーション出来る。

最終発表 　完成作品をプレゼンテーションする 　他の学生の作品を鑑賞し評価しあう

ワークシートの確認

15

人間中心設計に沿ったデザインプロセスを振り返り、人間中心設計の活用方法について解説出来る。

：リフレクション 　完成作品をプレゼンボードにまとめる。

プレゼンボードの提出

12ストーリーボーディングを元にインタフェースの制作が出来る。

モックアップ 　モックアップを作成する

ワークシートの確認

13ストーリーボーディングを元にインタフェースの制作が出来る。

モックアップ 　モックアップを作成する

ワークシートの確認

10ストーリーボーディングを制作出来る。

中間発表 　これまでのデザインプロセスを追いながら、提案内容について発表する

ワークシートの確認

11ストーリーボーディングを元にインタフェースの制作が出来る。

プロトタイプ 　提案内容についてプロトタイプを検討する（ワイヤーフレーム）

ワークシートの確認

8

ペルソナ・シナリオを作成出来る。 アイデア提案 　コンセプトマップを制作する 　ブレインストーミングにより、提案内容を導き出す

プレゼンテーション

9提案内容について簡潔に説明出来る。

アイデア提案 　コンセプトをまとめる（エレベーターピッチ） 　これまでのデザインプロセスを追いながら、提案内容について発表する

ワークシートの確認

6調査結果に基づき、サービス提案を簡潔な文章で表現出来る。

調査のまとめ 　調査のまとめとプレゼンを行う 　着眼点の発見、HMW手法によりアイデアを探索する

ワークシートの確認

7アイデア提案においてブレインストーミング手法を活用出来る。

アイデア提案 　ペルソナ・シナリオを作成する 　ユーザー調査の結果に基づき、ペルソナ・シナリオを記述する

ワークシートの確認

4フィールドワークにおいてユーザー観察ができるようになる。

ユーザ調査① 　ユーザ理解 　ユーザの利用状況におけるふるまいを観察する 　インタビュー調査する、共感マップを作成する

ワークシートの確認

5体験を元に、カスタマージャーニーマップを制作できるようになる。

インサイト調査② 　インサイトの発見 　ユーザが求めるサービスについて検討する、着眼点のWS

ワークシートの確認

2

ワークショップを通してデザイン提案におけるユーザー観察の重要性について気づきを得る。

オブザベーションワークショップ②　ユーザー観察での気づきを元にデザイン案を改良し、ペルソナ・シナリオ法を用いて企画案を明確化し、プレゼンテーションを行う

ワークショップのリフレクションシート

3課題作品を制作するために必要な要件について理解する。

課題オリエンテーション：人間中心設計プロセスに即した企画と制作のためのガイダンスを行う （課題説明、昨年度の作品紹介、チーム分け、調査の仕方WS）

オリエンシートの確認

学習目標 学習項目

1半期の学習内容について理解する。

ガイダンス：人間中心設計とユーザーエクスペリエンスデザインについて解説する オブザベーションワークショップ①

リフレクションシートの確認

関連科目 履修前提 ※選択科目のみ記載

情報デザイン２

担当教員 井上 順子 テキスト・参考文献

　【科目内容に沿った実務経験】　無

オリジナルテキスト

人間中心設計の考え方に基づき、ユーザー観察、ユーザー調査の手法、ユーザーに提供する新しい価値についてのアイデア手法、ペルソナ・シナリオ手法、ペーパープロトタイプよる評価手法などについて学ぶ。PBL形式の授業で手法解説に続き学生自らが体験を通して発想方法を主体的に学ぶ。

人間中心設計の手法について理解し、ユーザー視点の発想によるWebデザインのサービス提案が出来るようになる

評価方法・基準

※左記に示した評価項目の割合（％）を基準に、総合評価点を 算出して成績評価を行う。※出席率が80％未満の場合は、評価対象としない。

【評価基準】

①ユーザー中心設計のデザインプロセスを主体的に体験出来る。 ②ユーザー中心の視点でWebやアプリの提案が出来る。

企業連携 無後期 実習・実験駒数／週

授業の目的 到達目標

区分 開講時期1年次 講義・演習駒数／週

合計駒数／週 3 駒

Ｗｅｂデザイン科 シラバス 2020年度入学生

科目名 情報デザインⅠ 2020年3月6日

作成日

必修 0 駒 総時間数 120時間

実習 4 駒 総単位数 4単位

【評価方法】

評価項目 ①定期テスト ②小テスト ③レポート ④課題 ⑤作品 ⑥ﾎﾟｰﾄﾌｫﾘｵ ⑦成果発表 ⑧その他

割合 40% 10% % 10% 30% % % 10%

回数

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

14

W3Cの仕様に沿ったWebサイトを作成することが出来る。またGitを利用したコードの管理方法を学ぶ。

Gitによるコードのバージョン管理方法、VS CodeでのGitの使い方

課題の作成

15企画の内容、作成した作品を明快にプレゼン出来る。 プレゼンテーション

プレゼンテーション

12企画に沿って情報を整理し、画面を設計することが出来る。

実践的なWebサイトの制作① 情報の整理、企画、設計

課題の作成

13

Adobe XDやPhotoshopなどでデザインを作成し、それを適切にコーディングすることが出来る。

実践的なWebサイトの制作② 画面の設計、モックの作成

課題の作成

10floatを使った寄せと流し込みのレイアウトを組む事が出来る。 floatを使ったレイアウトの組み方について学ぶ。

課題の作成

11positionプロパティを使ったレイアウトを組む事が出来る。 positionプロパティの特徴と利用方法について学ぶ。

課題の作成

8CSS Gridを使い少し複雑なレイアウトを組む事が出来る。 CSS Gridを使ったレイアウトの組み方について学ぶ。

課題の作成

9flexboxを使ったレイアウトを組む事が出来る。 flexboxを使ったレイアウトの組み方について学ぶ。

課題の作成

6

CSSの優先度を理解し、基本的なセレクタを使うことが出来る。 簡単なレイアウトを組むことが出来る。

CSSの基本セレクタ、優先度、基本的なレイアウトの組み方

課題の作成

7CSS Gridを使い簡単なレイアウトを組む事が出来る。

CSS Gridを使ったレイアウトの組み方について学ぶ。CSS Gridの仕組みとCSS Gridで使うプロパティについて学ぶ。

課題の作成

4

セクショニングコンテンツに属する要素の役割とアウトラインの仕組みを説明出来る。それらの要素を適切に使い文章構造に沿ったマークアップが出来る。

tableの作り方、文章構造に沿ったマークアップ、セクショニングコンテンツ

小テスト

5

CSSを用いて文字の大きさや色、背景などを変えることが出来る。 idとclassを適切に使い分けることが出来る。

CSSの基本書式、idとclassの付け方、ボックスモデル

課題の作成

2

良く使われるHTML要素の意味とその役割を説明出来る。それらの要素を使い簡単なページを作成出来る。

良く使われるHTMLの頻出要素について学ぶ。

課題の作成

3複数ページを使い相互にリンクを設定できる。相対パス、絶対パスの違いを説明出来る。

文字コードの指定、HTMLのバージョンによる違い、相対パスと絶対パスの違い、リンクの設定の仕方について学ぶ。

課題の作成

学習目標 学習項目

1HTMLの基本書式を説明出来る。ごく簡単なHTMLを使ったページを作成出来る。 HTMLの基本書式。body、html、head、title等の基本的な要素の意味と役割を学習する。

課題の作成

関連科目 履修前提 ※選択科目のみ記載

Webデザイン技法、企画書作成＆プレゼンテーション、グラフィック実習、JavaScript実習、WebアプリケーションⅠ

担当教員 川島 温哉 テキスト・参考文献

　【科目内容に沿った実務経験】　有[教科書] よくわかるHTML5+CSS3の教科書【第3版】 オリジナル教材 フロントエンドエンジニアとして数々の企業サイトの構築に従事した実務経験がある。その経験から本科目

の実習において現場で使えるスキルを身につけられるよう実践的な教育を行う。

Webサイトの根幹であるHTMLとCSSの正しい知識とスキルを習得することを目的とする。文章構造に沿って適切なマークアップが出来る。 CSSを使って自在にレイアウトを組む事が出来る。

評価方法・基準

※左記に示した評価項目の割合（％）を基準に、総合評価点を 算出して成績評価を行う。※出席率が80％未満の場合は、評価対象としない。

【評価基準】

①文章構造に沿った適切なマークアップができること。 ②CSSを使ってレイアウト、デザインを組む事ができること。 ③WebにおけるHTML、CSS、JSのそれぞれの役割を説明できること。

企業連携 無前期 実習・実験駒数／週

授業の目的 到達目標

区分 開講時期1年次 講義・演習駒数／週

合計駒数／週 4 駒

Ｗｅｂデザイン科 シラバス 2020年度入学生

科目名 HTML & CSS実習 2020年3月6日

作成日

必修 0 駒 総時間数 90時間

実習 3 駒 総単位数 3単位

【評価方法】

評価項目 ①定期テスト ②小テスト ③レポート ④課題 ⑤作品 ⑥ﾎﾟｰﾄﾌｫﾘｵ ⑦成果発表 ⑧その他

割合 60% % % 40% % % % %

回数

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

14・スライダー（カルーセル）が動作する環境を整備することができる。 ・vue Caruselのイベントについて学習する。

練習問題、課題

15・スライダー（カルーセル）を作成できる。 ・vue Caruselを使った実装を学習する。

練習問題、課題

12・トランジションアニメーションを使って画像切り替えができる。

・<transition>タグの使い方を学習する。 ・<transition-group>タグによる複数要素のグループ化について学習する。

練習問題、課題

13・スライダー（カルーセル）の構成を説明できる。 ・vue Caruselの設定について学習する。

練習問題、課題

10・メソッドを作成することができる。 ・メソッドの意味と作り方を学習する。

練習問題、課題

11・イベントとメソッドを使いクリックカウンターを作成することができる。 ・v-onディレクティブを利用したイベント処理を学習する。

練習問題、課題

8・v-ifディレクティブ使い条件分岐処理を作成することができる。 ・v-ifディレクティブを学習する。

練習問題、課題

9・v-forディレクティブを使いデータリストを作成することができる。 ・v-forディレクティブを学習する。

練習問題、課題

6・アルゴリズムをフローチャートで示すことができる。 ・クリックカウンターを紐解き、どのようなフローで処理が行われていたのかを学習する。

練習問題、課題

7

・Javascriptのフレームワークの一つであるVue.jsについて説明できる。 ・Vue.jsを使ってDOMを操作することができる。

・Javascriptのフレームワークについて学習する。 ・マスタッシュタグ、v-bindディレクティブの使い方を学習する。

練習問題、課題

4・クリックカウンターが作成できる。 ・関数の作り方を学習する。

練習問題、課題

5・アルゴリズムについて説明できる。 ・アルゴリズムの考え方を学習する。

練習問題、課題

2・変数とオブジェクトを作成できる。

・var、let、constによる変数の宣言と代入、再代入について学ぶ。

練習問題、課題

3・演算子を使って計算ができる。 ・式と演算子について学ぶ

練習問題、課題

学習目標 学習項目

1

・Javascriptの仕組みを説明できる。 ・ブラウザの開発者ツールが使用できる。

・Javascriptの歴史及び動作原理を理解した上で、Javascriptの実行までの設定手順を学習する。 ・chromeに搭載されている開発者ツールを使って開発する方法を学習する。

練習問題、課題

関連科目 履修前提 ※選択科目のみ記載

Webデザイン技法、企画書作成＆プレゼンテーション、グラフィック実習、HTML&CSS実習、WebアプリケーションⅠ

担当教員 森 尚通 テキスト・参考文献

　【科目内容に沿った実務経験】　無

オリジナルテキスト

JavaScript標準仕様であるES2016の基本文法（変数、配列、制御構造、関数、オブジェクト）を学習すると共に、Javascriptフレームワークの一つであるVue.jsの基本文法を学習することを目的とする。

JavaScript標準仕様を理解すると共に、Javascriptフレームワークやライブラリを活用したWebサイト、Webアプリケーションを制作することができる

評価方法・基準

※左記に示した評価項目の割合（％）を基準に、総合評価点を 算出して成績評価を行う。※出席率が80％未満の場合は、評価対象としない。

【評価基準】

①Javascriptの基本文法を習得していること ②Javascriptを活用したWebサイトやWebアプリケーションを作成することができること ③Javascriptの基本構造や特徴を説明することができること

企業連携 無通年 実習・実験駒数／週

授業の目的 到達目標

区分 開講時期1年次 講義・演習駒数／週

合計駒数／週 3 駒

Ｗｅｂデザイン科 シラバス 2020年度入学生

科目名 JavaScript実習 2020年3月6日

作成日

必修 0 駒 総時間数 90時間

実習 3 駒 総単位数 3単位

【評価方法】

評価項目 ①定期テスト ②小テスト ③レポート ④課題 ⑤作品 ⑥ﾎﾟｰﾄﾌｫﾘｵ ⑦成果発表 ⑧その他

割合 60% % % 40% % % % %

回数

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

14・スマートフォンのセンサーを操作出来る。 ・ジャイロセンサーや加速度センサーの操作方法を学習する。

練習問題、課題

15・関数やクラスを使用することが出来る。 ・関数、クラスについて学習する。

練習問題、課題

12・fetchメソッドでJSONやXML、バイナリを読み込むことが出来る。 ・JSON,XMLHttpRequestでデータの読み込みや変換を学習する。

練習問題、課題

13・ローカルデータ（localStorage、Cookie）からデータの取り扱いが出来る。 ・localStorageやCookieからデータの読み書き方法を学習する。

練習問題、課題

10・SVGやcanvas要素をサイトに組み込むことが出来る。 ・SVG要素の操作方法、canvasの操作方法を学習する。

練習問題、課題

11・処理実行タイミングを制御出来る。 ・処理の実行タイミングの制御方法を学習する。

練習問題、課題

8・Javascriptからアニメーション作成や要素の変更が出来る。 ・JavascriptからCSS Animationsの使い方を学習する。

練習問題、課題

9・画像・音声をサイトに組み込み、制御することが出来る。 ・音声制御、動画読み込み、カメラ操作方法を学習する。

練習問題、課題

6・JavascriptからHTML要素の操作を行うことが出来る。 ・JavascriptよりHTML要素を操作する方法を学習する。

練習問題、課題

7・Javascriptからフォーム要素の操作を行うことが出来る。 ・フォーム要素の操作方法を学習する。

練習問題、課題

4・ブラウザの操作（スクロール、フォーカス、リロード）が出来る。 ・Javascriptからブラウザの操作方法を学習する。

練習問題、課題

5・マウスからのイベント処理が出来る。 ・ユーザーアクション方法を学習する。

練習問題、課題

2・数値や文字、真偽値を利用したプログラムを作成出来る。 ・Javascriptから文字、数値の取得、置き換えなどを学習する。

練習問題、課題

3・複数データを保持できるオブジェクトの定義、値の取得、更新を行うことが出来る。 ・配列やオブジェクトのプロパティ操作を学習する。

練習問題、課題

学習目標 学習項目

1・Javasctipt標準仕様であるES2015について説明することが出来る。 ・Javascript標準仕様であるES2015以降の記述方法を学習する。

練習問題、課題

関連科目 履修前提 ※選択科目のみ記載

HTML&CSS実習、WebアプリケーションⅠ、WebアプリケーションⅡ、サーバーサイドプログラミングⅠ

担当教員 関根 慎二 テキスト・参考文献

　【科目内容に沿った実務経験】　無

オリジナルテキスト

JavaScript標準仕様であるES2016の基本文法（変数、配列、制御構造、関数、オブジェクト）を学習すると共に、Javascriptフレームワークの一つであるVue.jsの基本文法を学習することを目的とする。

JavaScript標準仕様を理解すると共に、Javascriptフレームワークやライブラリを活用したWebサイト、Webアプリケーションを制作することが出来る。

評価方法・基準

※左記に示した評価項目の割合（％）を基準に、総合評価点を 算出して成績評価を行う。※出席率が80％未満の場合は、評価対象としない。

【評価基準】

①Javascriptの基本文法を習得していること ②Javascriptを活用したWebサイトやWebアプリケーションを作成することが出来ること ③Javascriptの基本構造や特徴を説明することが出来ること

企業連携 無通年 実習・実験駒数／週

授業の目的 到達目標

区分 開講時期1年次 講義・演習駒数／週

合計駒数／週 3 駒

Ｗｅｂデザイン科 シラバス 2020年度入学生

科目名 JavaScript実習 2020年3月6日

作成日

必修 0 駒 総時間数 30時間

実習 1 駒 総単位数 1単位

【評価方法】

評価項目 ①定期テスト ②小テスト ③レポート ④課題 ⑤作品 ⑥ﾎﾟｰﾄﾌｫﾘｵ ⑦成果発表 ⑧その他

割合 % % % 30% 50% % % 20%

回数

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

14Vue.jsと単一ファイルコンポーネントを使ってUIを構築出来る。 Vue.jsと外部APIを使ったオリジナルのアプリケーションを作成する。

課題の作成

15Githubを使ってコードを管理し、適切にコミットおよびプッシュが出来る。 Vue.jsと外部APIを使ったオリジナルのアプリケーションを作成する。

課題の作成

12ElectronとVue.jsを用いて簡易的なマークダウンエディタを作成出来る。 ElectronとVue.jsを組み合わせてデスクトップアプリを作成する方法を学習する。

課題の作成

13npmを使って開発環境を構築出来る。 Vue.jsと外部APIを使ったオリジナルのアプリケーションを作成する。

課題の作成

10Vue CLIと外部APIを使って天気予報アプリを作成出来る。 外部APIの利用。JSONをJavaScriptで利用する方法を学習する。

課題の作成

11

Electronを用いて簡単なデスクトップアプリを作成する事ができる。Electronの仕組を説明する事が出来る。

Electronを利用してデスクトップアプリを作成する方法を学習する。

課題の作成

8

npmとyarnの仕組みについて説明する事が出来る。npmコマンドを使ってモジュールをインストール出来る。

npmのエコシステム、npmコマンド、yarnとnpmの違いなどについて学習する。

課題の作成

9Vue CLIを使って簡単なWebアプリケーションを作成出来る。 Vue CLIを使って複数画面から成るアプリケーションの作成方法を学習する。

課題の作成

6Vue Routerを使ってSPAを作成できる。自分でルーティングの設定をする事が出来る。 Vue Routerを使ったSPAの作成方法を学習する。

課題の作成

7

Gitの仕組みを説明することができる。Githubと連携し、適切にコードのバージョン管理を行う事が出来る。

GitとGithubの仕組みを学習する。

課題の作成

4

スロットを使ってコンポーネントを汎用的に使う事ができる。コンポーネントを自分で作成する事が出来る。

コンポーネントとスロットの使い方を学習する。

課題の作成

5

Vue CLIを使ってアプリケーションの雛形を作成できる。単一ファイルコンポーネントの仕組を説明出来る。

Vue CLIを使ったアプリケーションの作成方法について学習する。単一ファイルコンポーネントの利用方法を学ぶ。

課題の作成

2Vueのトランジションとアニメーションを利用した簡単なUIが実装出来る。 Vue.jsのトランジションフック、単一要素トランジション、リストトランジションを学習する。

課題の作成

3

Vueのコンポーネントについて説明が出来る。コンポーネントを利用して簡単なアプリケーションを作成出来る。

Vue.jsのコンポーネントの定義方法とその利用方法について学習する。

課題の作成

学習目標 学習項目

1

前期に学習したVue.jsの基本項目の復習を行う。バインディング、ディレクティブ、オプションなどの基本機能を利用したプログラムが作成出来る。

バインディング、ディレクティブ、オプションなど前期授業で学んだVue.jsの基本項目について学習する。

課題の作成

関連科目 履修前提 ※選択科目のみ記載

Webアプリケーションll、JavaScript実習

担当教員 川島 温哉 テキスト・参考文献

　【科目内容に沿った実務経験】　有

オリジナル教材プログラマー、UIデザイナーとしてWebアプリケーションやスマートフォンアプリの開発に従事した実務経験がある。その経験から得た知識やスキルを活かして、本科目のアプリ開発に対する実践的な教育を行う。

この授業では主にVue.jsを用いてWebアプリケーションやデスクトップアプリケーションの作成方法を学習し、同時にNode.jsやそのエコシステムの利用方法を学習することを目的とする。

Vue CLIやElectronを用いてWebアプリケーションやデスクトップアプリケーションを作成出来る。

評価方法・基準

※左記に示した評価項目の割合（％）を基準に、総合評価点を 算出して成績評価を行う。※出席率が80％未満の場合は、評価対象としない。

【評価基準】

①Vue.jsの基本機能を理解した上でアプリケーション制作に用いる事ができること。 ②外部のWeb APIを利用したアプリケーション制作ができること。 ③ElectronやVue CLIを用いてアプリケーションが制作できること。

企業連携 無後期 実習・実験駒数／週

授業の目的 到達目標

区分 開講時期1年次 講義・演習駒数／週

合計駒数／週 1 駒

Ｗｅｂデザイン科 シラバス 2020年度入学生

科目名 Ｗｅｂアプリケーション制作Ⅰ 2020年3月6日

作成日

必修 1 駒 総時間数 30時間

講義 0 駒 総単位数 2単位

【評価方法】

評価項目 ①定期テスト ②小テスト ③レポート ④課題 ⑤作品 ⑥ﾎﾟｰﾄﾌｫﾘｵ ⑦成果発表 ⑧その他

割合 50% % % 30% % % 10% 10%

回数

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

14

ワイヤーフレームを基にプロトタイプを作成する事が出来る。プレゼンテーションに向けてチーム内で協力し、作業分担する事が出来る。

プロトタイプの作成と検証、チームでの協力体制、プレゼンテーションに向けての準備について学習する。

プロトタイプの作成

15企画内容およびその意図を的確にプレゼンテーション出来る。 プレゼンテーションの仕方。情報の伝え方。クライアントとのコミュニケーション能力。

プレゼンテーション

12

ユーザーニーズと発注側(クライアント)のニーズの両方を把握し、それらを両立する企画立案を行う事が出来る。

ペルソナの活用方法、チームによる企画立案、チーム内での作業分担およびチームビルディングについて学ぶ。

企画の作成

13

企画立案した内容を基に情報を整理し、的確にサイトの全体構造を設計出来る。またデバイスの特性に合ったUIを設計してワイヤーフレームを作成する事が出来る。

デバイスの特性に合ったUIの設計、サイトの全体構造の設計、ラベル設計について学習する。

ワイヤーフレーム、画面遷移図の作成

10スケジュール管理のポイント、各職種の担当領域、チーム制作について説明が出来る。

工程管理、ディレクション、チームでの各役割などを学び、チーム制作を行う上での知識と技術を学ぶ。

課題の作成

11

KJ法により整理したユーザーニーズを基に対象をモデル化しペルソナとして明確に表す事が出来る。またそのユーザーのゴールを把握した上で適切なUXを設計する事が出来る。

KJ法のやり方、ニーズの整理、モデル化の方法、ペルソナ・シナリオ法の実践について学習する。

ペルソナシートの作成

8RWDのメリット・デメリットを説明できる。スマホ用の代表的なUIを挙げられる。 RWDの制作手法とワークフローについて学習する。

課題の作成

9プロトタイピングのやり方を説明できる。実際に自分で実践出来る。 RWDを前提にしたプロトタイピング手法を学び、実際にプロトタイプの作成を行う。

プロトタイプの作成

6代表的なWebサイトのナビゲーション、UIを挙げられる。 現在良く使われているWebサイトやアプリのUIおよびナビゲーションパターンについて学習する。

課題の作成

7

UIとUXの違いを説明できる。UIの意味を理解した上で適切な設計ドキュメントを作成出来る。

UIとUXの意味と意義について学び、UI設計、ワイヤーフレームなど実際のアウトプットドキュメントを制作していく。

ワイヤーフレームの作成

4

HCDプロセスからクライアントとユーザー双方のニーズ整理し適切な企画を立案する事が出来る。

要件の整理、ユーザーのモデル化、行動プロセスから企画立案までの流れを学習する。

企画書の作成

5サイト内の情報を整理し、サイトの全体のコンテンツ構造を設計する事が出来る。 情報の分類軸、分類方法などを学び、サイト内の情報設計を実践的に学習する。

設計ドキュメントの作成

2

Webサイト構築プロジェクトの一連のワークフローを説明出来る。職種による業務領域や上流工程と下流工程について説明が出来る。

Webサイト構築のワークフローと、その中でIAがどのような役割を果たすのかを学習する。

課題の作成

3

ユーザーニーズを基に、各種調査手法を把握し分析結果から問題点を導き出す事が出来る。

各種調査方法と問題点の抽出方法について学習する。

課題の作成

学習目標 学習項目

1

Webサイトの発展と変遷について説明が出来る。現代のWebサイトの特徴と役割について説明が出来る。

歴史的背景からWebサイトの発展と変遷について学習する。また現在のWebサイトとアプリの役割について学ぶ。

課題の作成

関連科目 履修前提 ※選択科目のみ記載

進級制作

担当教員 川島 温哉 テキスト・参考文献

　【科目内容に沿った実務経験】　有

オリジナル教材Webディレクター・フロントエンドエンジニアとして数々の企業サイトの開発及び立ち上げに従事。その経験を基に実践的な授業を行う。

サイト設計における情報アーキテクチャの役割を理解した上で、クライアントとユーザー双方のニーズを満たした企画および設計を行えることを目的とする。

IAの知識を活かして適切にサイト全体の情報設計を行う事が出来る。 調査やヒアリングから課題を抽出し、最適なUXDを考える事が出来る。

評価方法・基準

※左記に示した評価項目の割合（％）を基準に、総合評価点を 算出して成績評価を行う。※出席率が80％未満の場合は、評価対象としない。

【評価基準】

①サイト制作における設計ドキュメント(企画書、サイトストラクチャ、ワイヤーフレーム、コンテンツインベントリ)を適切に作成できること。 ②Webサイトやスマホアプリでよく使われるUIや代表的なナビゲーションパターンを説明でき、適切にUIを設計出来ること。 ③チーム制作における役職毎の役割を理解し、円滑なコミュニケーションを行いプロジェクトを協力して進める事が出来ること。

企業連携 無後期 実習・実験駒数／週

授業の目的 到達目標

区分 開講時期1年次 講義・演習駒数／週

合計駒数／週 1 駒

Ｗｅｂデザイン科 シラバス 2020年度入学生

科目名 サイト設計 2020年3月6日

作成日

必修 2 駒 総時間数 120時間

講義／実習／演習 2 駒 総単位数 6単位

【評価方法】

評価項目 ①定期テスト ②小テスト ③レポート ④課題 ⑤作品 ⑥ﾎﾟｰﾄﾌｫﾘｵ ⑦成果発表 ⑧その他

割合 % % % % 60% 20% 20% %

回数

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

14展示会の目的を理解し、作品パネルと自己紹介パネルを製作出来る。

進級制作の展示会に向けて、下記を学習する。 ①作品パネルと自己紹介パネルの製作を行う。

作品パネル、自己紹介パネル、ポートフォリオ

15

展示会で来場した方に制作した作品について説明できる。 就職について自己アピール出来る。

進級制作の展示会にて、下記を学習する。 ①進級制作展で作品のプレゼンテーションを行う。 ②各企業より作品のアドバイスをいただき、修正を行う。

作品、ポートフォリオ

12

正しいコーディング技術を使って、サイトを実装出来る。 サイトをテスト・検証しながら確認出来る。

サイトの実装をするために、下記を学習する。 ①HTML＆CSS＆JavaScriptを使って実装する。 ②サイトのテスト＆検証をする。

サイト、ポートフォリオ

13

企業に向けて作品を操作してもらい、企画に沿った実装の仕方やモーションなど、正しくブラウザで機能、表示しているかを確認出来る。

企業に作品のプレゼンテーションをするために、下記を学習する。 ①企業に操作をしてもらい、実装をチェックしてもらう。 ②正しく機能しているか、問題がないかを確認、アドバイスをいただき、修正を行う。

サイト、ポートフォリオ

10

企業に向けてモックアップのプレゼンテーションを行い、企画に沿ったUI表現が出来る。 モックアップをブラッシュアップ出来る。

企業にモックアップのプレゼンテーションをするために、下記を学習する。 ①企業に向けてモックアッププレゼンテーションを行う。 ②企業からモックアップのアドバイスをいただき、修正を行う。

モックアップ改善点シート、ポートフォリオ

11正しいコーディング技術を使って、サイトを実装出来る。

サイトの実装をするために、下記を学習する。 ①HTML＆CSS＆JavaScriptを使って実装する。

サイト、ポートフォリオ

8

企画に適したUIデザイン（PC版とスマホ版）を制作出来る。 ワイヤーフレームを元に、モックアップを制作出来る。

モックアップを制作するために、下記を学習する。 ①ワイヤーフレームの作成 ②モックアップの作成

ワイヤーフレーム、ポートフォリオ

9

すべてのページのモックアップを完成させ、グループディスカッションを通じ、様々な意見を基にブラッシュアップ出来る。

モックアップのプレゼンテーションをするために、下記を学習する。 ①1年生＆2年生の企画グループディスカッションを通して、企画にアドバイスをいただき、企画書の修正を行う。

モックアップ、ポートフォリオ

6

企業に向けて企画のプレゼンテーションを体験する。 企業から企画のアドバイスをもらい、企画書をブラッシュアップ出来る。

企業に企画のプレゼンテーションをするために、下記を学習する。 ①企画内容をまとめた企画書を元にプレゼンテーションをする。 ②企業から企画のアドバイスをいただき、修正を行う。

企画改善点シート、ポートフォリオ

7

企画に適したUIデザイン（PC版とスマホ版）を制作出来る。 サイトマップに合わせて、ワイヤフレームを制作出来る。

ワイヤーフレームを制作をするために、下記を学習する。 ①サイトストラクチャの作成 ②コンテンツイベントリーの洗い出しと作成

サイトストラクチャシート、コンテンツイベントリーシート、ポートフォリオ

4

課題を深く理解し、クライアントの要望をまとめることが出来る。 企画を立てるための手順を理解し、企画立案のための調査を体験出来る。

課題に沿った企画立案をするために、下記を学習する。 ①クライアントの要望　②クライアントの最終的なゴール　③想定されるユーザのニーズ　④ユーザの最終的なゴール

要件の整理シート、ポートフォリオ

5

サイトの目的、ターゲットを意識した企画立案を行うことが出来る。 グループディスカッションを通じ、様々な意見を基に企画書をブラッシュアップ出来る。

企画書制作するために、下記を学習する。 ①ユーザーを特徴ごとにセグメント　 ②メインターゲット　 ③AIDMA　 ④ペルソナ　 ⑤シナリオ ⑥企画書にまとめる。 ⑦1年生＆2年生の企画グループディスカッションを通して、企画にアドバイスをいただき、修正を行う。

ユーザの整理シート、ユーザニーズの整理シート、ペルソナシート、シナリオシート、ポートフォリオ

2

企業からいただいたテーマ（課題）を知ることが出来る。 個々でヒヤリングシートをまとめることが出来る。

オリエンテーションを前に、複数の課題が発表され、一つを選択する。 選んだ課題について、オリエンテーション前に下記の流れでヒヤリングシート作成について学習する。 ①各自でヒヤリングシートをまとめる。 ②チームでヒヤリング内容を共有する。 ③チームでヒヤリングシートをまとめる。

ヒヤリングシート、ポートフォリオ

3企業オリエンテーションでクライアントの課題を説明出来る。

企業オリエンテーションにて、下記を学習する。 ①クライアントの課題やサイトの目的、条件や要望、スケジュールなどを確認する。

オリエンまとめシート、ポートフォリオ

学習目標 学習項目

1

進級制作での目標を設定出来る。 Webワークフローの基づいた制作（授業の進め方）についてポートフォリオテンプレートを見て、目標を書くことが出来る。

ガイダンス（科目の目的、授業の流れ、評価方法） Web制作ワークフローを理解した上で下記の内容を学習する。 ①進級制作のポートフォリオを準備し、まとめ方 ②2年生より昨年度の作品発表を通して、進級制作の流れや最終イメージを予測。

ポートフォリオ目標設定シート、ポートフォリオ

関連科目 履修前提 ※選択科目のみ記載

サイト設計、就職リテラシー、ユーザビリティ＆アクセシビリティ 企画書制作＆プレゼンテーション、HTML&CSS実習、JavaScript実習

担当教員 小山内 靖美 テキスト・参考文献

　【科目内容に沿った実務経験】　有

オリジナルテキスト電気設備会社の社内システムにてシステム設計・制作の実務経験がある。その経験から取得した知識とスキルを活かして、本科目のWeb制作ワークフローに基づいたサイト制作に対する職業実践的な教育を行う。

Web制作企業から実案件（クライアントの要求）を元に課題が掲示され、企画提案・Webサイト制作・プレゼンテーションまでのWebワークフローを通して実務能力を学習し、企画・モックアップ、実装、企業に向けて最終プレゼンテーションを行い、企業から指導を受けながらWebサイト制作を行い、商用のWebサイトを制作できる技術を身に着けることを目的とする。

Webワークフローに従って、①企画立案できる　②設計書を作成できる　③企画に適したモックアップ表現ができる　④HTML&CSS＆JavaScriptを使ってサイトの実装ができる　⑤制作したものを発表することができる。

評価方法・基準

※左記に示した評価項目の割合（％）を基準に、総合評価点を 算出して成績評価を行う。※出席率が80％未満の場合は、評価対象としない。

【評価基準】

①クライアントから出された課題を解決し、企画書を作成出来ること。 ②企画に適したモックアップで表現され、HTML＆CSS＆JavaScriptを使ってサイトを制作出来ること。 ③Webワークフローに基づいて制作した内容をポートフォリオにまとめることが出来ること。 ④制作したサイトの目的からターゲット、コンセプトを含めて実装までの工夫点を発表出来ること。

企業連携 有後期 実習・実験駒数／週

授業の目的 到達目標

区分 開講時期1年次 講義・演習駒数／週

合計駒数／週 4 駒

Ｗｅｂデザイン科 シラバス 2020年度入学生

科目名 進級制作 2020年3月6日

作成日

必修 1 駒 総時間数 30時間

講義 0 駒 総単位数 2単位

【評価方法】

評価項目 ①定期テスト ②小テスト ③レポート ④課題 ⑤作品 ⑥ﾎﾟｰﾄﾌｫﾘｵ ⑦成果発表 ⑧その他

割合 % % % 100% % % % %

回数

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

理解度確認

14１．ロールプレイングで、面接試験によく出る質問に慣れる。③

(オリジナルワークシート) １．ケースロールプレイング③：（グループワーク）１グループ５～６名で、集団面接練習。 　「応募者」、「面接官」、「オブザーバー」グループに分かれて、 　（入室～挨拶～自己紹介～質疑応答～お礼～挨拶～退室の流れを実施）

15

１．本校求人票の見方を理解する。 ２．労働契約に関し、最低限必要な知識を理解する。

１．本校の求人票記載項目の確認、求人情報の意味することを解説 ２．労働契約の成立、内定、内定辞退、内定取り消しなどの 　　最低限必要な知識を解説

12

１．ロールプレイングで、面接試験によく出る質問に慣れる。① (オリジナルワークシート) １．ケースロールプレイング①：（グループワーク）１グループ５～６名で、集団面接練習。 　「応募者」、「面接官」、「オブザーバー」グループに分かれて、 　（入室～挨拶～自己紹介～質疑応答～お礼～挨拶～退室の流れを実施）

13１．ロールプレイングで、面接試験によく出る質問に慣れる。②

(オリジナルワークシート) １．ケースロールプレイング②：（グループワーク）１グループ５～６名で、集団面接練習。 　「応募者」、「面接官」、「オブザーバー」グループに分かれて、 　（入室～挨拶～自己紹介～質疑応答～お礼～挨拶～退室の流れを実施）

10

１．企業が求める人材から社会人基礎力の重要性を理解出来る。 ２．自分の意志で企業選択が出来る。

（テキストP９／オリジナルワークシート） １．社会人基礎力で何か大切かを解説 ２．企業選択のポイントを解説

11１．面接試験に臨む「態度」、「マナー」、「言葉遣い」を習得する。

（テキストP122-P144／オリジナルワークシート） １．面接試験とその対策：（グループワーク） 　「第一印象」、「入・退室のしかた」、「挨拶のしかた」、「着席のしかた」等の模擬面接

8１．履歴書・自己紹介書の作成が出来る。

（テキストP80-P86/オリジナルワークシート） １．本校所定の様式　履歴書（練習用）：履歴書・自己紹介書の項目説明 ２．自己PRを作成し、提出

9１．将来のビジョンをイメージ出来る。

（テキストP30-P31/オリジナルシート） １．将来のビジョンをイメージし、実現に向けた計画の立て方を解説

6１．職業に関する興味・関心を通し、自己理解を深める。②

(VPI職業興味検査[第3版]) １．VPI職業興味検査[第3版]：「結果の見方・活かし方」をもとに検査結果の解説 ２．各興味領域における職業の探求

7１．職業の多様性を理解出来る。

(オリジナルワークシート ) １．ワーク「職業研究」：職種を知る。（グループワーク）

4１．自分らしいキャリアを築くために自己分析を深める。

(オリジナルワークシート) １．ワーク「自己分析１」：自分のモチベータ分析

5１．職業に関する興味・関心を通し、自己理解を深める。①

(VPI職業興味検査[第3版]) １．VPI職業興味検査[第3版]：実施およびチャート作成

2

１．仕事に関する「価値観」を探求する。 ２．自分では気付かない特質を知る。

(オリジナルワークシート) １．ワーク「世界に１つだけの花」：（グループワーク）価値観の多様性を解説 ２．ワーク「自己分析２」：自己の振り返り

3

１．自分を客観視することで、新たな自分を発見する。 ２．自己開示の大切さを理解出来る。

(オリジナルワークシート) １．ワーク「ジョハリの窓」：実施結果から、自己開示・フィードバックの大切さを解説

学習目標 学習項目

1

１．就職活動の概要を理解出来る。 ２．職業に関する価値観を自己認識出来る。

(オリジナルワークシート) １．講師の自己紹介 ２．就職活動のスケジュール、本校の就職支援体制、就職戦線のトレンドの解説 ３．ワーク「何のために働くのか」：働く事の意味を考える（グループワーク）

関連科目 履修前提 ※選択科目のみ記載

なし なし

担当教員 岩崎 和彦 テキスト・参考文献

　【科目内容に沿った実務経験】　有 １．専修学校・各種学校生のための就職成功へのステップ（実教出版　加賀　博著） ２．JEC Career Navi（本校オリジナル） ３．オリジナルワークシート ４．VPI職業興味検査[第3版]

ハローワーク（神奈川労働局、東京労働局）が主催した就職支援セミナーの講師を１０年程担当した。その経験を活かし、本科目の自己分析、応募書類作成、面接準備に対する実践的な対応を行う。

採用試験における書類審査、面接等の準備を行い、自信を持って就職活動に取り組むことが出来ることを目的とする。

ワークショップ型演習授業形式にて、就職活動で企業の採用選考（書類選考、面接など）の対策を行うと共に、就職および就職活動の意識付けを行う。

評価方法・基準

※左記に示した評価項目の割合（％）を基準に、総合評価点を 算出して成績評価を行う。※出席率が80％未満の場合は、評価対象としない。

【評価基準】

１．自己分析（能力・興味・仕事の価値観） ２．履歴書（練習用）作成 ３．ロールプレイング ４．オリジナルワークシートほかの実習課題にて評価

企業連携 無前期 実習・実験駒数／週

授業の目的 到達目標

区分 開講時期1年次 講義・演習駒数／週

合計駒数／週 1 駒

Ｗｅｂデザイン科 シラバス 2020年度入学生

科目名 就職活動リテラシー 2020年3月6日