Transcript ppt - 日本文理大学

1
情報メディア概論
～Web制作～
日本文理大学
坪倉篤志
http://www.nbu.ac.jp/~tsubokura
1.概論
2.要素技術・要素スキル
3.研究動向・技術動向
4.関連資格
5.社会(産業・企業・経済等)との接点
6.情報メディア学科における科目間関係
7.読書案内・学習アドバイス
2
はじめに
2006年や2007年のWebについて
Webに関連するニュースが色々
mixiやgoogleが多く賑わした年でしたね
他に、
・YouTube、にこにこ動画
・iPhone,iPod＆iTunes
・W-ZERO３にソフトバンク、ナンバーポータビリティ
・ラレコさん、kaeruotokoさん
・ねこ鍋
な年だったのでは？
3
Web of the Year 2006
ソフトバンククリエイティブの月刊インターネット情報誌「Yahoo！ Internet Guide」
http://www.itmedia.co.jp/news/articles/0612/07/news010.html
4
1.概論（Web制作について）
Webについて
インターネット、Webの世界で何をしていますか？
インターネット、Webの世界がどんな風になって欲しいですか？
インターネット、Webの世界がどうなると予測できますか？
Webの設計
人の知識、記憶の構成、仕組みのモデル化
人の知識とは？
五感（何がありますか？）
視覚、聴覚、嗅覚、触覚、味覚
5
1.概論(Web制作について)
Vannevar Bush(1945年) ハイパーテキストの概念の発表
個人で使う未来のツールについて考えてみよう。そのツールは、機械化された個
人用のファイルや書庫のようなものだろう。このツールには名前が必要だが、と
りあえずmemexと呼ぶことにする。memexは、自分の本や記録、情報交換のや
りとりなどを保存しておける装置で、機械化されているためにきわめて早く、か
つ柔軟に参照できるだろう。これは人の 記憶 を補助する大規模で詳細な装
置である。
Douglas C.Engelbart(1962-75) 実働するHyperTextSystemの構築
Theodor Nelson(1965) HyperText, HyperMediaの提唱。
６２年
Xanadu: 世界中のあらゆる文献、図表、データからなる世界的規模のネットワー
クで、何億というユーザーが同時に利用する事を目的としている。
1969年,インターネット開始(米) 軍事・学術研究
1992年,インターネット商用利用開始(IIJ等が開始)
1995年,MS-Windows95
皆さんは何年生まれですか？
インターネットに関する業界は非常に若い業界
３７年
１５年
6
Yahoo!の歴史（Yahoo! JAPANの歴史）
皆さんはYahooをどのように使ってますか？
メール？オークション？ショッピング？ 今やスゴク多くの機能がありますね
二人の開発者
デビッド・ファイロ（David Filo）、ジェリー・ヤン（Jerry Yang）
スタンフォード大学 電気工学科の博士課程
歴史
1994年4月、インターネットの個人的な興味を記録する目的で、自分たちの「道
しるべ」を作り始める
1995年4月、ヤフー・コーポレーション 設立
1996年1月、ヤフー・コーポレーションは日本のソフトバンク株式会社と共同でヤ
フー株式会社を設立
Yahoo!の歴史 http://docs.yahoo.co.jp/docs/pr/history.html
Yahoo!（ウィキペディア フリー百科事典） http://ja.wikipedia.org/wiki/Yahoo
Web上のブックマーク、検索エンジン、ポータルサイトとして始まる
さまざまなメディアを整理されたサイトへ
動画や音楽も、ブログや知恵袋、YahooDays（SNS）も
Yahoo! Japanのサービス一覧 http://services.yahoo.co.jp/
Yahoo! Japanのサービス一覧 http://services.yahoo.co.jp/
皆さんはドレを使ってますか？
7
8
Webにおけるメディア・情報について
Webページの表現で扱う情報について、考えてみましょう
メディアの種類
文字
Webページの表現
Webデザイン
音楽
映像（動画/アニメーション)
人の五感
視覚、聴覚、嗅覚、触覚、味覚
画像（２D/3D)
9
Webを取り巻く分野（Webデザインの視点で）
幅広い分野に関係する
マーケティング
e-business
電子商取引、
e-コマース
文章
レイアウト・色彩
2D・3D
映像（静止画・動画）
認知
学習
対話
教育
株
音楽
他
利用分野
認知科学
Human Interface
Artificial Intelligence
学術
ビジネス
Webデザイン
表現
音楽
情報構造
評価（ユーザビリティ）
技術
法律
知的財産権・著作権
組織・グループ
インタラクティブ
Network
ClientServer System
Artificial Intelligence
ページ制作,HTML,CSS,JavaScript
Webシステム,Perl/CGI,PHP,DB,Ajax
他、CMS,XML,C言語,RSS/RDFetc
ネットワーキング FTP,Telnet/SSH
ポータルサイト
CGM,SNS,
ポータルの設計と運営
10
ビジネスに勝つための戦略的Web構築
http://itpro.nikkeibp.co.jp/webdesign/index.html
11
1.概論(Web制作について）
Webページ(ホームページ)で扱える情報
文字情報
静止画像
動画像
音楽
要求される能力
様々な種類の情報を一つのページに統合的にまとめる力。
デザイン力・企画力・構成力
ページ達の関連「リンク」によるページ達のつながり
情報構造、インフォメーションアーキテクチャー
の設計（デザイン）能力
Webサイトと利用者との対話プロセス・学習に対する設計
ヒューマンインタフェースに対する知識
2.要素技術・要素スキル
•文字情報 12
•静止画像
•動画像
•音楽
0. 総合力,文章力、構成力、レイアウトデザイン、インフォメーションアーキテクチャー
1. HTML(Hypertext Markup Language) ：（マルチメディア演習）
•
2.
スタイルシート（ＣＳＳ） ：（ドキュメントデザイン１）
画像処理、素材制作技術
(adobe Photoshop,Illustrator他)、DTP系ソフト ：（マルチメディア基礎）
プログラミング(Perl, JavaScript)
•
サーバープログラミング、クライアントプログラミング ：（マルチメディア演習）
Flash(アニメーション、インタラクション) ：（ドキュメントデザイン２）
•
3.
4.
5.
コンテンツマネージメントシステム
•
•
6.
（CMS:Content Management System) ：（プログラミング応用）
プログラム言語
データベース言語
複合領域
音楽、ネットワーク、データベース、プログラミング
ヒューマンインタフェース：（ヒューマンインタフェース、ヒューマンインタフェース演習）
認知科学、心理学：（情報メディアと認知科学）
教育工学：（教育メディア論（教職必修））
知的処理、知識処理、等
13
3.研究動向・技術動向
1.
2.
複合領域へ、社会の基盤技術化
情報発信の個人化、容易化
•
•
3.
動画像の利用
•
•
4.
放送との連携（番組内で、放送後）
Yahoo！動画、iTunesStore 放送後にWebで、放送前にWebで
インタラクション迄の設計とデザイン
•
•
5.
6.
メルマガ発行の容易化
Webページ作成の簡易化(ある程度は) プログ, Podcasting, RSS等
利用者のページがページを辿るプロセスのデザイン
ユーザビリティ
e-learning産業へ
ユビキタス(ubiquitous)化
•
•
•
情報端末の小型化、高性能化（携帯情報端末の発展）
情報伝送技術の広帯域化、高速化、無線化
ボーダーレス、何時でも何処でも、コンピュータを意識する事無く
•
通信と小型PCの連携
14
ブログや掲示板
ブログ
日常的な日記、趣味の掲載等
トラックバックなどで他の人とつながる。
掲示板
仲間同士がワイワイする空間
匿名性と自由
モラル、ネチケット が非常に求められる
CGM
Consumer Generated Media（消費者生成メディア）
15
発信できるが、消せない世界
自分の社会活動・通常の生活に影響がある場合がある
良い意味
悪い意味
いろいろなところでコピー＆バックアップ
google serch キャッシュ
プロバイダーの運用規等の関係
元Google社員が語る、「Blogで解雇」で学んだ教訓
http://www.itmedia.co.jp/news/articles/0502/17/news072.html
「社員のブログがセキュリティを脅かす」、英Clearswift
http://www.nikkeibp.co.jp/archives/361/361313.html
就職活動への影響がある場合もある
発信はできるけど、消せない世界
16
4.関連資格
1.
3.
4.
5.
NACSE（Webマスター、ネットワーク）：ベンダーニュートラル(ひとつの
ベンダーにとらわれない、中立で、ネットワークに必要とされる基礎力
および応用可能な技術を保証します)、世界共通(国際基準で定義され
る世界共通の技術)、実践的(企業が必要とする技術と、学校で学ぶ技
術や資格取得のために学んだ能力)。
.com Master(☆,☆ ☆ , ☆ ☆ ☆）NTTコミュニケーションズインター
ネット検定。ビジネスで、生活で、求められる検定：IT社会は、事業者、
行政、住民において、利用者のITスキルの向上に伴い、ビジネス、行政
サービスの発展、利用者の裾野拡大を促す拡大スパイラルが形成され
ることで発展します。
Webクリエイター検定：全日本情報学習振興協会
Webプログラミング認定試験：サーティファイWeb利用・技術認定委員会
CG Creator（Webデザイン部門）： CG-Arts協会
•
他、IT,マルチメディアに関連する資格(要素技術、複合技術)
2.
17
5.社会(産業・企業・経済等)との接点
1. 広報媒体、情報発信媒体
•
•
企業や組織の主たる広報媒体としての利用
低価格かつ複雑な情報の提供の可能性
2. e-business / e-コマース
•
•
Webを用いた商店
在庫管理、
3. e-learning
•
•
教材や研究内容のWebを用いた発信
通信教育、遠隔教育のWeb化
4. 地域の活性化、コラボレーション
•
•
•
地域交流、地域活性化
観光や地元産業の広告媒体、電子商取引
SNS：ソーシャルネットワークサービス
MIXI ママトモとか、同窓生とか、同じ趣味の人
CMSの利用
18
6.情報メディア学科における科目間関係
知識
Webでできること（HTML,Perl,JavaScript,CMS,データベース等）
Eコマース、ネットワーク、Eビジネス
ヒューマンインタフェース、認知科学
デザイン、レイアウト
マルチメディア全般、IT業界全般
技術
文章作成能力
プログラム言語(HTML,CSS,Perl,JavaScript等）
素材制作技術（Photoshop,Illustrator等）
Flash(静止画、アニメーション、ActionScript)
19
7.読書案内・学習アドバイス
配布資料を参考
20
ラレコさん kaeruotokoさん
ラレコさん
http://www.geocities.jp/jugongordie/
やわらか戦車
くわがたツマミ
TVで放映、ゲームへ
kaeruotokoさん
http://www.kaeruotoko.com/
作品がTV番組や劇場で放映
News23（蛙男劇場）
GIHILLS NIGHT 六本木ヒルズの劇場にて公開
キーワード FLASH と インターネット と 個人で制作
21
＊＊＊万円台
＊万円～２＊万円台
昔は多くの人で取り組んでた→個人でも制作・開発できるように
機器として 専用機から汎用機へ （ワークスステーション→普通のPCで可能に）
制作ツールの低価格化、フリーでの配布（MovieMaker, iMovieやSketchUpなど）
世界に発信する方法として ブログ、YouTube、等
映像
プロダクションや制作会社
新海誠、ラレコ、kaeruotoko
世界がフラット化
大人数でしかできない → 少人数でもできる
通信料金にコストがそんなにかからない時代になりつつ… Skype / JAJAH
プロとアマが共存する環境
プロに求められること
素人に求められること
CGM：Consumer Generated Media
22
も1つ CGMの新しい流れ
MOD + Network
Second Life
MMORPG?
MOD
ゲーム環境にユーザーが作ったコンテンツを作り
海外版 「スターウォーズ」「スタートレック」などの既発売のパソコンゲームソフトのエンジンを用い、
ユーザが好みのゲームを作り出す
Second Life すべてユーザーが創造し発展させてゆく、永続的な 3D オンライン スペース
ネットワークを使って情報交換・取引
KML(Keyhole Markup Language)
Google Earth
Google SketchUpで3Dモデルの作成
Google 3Dギャラリーにて公開
3D ギャラリー ネットワークリンク 3DとEarthをつなぐ
Google Earthで表示
23
勉強の仕方：分野との接し方
今日の最新技術が、明日は過去の遺物になる可能性のある分野
新たな情報を如何に捉えるか！！
情報源
ニュース系サイト
雑誌
解説記事等
BBSやメーリングリスト
色々なモノに興味を持つこと
– 覗いてみること
– やってみること
– 聞いてみること
情報の真偽と将来の広がりを見抜く力
変わるものと変わらないもの 見極めが重要 （新しいから○、古いから× ？）
これからのWebについて
Web2.0? Ajax? Blog?
Web3.0がどうとか言ってる人も…
24
勉強の仕方：分野との接し方
Web関連分野の特徴
個人が情報の発信者になれる
個人が大企業を動かす可能性がある
君が世界の中心になる可能性がある
悪い例
ウィルスの制作者、ハッカー
良い例
とほほのWWW入門 http://tohoho.wakusei.ne.jp/
Google / Yahoo
ラレコさん / 蛙男商会さん
自分で自分の可能性に壁や限界を作らないこと
（言い訳を探さない）
25
課題について
1.
Web of the year 2006の中から1つ選び、各自の言葉で説明しなさい
2.
下記のキーワードの中で解らない言葉を1つ以上選択し、各自の言葉
で説明しなさい。（技術の利用されている場所、特徴 ２００字程度 ※全てわ
（２００字程度）
かる場合、興味のあるキーワードを選択しなさい）
キーワード： CMS, SNS, CGM, Perl/CGI, Ajax, CSS, HTML, Podcast, RSS,
xoops, wiki, Skype, JAJAH
※ できるだけ、自分で考えた文章を書きなさい。
※ 丁寧な字で書きなさい。読めない字は評価できません。
提出について
–
–
–
できるだけ、本日中に提出
最終〆切 １０月１０日（水） 18:00
提出先 坪倉研究室（不在時はポストへ）
–
評点 （キーワード１ ＋ キーワード２ ） × 〆切に間に合う