1 |
内容 |
オリエンテーション:授業の概要や目的を把握する。
導入として「よいWebデザインとは」デザインの目的について学ぶ。WebブラウザCromeの有効な使い方、ギャラリーサイトの利用方法を確認する。グループワーク「他己紹介」
|
予復習 |
初回の予習は不要。
第1回の復習(60分)
|
担当 |
|
2 |
内容 |
Webサイトの基本:Webの仕組み、制作の流れ、Webサイトを構成する技術と必要な制作ツール、Webサイトの基本構造を学ぶ。
HTMLの基本(1):HTMLについて、HTML5の特徴、HTMLの記述方法(タグと属性)
|
予復習 |
第2回の復習(1時間以上) 共有資料の該当箇所を参照しながら復習する。
|
担当 |
|
3 |
内容 |
HTMLの基本(2)
HTMLの基本構造に関係するタグ、見出し、本文、画像、リンク、箇条書きのタグの記述方法を学ぶ。
|
予復習 |
第3回の復習(1時間以上) 共有資料の該当箇所を参照しながら復習する。
|
担当 |
|
4 |
内容 |
HTMLの基本(3)
演習:簡単なページをマークアップする。
|
予復習 |
演習課題を次週までにドライブへ提出。(2時間以上)
|
担当 |
|
5 |
内容 |
デザイン課題 ① Webデザインに必要な素材〈メインイメージ〉制作
Photoshopを使い画像の色調調整や切り抜き、文字の加工方法を学ぶ。
|
予復習 |
Photoshopの操作方法を復習し課題を進めておく。(2時間以上)
|
担当 |
|
6 |
内容 |
デザイン課題 ① 制作仕上げ+講評会:互いに評価し優れた点を全員で学び合う。
|
予復習 |
課題①復習、プレゼンテーションの要点をまとめリアクションペーパーで提出(60分)
|
担当 |
|
7 |
内容 |
CSSの基本(1)装飾
CSSの役割、CSSの記述方法(セレクタ・プロパティ・値)、CSSのルールについて理解する。色の指定方法、文字や本文の装飾、背景の装飾の記述方法を学ぶ。
|
予復習 |
第7回の復習(1時間以上) 共有資料の該当箇所を参照しながら復習する。
|
担当 |
|
8 |
内容 |
CSSの基本(2)レイアウト
ボックスモデル(幅と高さ、余白、線)、flexboxなどレイアウトの手法を学ぶ。
|
予復習 |
第8回の復習(1時間以上) 共有資料の該当箇所を参照しながら復習する。
|
担当 |
|
9 |
内容 |
CSSの基本(3)
演習:簡単なページをマークアップする。
|
予復習 |
演習課題を次週までにドライブへ提出。(2時間以上)
|
担当 |
|
10 |
内容 |
デザイン課題 ② Webデザインに必要な素材〈ロゴ〉制作
ロゴデザイン:Illustratorを使ってパスを使ってロゴのデザイン方法を学ぶ。
|
予復習 |
Illustratorの操作方法を復習し課題を進めておく。(2時間以上)
|
担当 |
|
11 |
内容 |
デザイン課題 ② 制作仕上げ+講評会:互いに評価し優れた点を全員で学び合う。
|
予復習 |
課題②復習、プレゼンテーションの要点をまとめリアクションペーパーで提出(60分)
|
担当 |
|
12 |
内容 |
[最終課題]Webサイト制作(1)企画と情報設計
Webサイトの目的、インタビュー、Webサイトに掲載する情報の整理とそれをもとに画
面設計(ワイヤーフレーム)を考える。
|
予復習 |
[最終課題]の制作、次週までにワイヤーフレームを作成(2時間以上)
|
担当 |
|
13 |
内容 |
[最終課題]Webサイト制作(2)デザイン制作
必要な素材を制作する。配色のポイントと使いやすいデザインについて学ぶ。
|
予復習 |
[最終課題]の制作、素材のデザイン制作(2時間以上)
|
担当 |
|
14 |
内容 |
[最終課題]Webサイト制作(3)コーディング
HTMLとCSSをカスタマイズしながら制作する。
|
予復習 |
[最終課題]の制作、共有資料でHTMLとCSSの復習(3時間以上)
|
担当 |
|
15 |
内容 |
[最終課題]Webサイト制作(4)コーディング 仕上げ
表示にミスがないか、操作して使いにくいところはないか確認。
|
予復習 |
[最終課題]を次週までにドライブへ提出。プレゼンテーションの準備(3時間以上)
|
担当 |
|
16 |
内容 |
プレゼンテーション、講評会:制作したWebサイトのプレゼンテーションでは互いに評価し優れた点を全員で学び合う。まとめと講評
|
予復習 |
最終課題の復習、プレゼンテーションの要点をまとめリアクションペーパーで提出(60分)
|
担当 |
|