ネット講座の受講について

common styleが提供する今回のネット講座では、教材開発を自動化しているためHTMLを採用しない予定です。受講には「Apple iTunes」が必須となります（RSS Feedとチャプターを埋め込んだ拡張Podcastの発行）。もちろん、講座はiPodに転送して視聴できます。

• Mac OS X 10.3.9 以降
• Windows 2000, XP または Vista

上記以外の環境の方に対しては、CreativeCommonsによる対応などを検討中（有志の方々によるデータ変換やHTML化などを可能にする等）。
尚、YouTubeでも公開しますが、画質劣化による視認性の問題があります。また、iTunesで利用できるチャプター機能（音声および映像の引用）などは使えません。

講座「デジタルテレビ向けCMSを作ろう！」

学校法人阿佐ケ谷学園・高校生向けネット講座「デジタルテレビ向けCMSを作ろう！（仮）」

今年の夏休みに実施します。無料講座です。受講申し込みについては「common style」を参照してください（※現在、関係者にFeedでのみ配信中。HTMLドキュメントの配信は7月からおこないます。一般の方はWebブラウザでアクセスしてください）。

メインテーマ：

• デジタルテレビ向けのマイページおよびファミリーページのプランニング

コンセプト：

• ネット端末である「デジタルテレビ」のサービスコンセプトは「サーチ」ではなく「レコメンデーション（recommendation）」の最適化

実習：

• デジタルテレビ向けの「ファミリーページ」（プロトタイプ）を作ってみよう

オーサリング・インターフェイス：

• テレビリモコンは使用しない。ケータイによる編集（サイトのオーサリング）を反映させる仕組みを採用する

使用アプリケーション：

• RapidWeaver の新バージョン3.6をオーサリングエンジンとして使用する（※デジタルテレビ向けSaaSとして想定）。コンストラクションキットはデジタルテレビ用（ワイドスクリーン）にカスタマイズしたものをインストールする

インストールされるパッケージ：
※以下はオンライン販売されている有料テーマの内容。講座ではデジタルテレビ用（ワイドスクリーン）に作成したオリジナルテーマを使用する

ページインスペクタの例（カラーマネジメント、レイアウトマネジメントなど）

※講座では、BMLではなくHTMLを採用

参考：
BML（Broadcast Markup Language）については以下の書籍を参考に
「BMLコンテンツ開発ハンドブック　地上デジタル／衛星デジタル放送編」

design zero：ナレッジ、未来、社会、仮想

高校生向け講座、概要は以下のとおりです。昨年のWeb技術から（自分の仕事内容にあわせて）かなり広げています。詳細はこれから。

［１］ナレッジ

• 形式化されない知恵について考えてみよう
• 1週間で上級者になれる人・1年経っても初級者の人、何が違う？
• ライフスタイルを日々アップデートする
• 情報の「編集」について考えてみよう
• 環境が人を変える

［２］未来

• PC化するケータイの将来
• TUIを採用したApple社のiPhone
• CUI→GUI→TUI ?
• 何に採用される？タンジブルなインターフェイス

［３］社会

• 子供部屋の功罪
• ケータイをもつ小学生の情報収集能力
• 子供向けSNSにおける同調圧力
• ネット社会のルール、ロール、ツール

［４］仮想

• 映画「MINORITY REPORT」
• Second Lifeをコミュニケーションシステムとして考えてみよう
• Second Lifeをクリエイティブツールとして考えてみよう
• リアル社会では職なし、仮想社会でアルバイト
• RMTと警察と裏社会
• 仮想社会と税金
  

さて、先日「オリジナル素材を用意する予定」と書いてしまいましたが、年間計画をながめた感じでは絶望的（仕事の合間で実行できるかどうかの判断）。多分、今年も非公開やむを得ず‥という講座が出てきそう。個人がやっている趣味なので、ご了承を。

この試みが実現できているのは、実証実験データや小規模な勉強会の記録（映像、音声）を最大限に活用しているからです。インターネットで配信するために作り込んでいる講座コンテンツはごく僅かで、ほとんどはライブ情報の二次使用ということで、仕事の合間でも可能になっているわけです。

ネットで公開する講座コンテンツでは「カット処理」を施しています。以下のとおりです。

カット処理

• 著作権を侵害する可能性があるシーン
• 個人情報を含むシーン

具体的には以下のような場合です。

design zeroでおこなっているカット処理

• ゲストが持参した技術資料などが映っていた場合
• イベント用に提供された資料映像が映っているシーン
• 音声に特定の個人情報が多々含まれている場合
• 取材映像にショップの看板やポスターなどが長時間映っているシーン

日々おこなわれている勉強会などは「インターネットで配信する」ことを前提としていないため、上記のような問題が出てきます。たとえば、開発者の方がイベントのために用意した技術映像などは、ネット配信NGとなる場合が多く、上映シーンは全カットとなります。
大学でも授業のネット配信において同様の「カット処理」が使われており、特に招かれたゲストの「ここだけの話」は全カットになっている場合が多い。講義中に上映されるスライドや提示される資料なども一部カットしなければならない場合があります。教育目的の場合、特例でかなり優遇されているのですが‥ネット配信では適用されませんので。

design zeroで全カット、非公開となったユニークな例を紹介しましょう。当然の処置なのですがクレームをいただいた時は「えっ、なんで」と思ってしまった例です。

クレーム例「音楽が背景に流れていた」

小規模な勉強会の例。会場の隣が大型のカフェ。大音量で流れていた店内音楽が会場にも入り込み、録音されていた。音楽はエレベーターミュージック（環境系サウンド）ではなく有線で放送されているJ-POPであった
［編集では消せないので、やむを得ず全非公開］

これも「インターネットで配信する」ことを前提としたイベントなら、会場を変えますね。
たとえば、テレビ番組のDVDでも背景音楽を消すためアフレコ処理している例があったり、プロレスなどもDVDでは選手の入場曲を変えていることがあります（もちろん歓声は後入れ、アナウンサーの実況も巻添えでカット）。よくある二次使用の処理です。

