ヒューマンメディア工学

科目基礎情報

学校	熊本高等専門学校	開講年度	2018
授業科目	ヒューマンメディア工学
科目番号	HI414	科目区分	専門 / 選択
授業形態	授業	単位の種別と単位数	学修単位: 2
開設学科	人間情報システム工学科	対象学年	4
開設期	通年	週時間数	1
教科書/教材	オンライン教材と配布プリント、参考用教科書：高橋麻奈，やさしいWebアプリプログラミング，SoftBank Creative、2012
担当教員	孫 寧平

到達目標

メディア情報の主要な表現形式や処理技法について説明できる．使いやすく，デザイン性の高いWebページとWebアプリの作成ができることを目標とする．

ルーブリック

	理想的な到達レベルの目安	標準的な到達レベルの目安	未到達レベルの目安
Webの仕組み，WebサーバーとWebクライアント，Webページのアクセス方法について，実際のサーバー上でファイルの保管，編集，権限設定などが操作できるかどうかを評価する． Webページの作成について，HTML文書の基礎，文書の構造を表す要素と方法ごとにページを作成して，そのページの完成度を評価する．	全ての学習した内容についてよく理解でき，素早くファイルの操作ができる．HTMLの文書構造についてよく理解できる．HTML要素をページ製作過程に活用でき，ページのデザインに関する独創性と工夫が優れる． 　また，グループによるあるテーマを取り上げ関連するページの作りあげる作業において，立案と協力がよく，ページのデザイン，機能性，見やすさと完成度について相互採点が高く，発表もよくできた．	全ての学習した内容について理解でき，一般のファイルの操作ができる．HTMLの文書構造について理解できる．HTML要素をページ製作過程に適用でき，ページのデザインに関する独創性と工夫がある． 　また，グループによるあるテーマを取り上げ関連するページの作りあげる作業において，立案と協力ができ，ページのデザイン，機能性，見やすさと完成度について相互採点が普通レベルで，発表もできた．	全ての学習した内容について理解できない，一般のファイルの操作ができない．HTMLの文書構造について理解できない．HTML要素をページ製作過程に適用できなく，ページのデザインに関する独創性と工夫が見えない． 　また，グループによるあるテーマを取り上げ関連するページの作りあげる作業において，立案と協力ができない，ページのデザイン，機能性，見やすさと完成度について相互採点が普通レベル以下で，発表もできない．
CSSのスタイルシートの作成，セレクタの使用，CSSの基本と作成，色と背景，フォントとテキストなどの設定ができるかどうかを授業中に課した演習課題の完成度で評価する． 　CSSの応用とHPのデザインや平面デザインの考え方を独自のページ製作演習による評価する．	CSSのスタイルシートの基本と作成，セレクタの指定と応用，CSSの要素についてよく理解できる． 　CSSの応用とHPのデザインや平面デザインの考え方をページ製作に活用でき，独創性と完成度が優れる．	CSSのスタイルシートの基本と作成，セレクタの指定と応用，CSSの要素について理解できる． 　CSSの応用とHPのデザインや平面デザインの考え方をページ製作に適用でき，独創性と完成度が普通レベルである．	CSSのスタイルシートの基本と作成，セレクタの指定と応用，CSSの要素について理解できない． 　CSSの応用とHPのデザインや平面デザインの考え方をページ製作に適用できなく，独創性と完成度が普通レベル以下である．
JavaScriptの基本，処理の制御，イベント処理と関数について授業中に課した演習課題の完成度で評価する． JavaScriptのオブジェクト指向, DOM,フォーム, Webページの操作，Google Map APIの応用など授業中に課した演習課題の完成度で評価する．	JavaScriptの基本，JavaScriptのオブジェクト指向,DOM,イベント処理についてよく理解できる．それらを応用するページを作成できる．	JavaScriptの基本，JavaScriptのオブジェクト指向,DOM,イベント処理について理解できる．簡単な応用ページを作成できる．	JavaScriptの基本，JavaScriptのオブジェクト指向,DOM,イベント処理について理解できない．簡単な応用ページを作れない．
イベント処理を用いてGUIの作成．jQueryの利用，今まで学んだ内容を総合的に応用できるかどうかをオンラインゲームの制作による評価する． 製作において，テーマの設定，立案，プログラミング，段取り，工夫、独創性と完成度について自己採点，デザイン，機能性，見やすさ、独創性，完成度，発表について相互採点を行う，	各段階において，製作に積極的に取り組み，習得したスキルを活用し，独創性，デザイン性，機能性が優れ，プレゼンテーションもよく，自己採点・相互採点・担当教員による総合的な評価が優れる．	各段階において，製作に真面目に取り組み，習得したスキルを適用でき，独創性，デザイン性，機能性があり，プレゼンテーションもよく，自己採点・相互採点・担当教員による総合的な評価が平均である．	各段階において，製作に取り組み意欲がなく，習得したスキルを適用できない．独創性，デザイン性，機能性が見えない．プレゼンテーションも悪く，自己採点・相互採点・担当教員による総合的な評価が平均以下である．

