31240003

基礎ツール演習 II -d(Web) [ライブ型・FS]

2021年度2Q(前期)

演習

基礎

塩谷 正樹

実務家教員

1

2.00単位

火曜3限、火曜4限

簡単な内容のWebページ制作を通して、HTMLの構造、CSSの役割、Javascriptの導入方法などを体験し、Webの世界に興味を持ってもらう。
不明点、疑問点などは、映像教材を利用したり、ネットで調べたりし、関連情報や応用方法などを発見する楽しみを感じてもらう。
また、グループワークを通して、個人で解決出来ない問題をメンバーで共有、クリアする体験をしてもらう。

テーマに沿ったページ制作をするためにどんなコンテンツが必要か、どんなレイアウトにすれば良いかなどを各自、またはグループで考えます。
必要に応じて、映像教材やネット検索を利用し、表現するための方法を模索しながら、ブラウザで表示出来るようになっていきます。
自主学習を中心に技術的なサポートをしていきます。

※2021年度は、オンライン遠隔形式での授業を予定しています。
※履修生のPCを使用します。
※Photoshop、Illustrator、DreamWeaver、Bracketsなどを使用します。
※その他、プラグインやソフトのインストール、Webツールへの登録などもあります。

●課題点70%＋授業点30%の総合点で理解度を評価します。
・課題点は、提出作品の内容を評価します。
・授業点は、授業態度や学習への意欲、積極性、FSの回答状況などを評価します。

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

・試験方法　　課題提出　
・試験内容　　授業内で発表される最終課題資料の内容に基づき、指定されたテーマで作品を作成する
・提出方法　　Google Classroomに提出
・実施日　　　第8週までに実施
・提出〆切　　授業内で発表される最終課題資料を参照
・追試験、再試験の実施　　無　　※作品の再提出を指示する場合があります。

初回授業時に課題についての説明を行います。

■この授業の受け方について
・Web制作について
・グループ別け
・自己紹介をしよう！（脳内マップ使用）

■テーマの発表と企画案作成
・アイデアシートを描いてみよう。
・コンテンツ案を考えてみよう。

■レイアウト
・コンテンツの順番や並びを考えてみよう。

■ワイヤーフレーム
・ペーパーワイヤーを描いてみよう。
・ソフトを使用してワイヤーを作ってみよう。（Photoshop、Illustratorなど）

□HTMLページの作成①
・ページ制作に必要なファイル構成をみてみよう。
・素材原稿をHTMLにしてみよう。
　※資料をもとに使用するHTMLタグを調べてマークアップしてみよう。

□HTMLページの作成②
・大まかな内容をブロック別けしてみよう。

■素材の収集①
・必要な原稿や写真素材などをまとめてみよう。

□CSSでスタイル設定①
・CSSの役割を調べてみよう。
・ブロックに名前を付けてみよう。
・CSSで原稿を装飾してみよう。

□CSSでスタイル設定②
・CSSでレイアウトにチャレンジ。
・横並びのレイアウトについて調べてみよう。

■素材の収集②
・原稿をテキストデータにしよう。
・画像データを作成してみよう。

■HTMLページを作成してみよう①
・原稿を入れてマークアップしてみる。
・画像を表示してみる。

■HTMLページを作成してみよう②
・大まかな内容をブロック別けしてみよう。

■CSSでスタイルを設定してみよう①
・大まかなレイアウトを設定してみよう。


■CSSでスタイルを設定してみよう②
・各パーツの装飾をしてみよう。

■課題の制作指導
・ブラウザで確認しながら、思い通りのレイアウトになるよう頑張ってみよう。

■チャレンジコーナー
・jQueryで「PageTopに戻る」を実装してみる。
・スライドを実装してみる。
・animation.cssでアニメーションにチャレンジしてみる。
・Webフォントを実装してみる。

■作品発表会
・各作品をみてみよう！

・筆記用具（消せるボールペンなど）
・定規（15〜20cmくらいのもの）
・各自のPC
・Adobe ID（ソフト利用のためのライセンス）
・映像教材用のイヤフォン、ヘッドフォン（学内PC利用の場合は有線のものを準備）

映像教材を利用します。
その他、独自のプリント（PDF）などを使用します。

本科目は、Webサイト制作に興味のある学生向けの内容となります。
HTML、CSSなどの正しい使い方を深く学ぶのではなく、まずはブラウザで表示出来るようなファイルが作成できることを目標とします。
必要に応じて、映像教材を利用し、深く学ぶことも出来ます。また、ネット検索で目的の内容や関連情報を発見し、導入する方法などのサポートを行います。
自主学習が中心になりますが、グループワークを通して、他学生の考えやデザインなども感じることが出来ます。
一人で解決出来ない問題については、グループもしくはスタッフがサポートします！