「インターネットで配信する」ことを前提にすると資料素材なども可能な限りオリジナルで作成する必要が出てきます。ゲストの方が持参される技術書類などはどうにもなりませんが、少なくとも話の流れが欠けてしまわないようにオリジナル資料でつなぐことになります。
ある程度はお金で解決できます（以下JASRACの包括契約）。ただ、費用をかけるのなら法人の事業に入れてしまった方がよいので難しいところです。レギュレーションや実利的な制約のない個人活動が目的なので、工夫してやらねば‥ということですね。

参考：
非商用配信　教育機関（JASRAC）
ご注意いただきたい利用方法

非商用配信（包括的利用許諾契約）

個人
10曲までの年額使用料10,000円
（ダウンロード形式、ストリーム形式、どちらの場合でも同じ費用）

教育機関
10曲までの年額使用料20,000円
（ダウンロード形式、ストリーム形式、どちらの場合でも同じ費用）

非商用配信利用者が広告収入のみを得て行う場合（商用配信の特例に該当）
10曲までの年額使用料60,000円
（ストリーム形式の場合は、商用配信の規定が適用される）

2007年の講座

高校生向け講座、2007年も4月のスタートです。カリキュラムは3月に公開。テーマは、私が本業でおこなっている「モノ、場所、仮想のつながり」を中心に構成しています。
今年はできるだけオープンネットで公開していきたいと思ってます。いつも権利処理がうまくいかずクローズドネットのみで消費されていくわけですが、今回は可能な限りオリジナル素材を用意する予定（費用がかかるため講座数は激減しますが、インターネット上で公開できる講座は増えます）。本業に関わるプライベートワークなので、がんばりたいと思います。もちろん、法人の方も‥

---

以下は、2006年のアーカイブ（一部）

・effect vol.1「編集と作為」前編（18:16）
・effect vol.1「編集と作為」後編（19:40）
・effect vol.2「流行の作り方」前編 →クレームがきて非公開
・effect vol.2「流行の作り方」後編 →クレームがきて非公開

---

以下は、2005年のアーカイブ（一部）

2005年12月19日〜／ネットラジオ講座1を順次配信
2005年12月26日〜／ネットラジオ講座2（一部映像）を配信

■2005年／ネットラジオ講座1
高校生のためのデジタル編集工学
映像表現A

■2005年／ネットラジオ講座2
［ブラックボックスデザイン］高校生のための情報デザイン

●公開：
・クローズドネット（非公開）
・オープンネット（common style）

※以下は過去に掲載した抜粋記事

・ブラックボックスデザイン［1］
・ブラックボックスデザイン［2］
・ブラックボックスデザイン［3］
・ブラックボックスデザイン［4］
・ブラックボックスデザイン［4］補足
・フラッシュアニメ講座[1]
・ストーリーメイキング［1］

情報デザイン「effect vol.1」

Keynote 3で作ったビデオコンテンツ、映像ブログにて配信。
1本40分弱あるので、2回に分けてアップロード。iTunesに登録している場合は自動的にダウンロードされる。手動でダウンロードする場合は、右クリックでメニューから（拡張子が「m4v」になっているので）

iPodでも視聴できるように文字大きめに調整、PSPでも視聴OK！
※PSPはシステムソフトウェアを2.80にアップデートする必要がある

・effect vol.1「編集と作為」前編（18:16）
・effect vol.1「編集と作為」後編（19:40）

・effect vol.2「流行の作り方」前編
・effect vol.2「流行の作り方」後編

なぜ、ビデオなのにKeynote 3を使ったのか、理由は昨夜の音声雑記にて

［file-185］オートメーション・ファクトリー

情報デザイン系講座の公開（8）最終回

このエントリーのシリーズも今回で終わり。
記録を見ながら振り返ってみる。

１）先週末、Keynote 3を初めてさわる
２）講座ビデオの編集が自分のマシンでは非常に重たく、作業困難であることに気付く
３）Keynote 3で講座ビデオを作ろうと考える

４）Keynote 3のコツがつかめず試行錯誤の連続
５）Appleの自動処理ワークフローにはまる
６）けっきょく火曜日の夜まで「お勉強」が続く

７）Keynote 3と自動処理の概念、ある程度理解する
８）水曜日の夕方から講座ビデオの作業再開
９）講座ビデオが完成する

講座ビデオを編集して映像ブログにアップするという目的が、いつの間にかKeynote 3の習得とApple自動処理ワークフローの研究にすり替わってしまった。仕事を圧迫しない程度の「趣味」ということで、なんとか自分を納得させた。

けっきょく、Keynote 3による編集作業はトータルで6〜8時間くらい。

●完成したビデオのデータ：
オーサリング：Keynote 3
公開形式：QuickTimeムービー（MPEG-4）
ビデオの時間：38分

さて、現在は「圧縮中」である。
‥というのは、iDVDに転送してしまったのだ。フルサイズ、最高品質で書き出されてしまった。これをiPodで見られるように変換中。H.264圧縮、恐ろしく時間がかかる‥

すべて自動処理なので、こちらは何もしなくてよいが、待ち時間が耐えられない。まぁ、ぼんやり待ってる必要はないので、仕事をする。打ち合わせもある。

圧縮完了後、アップロード予定。

情報デザイン系講座の公開（7）

Keynoteの各スライドに音声ファイルをドラッグして完成。
ビデオ書き出しテストは、解像度とフレームレートを下げて実行（それでも30分ほど待たされた）。書き出されたQuickTimeムービー、なんと40分ぴったり。

しかし、40分のビデオを公開するのはちょっと厳しいと思うので、「10分×4本」もしくは「20分×2本」に分けよう。
ムービー書き出し（要するに圧縮）にかなり時間がかかると思うので、処理させたまま就寝‥

情報デザイン系講座の公開（6）

仕事の合間、細切れ時間を使いながら進めているが、なんとかVol.1は完成しそうだ。
Webデザイナー向け講座としては、あまり一般的ではない内容だが、とても重要なので外さず構成した。
とりあえず‥本日中にまた更新（多分これが最後）

情報デザイン系講座の公開（5）

「趣味の時間」が終わって、やっと‥講座ビデオの編集に入る。
講座ビデオの編集といっても、再利用するのは音声と一部の図版のみ。当初、権利処理をクリアしているシーンだけを編集しようと思っていたが、映像ソフトを使った作業は恐ろしくヘビーで私のマシンでは対応できない。

実は映像ブログで公開しているビデオは、320×240ピクセルのMPEG-4を素材にしているのだ。手順は以下の通りである。