教育方法等

概要:

　現在，PCやスマートフォンを始めとし，各種の家電製品に至るまで，インターネットに接続された様々な端末上で，Webを利用することができるようになっており，Webはコンピュータを活用する上で欠かせない存在である．本科目はWEB情報システムの設計と構築およびWEBアプリ開発における必要なHPの作成方法,HTML5,CSS，JavaScript, jQueryをはじめとするWEBプログラミング言語の学習と実践を行う．また，WEB上のマルチメディアの取り扱い方を学習し，使いやすいGUIの設計と実装方法を習得する．

授業の進め方・方法:

　実践性の高い授業なので，講義と演習を並行する．使いやすく，デザイン性の高いWebページとWebアプリの作成ができることを目標とする．
　授業の各段階において学生は各自一つのＷＥＢアプリ開発のプロジェクトを設け，授業を通して作成していき，最後に作り上げたアプリをプレゼンテーションする．
　Webアプリ開発はとても面白く，社会に役に立てるものづくりです．人に使いやすく，デザイン性の高いWebアプリの開発に挑戦していくことは望まれる．

注意点:

　規定授業時間数は60時間，放課後・家庭で30時間程度の自学自習が求められる．
　定期試験の実技試験や演習等で評価する。本科目は学修科目であるため，学習の各段階において自学学習用の課題やプロジェクトを設け，学習の成果を実技試験やプロジェクトのプレゼンテーションを総合し評価する．演習課題の確認と採点は授業中で実施するため，欠課対し減点する．60%以上の得点率で目標達成とみなす．
　

授業計画

		週	授業内容	週ごとの到達目標
前期
	1stQ
		1週	ガイダンス	本科目の概要，授業方針，評価方法等について紹介する．
		2週	WebとWebアプリ，HTML文書の作成	Webの仕組み，WebサーバーとWebクライアント，Webページの作成，Webアプリのについて理解できる．環境の設定，オンラインの確認，ページにテキストと写真の入れる方法を理解できる．
		3週	HTML５のリストの作成と入れ子リストの構造と作成	olリスト，ulリスト，項目の設定，番号の設定，変形リスト，入れ子リストの作成ができる．
		4週	HTML５のテーブルの作成	テーブル（table）の構造と作成，セールの結合，色のデザイン方法が理解でき，利用できる．
		5週	CSS（１）	CSSの役割を理解ができる． 3つのCSSスタイルの設定方法，セレクタの設定と使用， テキスト色の設定，文字サイズの指定、背景色の設定ができる．
		6週	CSS（２）	CSSファイルの利用方法， 動的疑似クラスの設定と使用，構造疑似クラスの設定と使用ができる．
		7週	CSS（３）	テキストの装飾方法の理解 フォントの指定，テキストレイアウトの設定，長文テキストの装飾のデザインができる．
		8週	中間試験（実技試験）	以上の内容の理解と自力で実装力を確認する
	2ndQ
		9週	CSS（４）	画像変換方法の理解，平行移動，拡大縮小，回転，変換について理解できる．動的な疑似・構造クラスの利用ができる．
		10週	CSS（５）	ボックスのデザインと配置方法について理解できる．ボックスの仕組み，位置の指定方法，背景のレイアウト，ボックスレイアウトの設定ができる．
		11週	ＪａｖａＳｃｒｉｐｔ（１） フォーム	formの理解，各フォーム部品の設定方法，入力と出力方法を理解できる．
		12週	ＪａｖａＳｃｒｉｐｔ（２） フォーム	JavaScriptプログラミングの入門，イベント処理について理解できる．
		13週	イベント処理プログラミング演習	同上
		14週	ＪａｖａＳｃｒｉｐｔ（２） Google map	google mapの理解，各機能の設定方法，JavaScriptプログラミング，documentオブジェクトの理解，google map APIの利用方法を利用できる．
		15週	google map APIの利用演習	同上
		16週	定期試験（実技試験）課題の解説とグループ発表	以上の内容の理解と自力で実装力を確認する