１）ムービーカメラをメモリスティックビデオレコーダーに接続
２）録画する（形式：H.264 AVC QVGA 768k）
３）メモリスティックに記録されたビデオファイルをPCにコピー
４）QuickTime Proで編集
※オーバーラップ処理やテロップを入れる場合のみ映像ソフトを使用

参考：ビデオ編集も自動化

上記の方法だとiBookでも軽快、簡単にビデオを作成できる。画質、音質は映像ブログにアップされているビデオを見ていただきたい。劣化しているが、低画質でもない。

今回はKeynote 3を使うことで、さらに軽い作業になっている。もちろん、実写動画が少ないスライドで構成された映像だから適しているのだが。

ずいぶん横道にそれてしまったが、情報デザイン系講座‥多分、明日中には公開できるであろう。

情報デザイン系講座の公開（4）

昨夜、完全に「趣旨」がすり替わっていることに気付いたが、この勢いを重視した。
（「講座ビデオを編集してアップすること」が「Keynoteの習得」になってしまったことを許したのだ。仕事だったら大問題だが、趣味というのは「気持ちよさ」と「好奇心」で満たされるので、良しとする）

おかげで、Keynote 3の特性が理解できた。
‥というより「iLife」「iWork」というパッケージのターゲットについて再考するきっかけになった。ルール・イン・ルールの概念、標準化を（特定の場所で）さらに標準化する効用もメモしておいた。

パーソナルなコンテンツファクトリーにとって、自動処理はとても重要だが「Automator」のアプローチはとても難しい。この世界はブラックボックスでよいのかもしれない。

さて、そろそろ「趣味の時間」も終わりにして、仕事に完全復帰しなくてはならない。その前に、講座ムービーをアップする。
本日中にまた更新。

余談：
「Windows Live Writer」にモダンパブリッシャーの香りが‥

情報デザイン系講座の公開（3）

Keynote 3のコツがつかめてくる。
それより、Automatorの自動処理にはまってしまった。

「Keynote 3　→iMovie HD　→iDVD」のワークフローが出来つつある。今後の講座スライドをKeynote 3で作成しておけば（音声を貼り付ける作業は省けないが）、ビデオキャスティングも自動化される。圧縮、ビデオ書き出しの後、ブラウザを起動、MP4ファイルのアップロードまで自動処理してくれる。
映像表現はかなり制限されるが、編集作業が無くなるのは有り難い。

まずい、いつの間にか目的がすり替わっている‥
（仕事もあるので、続きは明日朝に‥）

iDVDに転送すると、チャプターとメニューが自動的に構築される

情報デザイン系講座の公開（2）

今回、まったく新しいワークフローを試しており、（初めて使う）Keynote 3に四苦八苦。まだコツがつかめていない。Keynoteでチャプター付きのDVDが簡単に作成できるのは驚きだ（iDVDに転送すると自動的にオーサリングされているのだ）。

Keynote 3を使うメリット：

・音声付きビデオで配布できる
・PDFで配布できる
・チャプター付きのDVDで配布できる

※Automatorでビデオ、PDF、DVDが自動処理される。この自動処理がポイントだ。書き出しの作業さえ手間がかからないので、ほんとに楽である。Windowsでこういうワークフローを”簡単に”構築するにはどうしたらよいのだろう？

ビデオで公開するのに、映像ソフトを使わないというのはFlash以来か。
夜までに終わらせる予定だが、ズレこむ可能性あり‥
本日中にもう1回更新。

情報デザイン系講座の公開

講座名：effect
配信日：8月14日（月）夜になります
ビデオ形式：QuickTimeムービー（MPEG4）
内容：対象を「一般向け」に変更して再編集
関連：講座編集についてのエントリー

希望講座のリクエスト方法（再）

関連：講座再放送

●候補１：情報デザイン系の講座
3つの候補の中で一番Webデザインに関係のある内容です。但し、技術やテクニックにはあまり触れず、「情報」の特性、価値、影響などを追求しています。

●候補２：編集工学系の講座
エディトリアル・エンジニアリングの学習ですが、メディア（主にテレビ）の情報編集による「大衆操作」などダークサイドなテーマを多々含みます。

●候補３：視覚表現系の講座
アニメーション表現が主です。個人でストーリーアニメーションを作りたいという人向け。一応、Flashをツールとしていますが「ストーリーメイキング」など話作りも含まれます。

視聴してみたいと思う講座を選んで、以下のメールアドレス宛てに送ってください

design_zeroアットマークadmn.com
（アットマークは@です）

メールの件名欄に

候補１→「情報デザイン」
候補２→「編集工学」
候補３→「アニメーション」

のいずれかを記入してください
（機械的に処理しますので、フリーメール等でもかまいません）

希望の多い講座に決定します
メールの受付は7月31日まで

8月1日に告知、中旬に公開します
ビデオの形式はMP4（FlashVideoも用意する可能性あり）、40分程度になります

夏休み「Webデザイナー講座」再放送

過去の講座から使用可能なものをミックスしながら、再編集をおこない8月に公開する予定。

高校生向けの講座だが、一般の方々にも参考になるよう編集しようと思う。

以下は、候補の講座記録およびメモ（一部は視聴可能）である。この中から選出して再編集する。尚、以下の講座は一部音声のみ公開されているが、大半は非公開になっている（現在のところ、クローズドな環境で視聴する仕組みになっているため）。

情報デザイン関連はWebデザイナーの皆さんに役立つかもしれない。ストーリーメイキングおよびフラッシュアニメ講座は趣味的なレベルでよいかもしれない。
余力を考えると公開できるのは1講座、要望の多い方に決めようと思う。

＞リクエストお待ちしています

●common style 勉強会
「高校生のための情報デザインB　ウェブ・ディレクター・システム」

・視聴する［Flash Video（標準画質）／9:32／12.6MB］
※Flash Player 8 が必要です
（FlashVideo低画質とMP4ファイルは講座タイトルのリンク先にあります）

●ネットラジオ講座
情報デザインの課題
記録：
［Cのちから］高校生のためのデジタル編集工学
［フラッシュアニメ講座］映像表現A

●知のアーキテクチャー講座
・高校生向け講座「知のアーキテクチャー」
・Web視覚表現「20年タイムライン」