後期
	3rdQ
		1週	ＪａｖａＳｃｒｉｐｔ（３） プログラミング基本	javaScriptの基礎，変数，分岐文，繰り返し文，プログラムの組み方について理解できる．
		2週	ＪａｖａＳｃｒｉｐｔ（３） プログラミング基本演習	同上
		3週	ＪａｖａＳｃｒｉｐｔ（４） ＤＯＭの基本	DOMの基礎，DOMの利用，プログラムの組み方について理解できる．
		4週	ＤＯＭの演習	同上
		5週	ＪａｖａＳｃｒｉｐｔ（４） ＤＯＭのイベント	ＤＯＭによるイベント処理プログラミング方法について理解できる．
		6週	ＤＯＭの演習	同上
		7週	ＤＯＭの演習	同上
		8週	中間試験（実技試験）	以上の内容の理解と自力で実装力を確認する
	4thQ
		9週	jQueryの入門・基礎（１）	jQueryの基礎，html・cssのセレクターとの連携について理解できる．
		10週	jQueryの入門・基礎（２）	イベント処理関数の組み方，プログラムの組み方を理解できる．
		11週	jQueryプログラミング演習	同上
		12週	jQueryプログラミング演習	同上
		13週	jQueryプログラミング演習	同上
		14週	グループワークによる創作演習	総まとめとして，グループごとに一つのテーマを決め，創作する．
		15週	グループワークによる創作演習	同上
		16週	定期試験（実技試験）課題の解説とグループ発表	以上の内容の理解と自力で実装力を確認する

モデルコアカリキュラムの学習内容と到達目標

分類		分野	学習内容	学習内容の到達目標	到達レベル	授業週
専門的能力	分野別の専門工学	情報系分野	その他の学習内容	少なくとも一つの具体的なコンピュータシステムについて、起動・終了やファイル操作など、基本的操作が行える。	3
				少なくとも一つの具体的なオフィススイート等を使って、文書作成や図表作成ができ、報告書やプレゼンテーション資料を作成できる。	3
				少なくとも一つのメールツールとWebブラウザを使って、メールの送受信とWebブラウジングを行うことができる。	3
				コンピュータウィルスやフィッシングなど、コンピュータを扱っている際に遭遇しうる代表的な脅威について説明できる。	4
				コンピュータを扱っている際に遭遇しうる脅威に対する対策例について説明できる。	4
				データモデル、データベース設計法に関する基本的な概念を説明できる。	4
				データベース言語を用いて基本的なデータ問合わせを記述できる。	4
				メディア情報の主要な表現形式や処理技法について説明できる。	6

評価割合

	演習	実技試験	合計
総合評価割合	70	30	100
基礎的能力	20	15	35
専門的能力	50	15	65
分野横断的能力	0	0	0