●common style meeting
・中学生とネットコミュニティ
〜空気のように意識しないインターネット
参考記事：
中学生の皆さんには最強のWebプロデューサーになってもらう

●design zero - PSP web
「ミドルディスプレイとしてのPSP」
関連情報：「PSPユーザー優勢」

●創造塾
・フラッシュアニメ講座とノベル版Serendipiter
・高校生向け特別講座「ストーリーメイキング」
・ケータイ写真学「ケータイで綴る低解像度の世界」

●講座メモの記録
「Webクローズドビジネスとアセットホルダー」

ケータイ写真学

講座「ケータイで綴る低解像度の世界」

信号待ち、カウントしながらケータイのボタンを押していく。目の前を通過するクルマが絶妙のトリミングで記録される。偶然の面白さ。

夜、走りながらケータイのボタンを押していく。光の帯で構成された抽象世界が作られる。偶然の面白さ。

カメラ付きケータイを持って街へ出よう。
幅180ピクセル以下の低解像度で表現できる有限世界、偶発的につくられるビジュアルの斬新さ、インスピレーションを感じさせる作品を楽しもう。

4年前の講座「ケータイ写真学」（ヒドゥンアート）を現在のケータイでやってみます（当時はJ-PHONEの写メール）。映像ブログ「zero」にて配信します。

知のアーキテクチャー講座

高校生向け講座「知のアーキテクチャー」の補足：

受講者の皆さんが就職するのは、2011年頃。目指しているWebデザイナーという職業はどう変化しているでしょう。大学に入ってからプロとして活躍している先輩もいますので、機会があれば体験談を聞いてみましょう。
以下は、前回お話したWebデザイナー（大学3年）さんからのアドバイス抜粋

・W3Cのドキュメントを読み込む
・Webデザイン関連の書籍を可能な限り買って読む
・「理想と現実」を分けながら読み込むと良い
・無料セミナーやワークショップには参加する
・海外のWebデザイナーと積極的に意見交換する
・ミクシィのWeb関連コミュニティに参加する
・とにかくお金がかかるのでアルバイトせよ（→？）
・プロダクションの人との飲み会には絶対に参加する（もちろん未成年は×）Webの「理想と現実」を把握するには一番良い

補足：

1931年のエマニュエル・ゴールドバーグ（フィルムにIDセレクタを割り振る索引手法）から始まり、ティム・バーナーズリー（World Wide Web）まで、発表された概念、影響を受けた人、専門家の反応など、お話してきました。

2006年現在、Webで起こっていることをカードに書き出し、過去発表された概念やアイディアと結びつけてみました。誰が「誰の影響を受けて」発想したかを議論し、現在のトレンドと照らし合わせてみましたが、如何だったでしょう（コメントはfへ）。

課題は「2010年、HTMLから○○○へ」です。深く追求すべきポイントは講座で強調した3つ。注意すべき点は、国や企業の思惑です。主だった企業の戦略はWebの発展に大きく影響してきますので、公開されているロードマップだけではなく、各国ブロガーのエントリーも収集しておきましょう（翻訳ツール可／あくまで参考というレベルで）。

・タイムラインの作成（1931年〜2010年まで）

ストーリーメイキング［1］再

●第2回目は4月上旬に決まりました。ネットで公開されます。

common style　ネットラジオ講座
高校生向け特別講座「ストーリーメイキング」

・デジカメを持ってフィールドワーク
・風景の撮り方
・Photoshop Elements でイラストに変換
・画像を並べて物語をイメージしよう
・物語の構築
・語り聞かせの練習

デジカメで撮った写真をPhotoshop Elements でイラストレーションに変換します（この講座は画像処理が目的ではありませんので操作の詳しい解説はありません）。

■サンプル写真［画像を拡大する］

業務連絡「Webクローズドビジネスとアセットホルダー」

3月の勉強会
■テーマ：「アセット流通」

・「作り込んだHTMLとCSSを必要としない」世界
・コンテンツの”コンテンツ”を売る商売
・アセットホルダーという職業
・CMS第三世代

・アセットからHTML
・アセットからPDF
・アセットからSWF

●高校生向け講座への落とし込み：

・セマンテックス、ルール決め
・取材と情報デザイン
・アセット作り
・テーブルワークによる検証
・アセットをCMS（ブログでもよい）にインポート
・CSSプランブックでページネーション決め
・公開、意見交換

●事例：eラーニング業界
共有化を前提とした教材は、HTMLやJava、Flash、PDFなどで作り込まない。
特定の技術に依存した学習コンテンツ（JavaやFlashなどで作り込んだ教材）では、共有化がうまく進まないため、基本的にはアセットでやり取りされる。
アセットは各社のCMSにインポートされ、それぞれの講座にあわせた作り込みでリミックスされる。個人（受講者）の場合はアセットから必要な情報だけを取り出して、独自の教材を作成できる。
「パーソナルCMSの進化」および「作り込まないインパクトはブログを拡張する」を参照。

●デザイナーの視点
・デザインする要素がより明確になる
・時間を要するデザイン作業に集中できる
・ルーチンワークが減少する

Web視覚表現「20年タイムライン」

報告：「高校生のための情報デザインB」について

概要はほぼ決まりましたが、カリキュラムはこれからの作業となります。デザイナー教育ではありませんが「Webを活用した情報発信」はビジネスにおいて必須のスキルになっていくため、デザイナー・ロールプレイングを取り入れました。
この作業は3月になってから本格化します。

・必修「情報デザインA」高校1年〜
・選択「情報デザインB」高校2年〜

選択講座の「情報デザインB」は視覚表現技法を中心としたカリキュラム

●学習B-1「Webの視覚表現」
テーマ：
2012年、Webアーキテクトとして独立するために
〜Web視覚表現の歴史を学び、2012年をイメージしてみよう

・Webデザイナーという職業はどう変化する？
・Webデザインはどこまで自動化される？
・Webブラウザ、プロダクト特性の変化は？
・パソコンWeb、テレビWeb、ケータイWeb
・クローズドIPネットワークの広がり

●Web視覚表現「20年タイムライン」

１）1992年「構造と表現の分離」
２）1994年「font要素の議論」
３）1995年「ブラウザ戦争・開戦」
４）1995年「HTML3.0の哲学」
５）1996年「CSS1勧告」
６）1997年「HTML3.2勧告」
７）1998年「CSS2勧告」
８）2000年「XHTML1.0勧告」
　↓
2002年「Wired Newsリニューアル」
2003年「css Zen Garden公開」
　↓
構造と表現の分離に立ち返る
※過去の後遺症をCSSハック(裏技)によって吸収
　↓
構造化ドキュメントとデザイン(CSS)に関する
参考書が次々と出版される
　↓
2006年　高校2年「情報デザインB」★現在
2007年　高校3年
2008年　大学1年
2009年　大学2年
2010年　大学3年
2011年　大学4年／アナログ停波
2012年　社会人

●課題：
CSS3の議論に参加
http://www.w3.org/

●課題：
CSS2のワークフローを広げてみよう

［拡大表示］

common styleと学習社会（3）

common style meeting
中学生とネットコミュニティ
〜空気のように意識しないインターネット

・講演時間：30分
・配信日：2月上旬
・配信：ライブ配信できない場合はオンデマンドになります
・形式：音声のみ（MP3）／音声+スライド（Flashムービー）

女子中学生とアイデンティティ・クライシス(identity crisis)
「本音・建て前」ブログと多面的自我
〜スタイルシート(CSS)に託す自我像

フラッシュアニメ講座とノベル版Serendipiter

以下の2つの試行講座がマージされ、新しいカリキュラムとなった。当面、”フラッシュアニメ”（Flashで作るストーリーアニメーション）をメインにしていく。

・フラッシュアニメ講座
・Flash 講座A

教科書という扱いではないが、1回30分という短い講座なので基本操作などは書籍に頼ることにする。必要と思われる方には参照していただこう。

来月中には、ほとんどの書籍執筆が一段落するので、再来月には開講できる見込み。Flashの習得よりもアニメーション表現を追求する講座になる。特にcommon style.の「情報デザインB」でおこなう講座は、意味と表現が中心となる。

・common style.「情報デザインB」
　→高校生向け
・monkeyish studio「フラッシュアニメ講座」
　→フラッシュアニメ制作に興味がある40歳以上の皆さん

■余談
「フラッシュアニメ講座」の40歳以上というのは、大まかな対象でしかない。
第一次アニメおたく世代ということもあり、社会的な立場などはまったく関係なく「いつかアニメを作りたい」と思っている人が意外に多いのだ。老後の楽しみにしようと考えている人もいるくらい。この場合のアニメには、いわゆる「アートアニメーション」も含まれる。お金があれば16ミリフィルムでコマ撮りしたい‥という話しもあった。
個人ベースの制作環境はどんどん進化しており、当初考えていた「経済力の目安」も下がっている。つまり、デジタルならお金の心配も軽減されていく（もはや年金には頼れないが‥）。ネットコミュニティの中で作品を発表し、パーソナルな売買も行われる「新しいノスタルジーコンテンツ」に発展するか？
こんな世界が成立するのは日本だけかもしれない‥と思うこともある。

■フラッシュアニメの原作となるノベル版「Serendipiter」
統計資料など収集中。あちこち取材しなくてはならない。最近、ネオニートという呼称が増えてきたので要検討。小説は「Serendipiter」ページに掲載予定（まだ、ぜんぜん更新されていない‥）。語り下ろしをはやくマスターしよう‥

■フラッシュアニメ「セレンディピィター Serendipiter」

日本は、ステイタスの格差をあまり感じることのない「中級社会」であった。ネットで巨大な匿名掲示板が維持できるほど、誰もが「中級」の意識を持っていたのだ。
しかし、リスク社会が到来してから一変してしまった。二極化が拡大し、「希望」を描けない人たちがたくさん出てきた。そこそこ豊かな日常生活を送っているのに将来の見通しがたたないという状況が続く。

いくら努力しても現状を打破できないことが分かった若者たちは、「現実逃避」にエネルギーを注ぐようになる。

2011年、世界中で共通の異変が起こる。
実社会には一切、姿を見せず、ネットで自我を確立しようとする「ネオ・ニート」が急増。どこで、どんな生活をしているか、まったく明かさず、実社会から逃避し続ける。

米magic社は、ネオ・ニートをターゲットにした実社会代行サービス「エージェント」を開始。半年で数千万のユーザーを獲得する。
後に世界中の非難を浴び、同社はサービスを中止するが、エージェントを回収することはできなかった。現在、世界各国で起こっている「エージェント」事故は、ネオ・ニートたちの過激なメッセージである。

中学生の皆さんには最強のWebプロデューサーになってもらう

1月24日（火）午前4時
朝刊にはライブドア関連の大きな記事。
仕事以外のことで慌ただしく、本日も貫徹となった。1日おきの貫徹（48時間起きて6時間寝るサイクル）なのに、まったく眠くないのが恐ろしい。ゴールが見えてるから実行できているのだろう。
昨日は音声雑記、収録できず。

今週は2回ほどスーツにネクタイ姿で参上する。Webとかデザインの世界から離れた立場で行動する。この切り替えが難しいのだが、複数の異なった視点があると客観性が養われる。メキシコは副業でプロレスラーをやっている人が多い。教師とか牧師さんとか‥
そんなイメージか（ちょっと違うか）。

情報デザインA関連のメディアリテラシー・パートについての意見交換があった。やはり、プロの機材を使うことに意味がありそうだ。海外のメディアリテラシー教育では、テレビ局のスタジオやビデオ編集器などを使わせている。
ディスカバリーチャンネルは、メディアリテラシー教育にすごく熱心だ。カメラアングルや照明、BGMなどは文章における形容詞であり、そこを読み解く視聴者が増えれば、番組が作りやすいということだ。

情報デザインAでは、Webを体験の場として設定したので、中学生、高校生にDreamweaverを使わせることになる。プロの作業を体験させることが重要であって、デザイナーの教育ではない。ここを外さないように注意したい。

以下、common style.からの転載

中学生、高校生を対象としたメディアリテラシー
情報編集の体験

■XHTML入門の骨子
・ドキュメントにセマンティックスを持たせる
・コンピュータプログラムがドキュメントを理解してくれる
・検索、抽出、編集、共有が可能になる
・さまざまなWebサービスが登場する
・利用者にとって便利なインターネットになる

■CSS入門の骨子
・ドキュメントを読みやすくする
・ドキュメントを美しくする
・ドキュメントをかっこよくする
・読みたくなるヘッドライン（見出し）を考える
・ヘッドライン（見出し）を目立たせる「余白」をつくる
・目立つポジションをページの中から探し出す

■情報デザイン
・コンピュータプログラムに正しく情報を伝える
・人間に対する訴求力を高める（グラフィックデザイン、モーショングラフィック）

■議論
・かっこいいデザインって何？（Appleやnikeなどの事例）
・「かっこよさ」一般の人の感じ方
・「かっこよさ」デザイナー（作り手）の感じ方
・ダサいデザインって何？
・政府や自治体の広報デザインはAppleのようなデザインにしちゃいけない？
・アキバに溢れているデザインって海外ではどうしてクールなの？

・「かっこいい」「ダサい」をロールプレイングして考えよう
・人によって変わる価値観
・「誰に対して」というターゲットについて知っておこう

・「みんな知ってる」の「みんな〜」って誰？
・ドキュメンタリーは個人の解釈

■業界のお話
テーマは以下のとおりだが、子供でもわかるメタファー（ゲームなど）に変えて話す
以下の心理を理解することで、人の誘導が可能になる。例えば「わざと怒らせて注目させる」等のデザインがわかる。テレビのバラエティ番組などでは高度なキャスティングによって「わざと不快にさせて注目させる」といった技法も多用される。
※事例が生っぽいので、捻くれた考え方がつかないように注意しなければならない

・Flashって嫌い！Web 2.0って嫌い！
・職業プライドと対人比較欲求
・知らない分野に対する恐怖
・知りたいけど、分からないという不安
・ポジティブな批判とネガティブな批判
・許容する力

●この講座のコンセプト：
「最強のWebプロデューサーになってもらう」
私たちが毎日取り入れている情報は編集されている。作り手には意図がある。実際にその職業を体験することで理解するのが目的

インストラクショナル・デザイナー・ミーティング

common style.では、2007年よりインストラクショナル・デザイナー向けの勉強会を立ち上げます。

インストラクショナル・デザイナーとは「教育デザイナー（もしくは教授デザイナー）」のことで、学校から企業そして生涯教育まであらゆる環境において、教育をデザインしていく職業です。

この度、1998年に公開した「AICC ID」を「CSID（common style Instructional Design）」にアップデートいたしました。8年の期間を経て、大幅に改訂しています。

CSIDに関するオンライン・プレゼンテーションを今週金曜日に予定しています。「common style meeting」の第三回目として行います。

・教育デザイナーの仕事とは？
・「教える」ための技法
・ネット社会とリアル社会
・e-LearningからMixture Learningへ

※ライブ配信ができない場合は、MP3（音声）およびFlash（音声+簡易動画）のオンデマンドになります

common style meeting

第一回「common styleと学習社会（1）」
Mixture Learning, ST2, 3size-display

音声データは[19分28秒]に編集しています。
スライド画面を見なくても問題ありません（ネットラジオ仕様になっていますので音声だけで理解できるように話しています）。

・音声データを聴く／標準音質（32k/4.4MB）
・音声データを聴く／高音質（64k/8.9MB）
・音声＋簡易動画（スライド画面）を視聴する／Flashムービー（只今準備中）

お問い合わせ：境［office@admn.com］

ユーザーをトラッキングするアプリケーションソフト

1月12日（木）多分、晴れ
風邪日記。不思議なほど順番に「高熱」→「喉」→「頭痛」→「鼻」ときて、（ほぼ順番に）症状おさまる。ただ、喉だけどうしても引っかかる。痛みは頭痛がきた後、スゥーとひいたのだが、声がうまく出せないのだ。

打ち合わせの時は、間があるので何とかタイミングをみながら声を調整できるが、それでも1分ちかく続けて話していると掠れ声になり、ひっくり返ったりする。やむを得ず、今は「話し好きの無口」を演じている。雑談好きの人間としてはかなり辛い。

明日の夕方、common styleの件で30分ほど話さないといけない。あと24時間だが、大丈夫だろうか？　話の途中で咳き込んで、中断してしまった講演会を一度だけ体験したことがある。あれは哀しい。予定変更するなら本日中だ。慎重に判断したい。

■余談：
「Dreamweaver 8アイディアノート」も声が出るようになったら一気に収録する予定である。あくまで同人誌扱いなので、同人対象のシステムを紹介してもらったが（当然ながら）コミック、ゲーム、アニメの作品がほとんど。この中に”Dreamweaver 8”か‥
これはもう少額決済システムの利用と割り切った方がよい。そもそも、プロ用のソフトを動かしながら雑談する”アイディアノート”なるジャンルは存在しないのだ。

■2007年にスタートする講座：
「ブラックボックスデザイン」で取り上げている「トラック機能付きアプリケーションソフト」だが、課題案が出揃ってきた。
Webプロデューサー論のカリキュラムにも入っている「キャリーオーバー」を追加するかどうか。「いくつかの問いに答えさせることで、ある種の先入観を学習させ、最終的な選択に影響をあたえる」というのは、Webページの誘導デザインとしては初歩だが、forced choiceと絡めると少々難しくなってくる。時間をかけて整理していこう。

■ブラックボックスデザイン講座の課題案：
「広告モデルとアプリケーションソフト」

●バージョン化について
・通常版は18,000円
・トラック版は無料
・トラック版はツールバーに広告が表示される
・トラック版はアプリケーションソフトのユーザーをトラッキングする（どのツールをどのくらいの頻度で使うか等、個人情報として収集する）
・ネットに常時接続されていなくてもソフトは使用可能、但しアラートが定期的に表示される
・トラックされたくないユーザーは有料版を選択しなくてはならない

・トラック版はツールごとに自動アップデート機能が働く
・有料版はユーザーが自分でアップデートしなくてはならない

●ユーザー反応について議論する
・選択肢がない場合、不買運動につながるか？
・有料版という選択肢があってもforced choice（強制的選択）だった場合、ユーザーに受け入れられるか？

「情報デザインA」のアーカイブ

以下は、夏期にテスト配信されたものです（過去の”記録”としてご覧になってください）。講義内容は反省会を経て、すでに更新（リライト）されています。これから配信される同内容の講義はバージョンアップ版になります。

■課題：
ブラウザという「商品」について考えてみましょう
映像（一部）「ブラウザが持っているスタイルシートって？」7分］2005.8.15

■課題：
ブラウザのデフォルトCSSをどこまで上書きしていいのか話し合ってください
映像（一部）「デフォルトスタイルシートを上書きしてみる」10分］2005.8.16

■課題：
ユーザースタイルシートで企業サイトなどをカスタマイズする是非について話し合ってください 映像（一部）「ユーザースタイルシートが一番強い！」］2005.8.18

※ビデオではなくFlashムービーです
※音声あり

高校生のための情報デザイン講座A

12月27日（火）今日も晴れ（関東は晴れが続く）

昨夜の「情報デザイン講座」、編集中である。なぜ編集しなければならないか？　背景に音楽が流れていたからである。そういう場所だったのでしかたないのだが。インターネットで公開することができないのでカットするわけだが、これが意外に大変な作業で困っている。次回は注意しよう。
とにかく「編集」の作業が入ってしまうと、（時間やコスト等の問題で）講座運営ができないのだ。「権利処理」についてはもっと神経質になった方がよいかもしれない。
（スポーツのDVDを見ると、よくわかる。選手入場などの音楽が変更されている場合がある。観客の歓声が不自然だったりする‥）

高校生に対して「これからはCSSでデザインしよう」といった話はズレていたようだ。彼らは、最初からCSSを書き換えながらデザインしているので、テーブルデザインもCSSも関係ない。カスタマイズできる無料のブログサービスが普及していることも影響していた。バージョン4のブラウザなど使ったこともない世代だから、IE 5.xのボックスモデル対策くらいしか考えていない。ブラウザごとの多少の差異も受容しているあたり、最初からWebスタンダード的。

彼らは17歳くらい。大学に進学して社会に出るまで5年ある。ある高校生に「まだWebデザイナーという職業はありますか？」と質問される。「心配しなくていいよ」と言っておく。5年後、2010年か‥。ここ1、2年だけ見てもWebのトレンドが多すぎて、5年先など予想できない。

「高校生のための情報デザイン」のページに講座の音声データを公開準備中である。（尚、クローズドネットを窓口にした実証実験を兼ねているので詳細な情報は非公開となっている）。

ネットラジオ講座「Flash 8 オンラインセミナーA」

■特別講座のお知らせ：
Flash 講座A
（Aは一般の初心者向け講座）

今月下旬、common style -ネットラジオ講座の特別講座をおこないます（学習コンテンツは動画仕様となります）。動画仕様というのは、「音声」だけでは教授できないタイプの学習に用いる簡易動画です。今回はFlashムービー（SWF）で配信いたします。

●解説ムービーのサンプル
※サンプルに音声は入っていません
※ムービーサイズは、可読性を高めるため大画面仕様（960x720）になっています。1,024x768 のディスプレイで閲覧する場合はブラウザを全面表示にしてください
※このサンプルは来月中旬に発売されるFlash本に収録されているものです（セミナーのサンプルではありません）

●公開情報
・オープンネットで公開しますので、どなたでも閲覧できます。URLはネットラジオ講座の準備ページです
・セミナー日は今月下旬（只今調整中）
・書籍と連動したセミナーは1月下旬頃になります

●講師
monkeyish studio

●補足
講座ではバージョン8を使用します。FLASH Basic 8でこれから学習する初心者をメインターゲットにしています。プロ版も多少解説します（あまり期待していなかったカスタムイージングですが、かなり使える機能でした。但し、使い方にコツがありますね‥）。

ネットラジオ講座の配信予定

スケジュール：
12月19日〜／ネットラジオ講座1を順次配信
12月26日〜／ネットラジオ講座2（一部映像）を配信

■ネットラジオ講座1
［Cのちから］高校生のためのデジタル編集工学（Web CSS概論）
［フラッシュアニメ講座］映像表現A（Flash 8 使用）

■ネットラジオ講座2
［ブラックボックスデザイン（仮称）］高校生のための情報デザイン

■ネットラジオ講座3
［セマンティックス］Dreamweaver 8 CSSワークフロー講座

●公開場所：
インターネット
・クローズドネット（非公開）
・オープンネット（common style : http://admn.net/）
・ルームコミュニティ（非公開）
実演
・セミナー（日程はここで告知）

※以下はブログに掲載した抜粋記事です

・ブラックボックスデザイン［1］
・ブラックボックスデザイン［2］
・ブラックボックスデザイン［3］
・ブラックボックスデザイン［4］
・ブラックボックスデザイン［4］補足
・フラッシュアニメ講座[1]
・ストーリーメイキング［1］

ブラックボックスデザイン［4］補足

ネットラジオ講座、第4回の補足です（12/4再録）。
家庭にあるSTBや博物館などのキオスクなど、PCの「専用機化」は様々です。OSを利用者に見せない（操作させない）「専用機化」では、人によるメンテナンスができませんからハードディスクの自動修復機能なども搭載されています。
弱い専用機化の事例を紹介しておきます（古い事例ですが参考になります）。

●事例：PCの「弱い」専用機化
Apple社のAt Ease
Macのデスクトップ（MacOS）を隠し、利用者別に適したインターフェイスを提供するソフトウェア

Apple［At Ease 3.0 ワークグループ用］
Apple［At Ease 3.0 Basic版］
※アーカイブの情報です
※現在は発売されていない製品です

「At Ease」のコンセプトに関しては音声雑記でも話します（週末になります‥）。

ブラックボックスデザイン［4］

common style　ネットラジオ講座
高校生向け特別講座「ビヘイビア・トラッキング(仮称)」
［15:00 × 4 ／MP3］
※音声はcommon style Aからダウンロードしてください
※一般公開はcommon style B［http://admn.net/］です（準備中）

※講師（境）、本日多忙のため音声配信は週末となります

■課題：
夢の箱「Dream box」を作ろう！
〜PCを専用機化するトレーニング

●専用機化の参考：
「受験マーケットと電子辞書」

図書館の二階に上がると学生（中学生、高校生）で大混雑。皆さん、黙々と勉強している。テーブルの上にはノートに参考書、そして「電子辞書」が置かれている。「電子辞書」は受験生にとって欠くことのできない必需品になっている。
最近の「電子辞書」には、英語、国語、日本史、世界史などの受験対策用コンテンツも含まれている（2006年からセンター試験に組み込まれるリスニング試験対策コンテンツも搭載）。

CASO 受験対策コンテンツ搭載-電子辞書「XD-LP4700」
（家電量販店などの実勢価格36,800円くらい）

●材料：
低価格、高機能のPCを「専用機化」する

Apple「Mac mini」
（税込み58,800円）

※［プロトタイプ］［設置］［宣伝］［効果測定］はシミュレーション学習です

［発想］
・ターゲットとマーケットを決める
・ニーズを探る
・イメージスケッチ

［プロトタイプ］
・PCのOSをブラックボックスにする
・リモコンに（厳選した）OSのコマンドを登録

［調査と再考］
・フィールドワーク
・駅の券売機、銀行のATM、自販機などを取材（※銀行では許可確認）
・インターフェイスをデザイン
・リモコンに登録するコマンドを再検討する

［設置］
・設置場所を決める（カフェ、ショップ、公共施設など）
・設置の手順をデザインする
・期間、回収のスケジュールを決める
・提案書の作成
・プレゼンテーション

［宣伝］
・ブランドキャラクターをデザインする
・キャッチコピーを決める
・専用ブログを公開する（準備日記の更新）
・ステッカーやストラップなどの配布用グッズを依頼
・イベントを企画する（グッズ配布）

［効果測定］
・オペレーションのログ解析
・アンケート集計
・総括
・報告書の作成

ブラックボックスデザイン［3］

common style　ネットラジオ講座
高校生向け特別講座「ビヘイビア・トラッキング(仮称)」
［15:00／MP3］
※講師（境）、本日多忙のため音声配信は週末となります

課題：
皆さんは「Webプロデューサー」として「パソコンを使わないネットユーザー」を対象とする大きなプロジェクトに参加します。これからのWebサービスを考えていきましょう。
「テクノロジー」と「社会」と「デザイン」をバランスよく見ながらロールプレイングしていきます。

●現状
ビジネスホテルの宿泊予約の事例を振り返ります

・携帯電話（通話）で予約すると
　一泊シングル「5,000円」
・携帯電話（ネット）で予約すると
　一泊シングル「3,800円」

フロントに電話して予約すると「人」が対応しなくてはなりません。ネットで予約すれば、このプロセスが省かれるため安く提供することが可能になります。ネットを使えば「安くなる」「早くなる」といったサービスが急増していることも確認できたと思います。

日経新聞の「住宅ローン、ネット経由なら金利優遇」は確認したでしょうか？
逃した人は、銀行のサイトを見てください（NIKKEI NETにはダイジェストしか掲載されていません）。

ポイント：
・ネットで住宅ローンを申し込むと借入期間中の金利を通常より1%優遇（りそな銀行）
・ネット取引口座を開けば住宅ローン金利を1.5%優遇（住友信託銀行）

※利便性の視点だけで見るのは少々問題（ネットサービスを提供する企業の「思惑」が抜けています）ありますが、今回は絞っていきましょう

●想定外だったネットユーザー
パソコンを必要と感じていなかった人たちが「ネットサービス」に注目しています。これは家族など身近な人たちがネットを利用し始め、具体的な情報が伝わってきたからです。
「不利益を被りたくない」という意識については議論しましたが、今日はさらに進めていきましょう。

・パソコンを必要と感じていない人たち（高齢者含む）の意識の変化
・身近な人からの情報（具体性、説得力）
・「ネットを使いたい」と思っている（意識の変化）
・パソコン利用が想像以上に大きな障害になっている（教育コストやかかる時間の問題）

●アイディアソース
・オープンネット（インターネット）に蓄積されている情報を「編成」してデジタルテレビで閲覧できる仕組み
・テレビやラジオ、新聞、週刊誌のようにプロが編成、編集したものだけで十分と思っている人について
・インターネットにダイレクトアクセスしなくても「不利益を被らない」ネットサービス
・ボタンを排除し、シンプル化されたテレビリモコンとテレビブラウザ用のスクリーンデザイン
・情報構造と見栄え（デザイン）を分離する重要性
・デジタルテレビのネットラーニング（ユーザー教育）とコミュニティ接続

■おまけ
興味のある人は聴いてください。
※こちらは音声雑記で配信

・セットトップボックスの利権争い（米国）
・12月1日からスタートした世界初の携帯向け地上デジタル放送（韓国）
・世界のデジタルテレビとWebデザインBバージョン

フラッシュアニメ講座[1]

common style　ネットラジオ講座
高校生向け特別講座「フラッシュアニメ(仮称)」
［15:00／MP3］
※音声はcommon style Aからダウンロードしてください
※一般公開はcommon style B［http://admn.net/］です（まだ準備中です）

・パラパラアニメを作ろう（道具：小さなメモ帳とボールペン）
・コマ撮りに挑戦（道具：デジタルカメラと紙コップ）
・Flashで作るアニメの特徴を理解する
・ストーリーアニメーションの制作「はじめに」
・講座「ストーリーメイキング」と連動した学習

教科書：「FLASHキャラクターアニメーション」
※書店でご確認ください

アニメーションメイキング：
「Serendipiter」

[絵コンテムービー（スケッチとラフムービーのテスト版）を見る]
・これは「動くイメージボード」として活用されるミーティングバージョンです
・再生には最新のFlash Playerが必要です
・音声が流れますのでご注意ください
・ブロードバンド用のFlashムービーです

common style について

ネットラジオ講座の窓口となっている「common style」サイト、現在更新中。オープンネットとクローズドネットを行き来しながら構築する新しい運営スタイルで進めているため、12月までは毎日内容が書き換わる（ご了承ください‥）。

通常はWebサイトを作り込んでから公開するのだが、「common style」に関してはコミュニティベース、検索ベースのWeb活用を目指している。Webページさえ情報のトリガーでしかないという考え方である。
手続きのページだけあって、あとはダイレクトにコンテンツをダウンロードしてもらう「サイトは構築せず、緩やかに束ねたWebページが点在しているような」イメージで捉えている。
このコンセプトに関しては来週配信する「音声コラム」で説明したいと思う（音声雑記では裏コンセプトを語ります）。