プレゼンテーション「ワイドスクリーンで変わる」

第一部；
ワイドスクリーンで変わる［パソコン編］

パソコン教室を訪問したときのヒアリング結果を中心に「ワイドスクリーンで変わるデザイン」について話します

• 年配の生徒さんが大半
• ノートパソコンより大型ディスプレイ付きデスクトップパソコンを購入している人が多い
• UXGA（1600x1200ピクセル）の所有者もいる
• 文字が小さくて読みにくいためWebブラウザを画面いっぱいに広げて、ページズームで拡大している
• ページズームは125%もしくは150%をデフォルトにしている
• 文字だけを大きくする「テキストズーム」はメニューの中にあるため使われない。※つまり、容易に使用できるページズームはforced-choice（強制的選択）になっている
• Webブラウザは「IE 7」ただ一つという認識（すでに全員、Windows Vista。というのは今年からパソコンを使う初心者ばかりなので）
• ディスプレイが大きいためキーボードとの距離が広い

第二部；
ワイドスクリーンで変わる［テレビ編］

「タンジブル・ユーザインターフェイスは家具、家電から始まる？」をテーマに話します（最後に「？」が付いていますので、このテーマはプロレス的です。NGNと同様、重要なアングルがありますので楽しんでください）。
過去の参考；テーブルがワイドスクリーンになる〜内田洋行

• 生まれて初めてマウスを使う人（GUIを使う人）
• 生まれて初めてTUI（タンジブル・ユーザインターフェイス）を使う人
• まだパソコンを触ったことがない人にGUIとTUIを使ってもらう実験

参考（絶妙のタイミングで発表がありました）；
Microsoft Surface
YouTube「Microsoft "Surface" - Demo by CNET video」

参考；
NTTコムウェア | タンジブル災害総合シナリオシミュレータ

勉強会：デザイナーのための情報デザイン

本日夜の予定です。過去、取り上げたテーマをまとめたいと思います。尚、資料はiPod用とPSP用をアップしていますので、ダウンロードして講義中に参照してください。

テーマ１：
マス・マニピュレーション「大衆操作」

テーマ２：
デザイナーが安易に「ステルス・マーケティング」を行わないための体験実習

テーマ３：
エア・デザイン（空気の流れによる誘導デザイン）

あと、現在執筆中の「Experience Design　エクスペリエンスデザイン〜新たな体験への誘い　- アーキテクトとデザイナーの狭間で -」で扱っている話題もお話します。

NGNとインターネットは何が違う

NGNに関してのメールをいただきましたので、「WBB Forum」をご紹介しておきます。以下、大まかなイメージを得るための参考になります。

FMCフォーラム開催「NGN成功の鍵はオープン化」で意見が一致！
インターネットとNGN、競合か共存か
2006.11

NGNの標準化動向 (1)
実に130年ぶりのイノベーション(技術革新)
2006.7

【集中連載】　次世代インターネットを探る
第1回「インターネットに“次”はあるのか？」
2007.5［IPv6style］

※尚、記事に関してはさまざまな視点からクリティカルに「読み解く」ことをお奨めします

余談：
音声雑記「NGNとインターネットで奪い合う人材

お知らせ：ユーザーエクスペリエンスデザイン勉強会（2）

教育デザイナー向けユーザーエクスペリエンスデザインの勉強会を開催します。10数名程度の小規模なものを予定しています（今回は新しい技術の活用についての話が中心になります）。時期は7月。

ユーザーの消費行動をトラッキング（追跡）して得られる個人情報を詳細化していく技術が想像以上に進んでいます。カードやケータイで交通機関を利用したり、商品を購入する人が増えており、顧客のトラックレコード管理も高度化しつつあります。Webアプリケーションによるサービスはさらに巧みになってきました。
これらはユーザーの利便性を向上させるための仕組みですが、識者によるプライバシー問題の議論も活発です。また、個人の「My Page」によって情報収集活動が低下する研究報告（自分に必要な高精度な情報が毎日提供されるようになると、自ら検索して情報収集しなくなる）についても注視していく必要があります。
今回の勉強会は、ユーザーとのインタラクションを拡張するために新しい技術をどのように活用していくか考えていきます。

業務連絡：勉強会については本日の会議で詳しく説明します

オンラインマガジンのデモンストレーション概要：
「編集デザイナー、Webデザイナー、3DCGデザイナーの協業モデル／次世代の雑誌メディアにおける読者とのインタラクションを考える」

• ページに配置されているグラフィックおよび写真画像に3次元の情報を持たせる
• ページを閲覧している人は、それが2Dか3Dなのかはまったくわからない（あくまで静止画として認知させる）
• ファッション誌の女性モデルが着る商品は、読者のトラックレコードによって決まる
• 掲載される写真は1しかなく、写真の中の女性モデルはリアルタイムで対象読者の嗜好する商品に着替える
• 女性モデルは3DCGで表現されるが高度な画像処理によって「実写」化する

このデモのポイントは、3DCGの技術を表に出さないことです。読者にはグラフィックや写真として提供します。3DCG技術のブラックボックス化が肝です。

参考：
ラッセル・ブラウン氏によるAdobe Photoshop CS3 ExtendedとDAZ Studioのモデルを使ったデモンストレーション

The Russell Brown Show
Adobe Photoshop CS3 Extended Edition Tutorials
CS3 Extended: Russell Brown and the Argonauts Presents - 3D Image Composition Techniques

Adobe Photoshop CS3 Extendedが対応しているフォーマット

• U3D［PDF 3D format］
• KMZ［Google Earth 4］
• 3DS［3D Studio format］
• OBJ［Wavefront file format］
• DAE［Collada］

今夜の意見交換会「WPFとApollo」

テーマ：
Apolloで「iTunes」ライクな学校向け専用クライアントを作ろう！

※今回はロールプレイングです。私は、Microsoft社とAdobe社のエバンジェリストを演じ分けます。諸々、はっきり言い切りますが演技ですからご了承を。

• Adobeのデモ「ebay専用クライアント」を参考にする
• iTunesのUIを検証する
• OSに標準搭載されているユニバーサル機能（画面の拡大表示、音声読み上げ、キーボード操作など）を制御してアクセシブルなアプリケーションにする
• ディスプレイやウィンドウ可変に対応したレイアウトモデルを採用（テキストだけではなく写真などの画像の大きさも自動調整される「Times Reader」のような視認性向上モデル）
• 紙（PDFフォームとのデータ連動）との融合

• WPF（Microsoft）とApollo（Adobe）の脱ブラウザ戦略について
• 粗製乱造の時期を待つ
• Web制作会社に新事業部
• 今のうちにデベロッパーとデザイナーを集めてドリームチームをつくる
• WPFチームとApolloチームの情報共有が最重要となる
• 今のうちに海外武者修行（短期留学でデザイナーにUI理論を徹底的に勉強してもらう）
• 制作会社の引き抜き合戦はいつ始まる？

• デスクトップアプリケーションでOSを隠すのはなぜ？
• シンプルインターフェイスの難しさ
• 図書館で活用
• 学校で活用
• 病院で活用
• ビジネスホテルで活用

意見交換会「Webのガイドライン作り」

体調のアップダウンに翻弄されてますが、夜の意見交換は予定とおりです。

中小企業向けガイドライン作りの復習キーワードを記しておきます。

• Webはラフコンセンサスな世界
• 一律に誰もが合意するようなものではない
• 指針やルールの線引きは恣意的である

［word］恣意的：
その時々の思いつきで物事を判断するさま。
「—な解釈」

［research］実証実験：
2004年以降に発行されたWeb専門誌をすべて調査、Webの技法や概念の移り変わりを列挙。

参照「事例：2006年に流行したCSS関連のテクニック-Aが、現在では使用が推奨されない理由」
参照「なぜ、CSSハックの書籍は出版しにくいのか？　流行に関しては雑誌媒体が適している」

• 恣意的だからこそ、さまざまな人の意見を聞く
• 恣意的だからこそ、常に議論が必要

最重要課題：

• ルールブックおよびプランブック採用による業務推進のポイント
• ルールのアップデート体制（ルールは常に更新される）
• バージョン管理の体制（どのルールが最新なのか、社内で共有できる仕組み）

不易流行：

• 日々移り変わるもの
• いつの時代でも変わらないこと

Webデザインのルール化 - 奮闘記2006 -2

The Rule より抜粋
第2章　機能設計から生まれるWebデザイン

［拡大表示］

［拡大表示］

参考：奮闘記2006 -1

夜の勉強会

遅刻します‥

テーマ：「サービスキットについて」
シリーズ：仕事が変わる（3）v+CMSで変わるWebデザイン

• チームで考えるWebデザインのモジュール（合宿の事例）
• バージョン管理とルールの更新手続き
• サービスキットを配布して社内で共有しよう
• 品質向上のためのモジュール化

Webデザインのルール化 - 奮闘記2006

賞味期限が切れたので、某プロジェクトのメモを不定期に掲載していきます
書籍「The Rule」はまだ執筆中です‥

---

アーカイブ（1）

今年（2006年）は「ルール化・モジュール化・ワークフローの改善」にどっぷり浸かった年であった。Web業界の人間ではないにもかかわらず、業務の骨幹といえるワークフローを解体するという責任重大なお手伝いをさせていただいた。この経験は「The Rule」という本のなかで反映したいと思っている。

FrontPageを使っているデザイナーとDreamweaverを使うデザイナーが同じテーブルについて、Webデザインのガイドラインを決めていく際、肝となったのが「ルール化」であった。300ページ以上の「ルールブック」とモジュールのバリエーションを掲載した「プランブック」によって、クライアントに対する説明コストが抑えられ、作業途中で修正が入るという手戻りも大幅に減少した。
この経験は、書籍「CSSビジュアルデザイン・メソッド」（毎日コミュニケーションズ）、「Webデザイン・ルールメイキング」（ソーテック社）、「The Rule ”ルール”」（xxx）に記していきたい。

プロジェクトでおこなった10日間戦争の抜粋を以下に記します。小規模なプロジェクトなので、随所に無駄があります。ただ、低予算でもある程度の成果を得られたので「成功事例」と書いておきます（かなり消極的に‥）。

実践したルール化の手順（抜粋）：

1. W3Cの（HTMLおよびCSSに関する）TRをほぼ全てプリントアウトする
2. ドキュメントを読み込む
3. 採用するHTMLの要素を決める
4. 必要と思われるセレクタの名前を列挙してリストを作成する
5. 採用するCSSのプロパティを決める
6. 記述するプロパティの順序を決める
7. 使用するアプリケーションソフトの環境設定を変更する（ソフトの各機能を記述ルールにあわせる）
8. プロトタイプを作成する
9. バリデータでチェックする
10. Firefox、Opera、Safari、IE 7（ベータ版）でプレビューする
11. バグや解釈の違いを確認する
12. ルールを決定する
13. アクセシビリティガイドラインを読み込む
14. 優先する項目を列挙してリストを作成する
15. リストに沿ってプロトタイプを作成する
16. バリデータでチェックする
17. ホームページリーダーでボイスプレビューする
18. 問題を修正する
19. ルールを更新する
20. IE 5、5.5、6 およびMac版IE 5でプレビューする
21. バグや解釈の違いを確認する
22. デザイナーの評価が高いWebサイトのソースを検証してブラウザ対策の傾向を知る
23. 安定した対策方法（CSSハックなど）を列挙する
24. 条件付コメントとの組み合せでローカルルールを決める
25. IE 5、5.5、6 およびMac版IE 5でプレビューして確認する
26. ルールを更新する
27. 使用するアプリケーションソフトの環境設定を変更する（CSSハックと条件付コメントのローカルルールを取り込む）
28. ルールブックを印刷して各チームに配布する（オンライン版のURLを公開する）
29. Web Designing、web creatorの2005年11月からのバックナンバーをすべて購入する
30. 大藤幹氏、益子貴寛氏などのCSS関連の書籍を購入する
31. 雑誌と書籍を分解して概論、技法、裏技などに分ける
32. 分類したページを箱に入れ、番号をつける
33. ルールブックのアップデート可能な部分に番号を記載していく
34. ルールを更新する
35. 著作権フリーの素材集を購入する
36. Webサイトのカテゴリを12に絞り、プロトタイプを作成する
37. サイトのStructure（構造）を示す図をどのように描くか検討する
38. サイトのDesign Guideline（ガイドライン）を示す図をどのように描くか検討する
39. 描画ルールを決定する
40. プランブックの仕様を決める
41. 各ルールのアイコンをデザインする
42. ルールのヘッドラインを書く
43. カテゴリ12のプロトタイプWebページをバリデータでチェックする
44. ホームページリーダーでボイスプレビューする
45. Firefox、Opera、Safari、IE 7（ベータ版）でプレビューする
46. IE 5、5.5、6 およびMac版IE 5でプレビューする
47. プランブックを作成する
48. プランブックを印刷して各チームに配布する
49. クライアント向けのプランブックを編集する
50. 発注先のデザイナーを対象にルールブックとプランブックの使い方、勉強会を開催する
51. クライアントを対象に説明会を開催する
52. ルールブック更新手続きを決める
53. クローズドネットもしくはSNSにコミュニティを立ち上げる
54. 海外のWebデザイン関連の情報を翻訳してもらい定期的にアップしてもらう
55. 楽しんで仕事をするため「余裕が持てる」ように意識を高める

このプロジェクトでは、Web標準の導入やCSSデザインへの移行といった目標を持たず、最悪（必要であれば）部分的な物理マークアップ、たとえばtable要素による固定レイアウトなども許容する覚悟であった。ところが、DreamweaverやFrontPage、ホームページビルダーなどが混在する恐ろしい協業だったので、一度すべてをリセットするしかなかったのである。W3CのTRをプリントアウトすることから始まり、ルールブックとプランブックが出来上がる頃には、いわゆる「Web標準」的なものになっていた。逆の見方をすれば、時間をかけて準備をしないと標準化を導入するメリットは十分に得られないのかもしれない。スキルの高い人たちが集まっていれば、最初から共通のリソースが豊富なので問題ないが、アプリケーションソフトに99%依存するチームにおいて無計画の標準化導入はうまくいかないようだ。各人の自己学習の努力にかかってしまうと、足並みが揃わない。

プロジェクト2006の概要：

現状把握：

• Web業界の裾野の広さ
• ホームページビルダーの業界普及率
• 中小企業、自治体のWebサイトもホームページビルダー
• Dreamweaver MX 健在

要望：

• クライアントからの要求に変化
• ワークフローを改善したい

実利判断：

• デザイナーの教育コスト（困難）
• 教育時間の確保（困難／休日は可）
• アプリケーションのバージョンアップ（段階的なら可）

体制：
4つの制作会社の協業（使っているアプリケーションソフトがまったく異なる。ハンドコーディングできるデザイナーは少ない）

• プロダクションA：Dreamweaver 8
• プロダクションB：Dreamweaver MX、MX2004
• プロダクションC：ホームページビルダー10
• プロダクションD：FrontPage 2003（変更：Expression Web）

ミッション：

• クライアントの要求に応えられる体制とスキルをつける
• 採用するアプリケーションの種類に影響されないワークフローをデザインする
• A、B、C、D社で共有するためのルールを決める

参考：
アセット管理で実現する「Web Magazine - Designing」
Web本の執筆メモ

教育デザイナー勉強会

本日夜の勉強会、3つのテーマで話します。ダークサイドな話題を含みます。どんなことにも必ず「表と裏」があり、まずは全体を俯瞰することで本来やるべきことがわかってくると思います。前に取り上げた「スピード違反」と「パチンコ」の例に近いものですが、今日はワールドワイドにテーマを広げます。
※すみません‥先週末からの設備トラブルで資料などの準備出来ていません。ホワイトボード使わせてください‥

テーマ１：調和

世の中の矛盾とは
どんなに素晴らしい技術でも国際標準にはならない
技術を応用できない国が出てくると優劣が決まる（それはよくない？）
国際標準を狙うためは妥協しなければならない
国際標準のために妥協しないぞ！という技術者は独自規格で勝負
世界のバランス
個人のエチケット、国家のプロトコル

テーマ２：ラフコンセンサス

HTMLって国際標準なの？
HTMLの扱いやすさを重視する人たち
HTMLの機能をアップさせたい人たち
意見の対立、落とし所
手打ちで決まった標準化の事例
情熱、沽券（こけん）、プライド

テーマ３：モノを売る手助け

デザイナーとは？
グラフィックデザイナーは誇大広告をどう見ている
消費者のため、クライアントのため、自分の生活のため
自分の信念を正当化する「合理化」の心理
訪問販売のイメージ、商業デザイナーのイメージ
企業の商品を売る、企業の商品を宣伝する
アートと商業デザインの境界線
商業デザインにおける「アート」の役割はオブラート
エゴの効用

勉強会「Robot Therapy」

明日の勉強会のテーマは「Robot Therapy（ロボットセラピー）」です。奥深く、かなり難しいテーマですが、資料を読み込みながら意見交換していきましょう。
以下、参考記事を見ておいてください。

• なぜ動物ではなくロボットなのか？
• 否定意見と代案
• ロボットと違和感について
• 人間とのインタラクションを考える
• バーチャルリアリティとの違いは？
• 海外での事例
• 衛生性、安全性、信頼性、耐久性、メンテナンス

2006年5月22日
「パロ」、ヨーロッパでドキュメンタリー映画に
産総研　知能システム研究部門

参考：
アザラシ型メンタルコミットロボットPARO（動画）

2006年10月6日
ロボット用ミドルウエアの国際標準仕様原案を国際標準化団体OMGが採択
独立行政法人 産業技術総合研究所（産総研）

行動追跡とドラマの構築

本日夜からの勉強会、よろしくお願い致します
私のテーマは「ドラマの構築／ヒューマントラック」

10年前、MITを訪問した際、「ボールペンサイズの入れ物に一生分の音楽や”ドラマ”などを入れて持ち歩くようになる」と言われ‥ずっと気にかけていたが、現在それが実現されている。さて、10年後はどうか？

参考：
「iPod の活用方法「ドラマを身につける」について」

ぜんぜん関係ありませんが、history check GIFをさらに発展させた「history check Video」を作りましたので本日（ついでに‥）公開します。手作業でおこなわれるCSSの作業（ハンドコーディング→プレビューの繰り返し）を立体的に見せるものです。
以下は過去の記録。

アーカイブ（2005年）：
history check GIF gallery 2005
ヒストリーチェックGIF・ギャラリー
〜CSSデザインの軌跡を楽しむアート展覧会

history check GIFは、CSSデザインの検証用に活用されていたもの。実際はアニメーションにはなっておらず、構造フローチャートからリンクされる静止画の集まりであった。アニメーション化されたhistory check GIFというのは「見ていて、なんとなく面白い」ということで、作られるようになった。鑑賞目的なのでアート作品に近い。

既存ワークフローにExpression Web を導入

取材メモ：
本当はPodcastしたかったのですが、当然ながらNGなので‥1つだけ、こちらにメモしておきます。
（※日々の目標「試す」の実践）

導入キーワード：
・Windows Vista 環境のExpression Web
・SharePoint Designer 2007と Expression Web

・「Expression Web vs Dreamweaver」ではなく「Expression Web + Dreamweaver」
・モジュールとテンプレート開発
・重要なのはコンポーネントアーキテクチャ
・テンプレートの共有
・バージョン管理
・外部発注は、Dreamweaver を使うデザイナーが対象となる
・制作現場ではWindows XPでもMac OS Xでも問題ない

参考：カスタムスタイルシート

共有化の一例：

WebデザイナーとCMSマネジメント［2］

以下、勉強会で省きましたが海外での事例が急に増えてきましたので3月くらいにメインテーマとして設定し、意見交換したいと思います。
尚、小テーマ「WebデザイナーとCMS」に関しては来月発売の雑誌で書きましたので、ご覧になってください（発売後お知らせいたします）。

次回の勉強会テーマ：

POINT：CMSのビジュアルエディター
RapidWeaverなどは単体のWebツールとして使用されず、システム組み込みのビジュアルエディターとして機能させるケースが増えてきた。
昨年実施した「CMS+RapidWeaver」による商店街のネットモール運営・実証実験で得られたデータを照らし合わせると、「モジュール化」「ブラックボックス化」によるラーニング・アウトソースの効果が非常に大きいことがわかる。また、商店街などの多サイト運営の場合、コミュニティ・ロックインが働くため「CMSを活用することの価値（集団に属する）」が高まる傾向にある。

POINT：Web制作会社
なぜ、CMSの事業部を設けるWeb制作会社が増えているのか取材。
Web制作会社は、（新しいタイプの）CMSを扱うために非常に厳格なデザイン・ルールを決め、洗練されたワークフローを構築している。これらの作業は1年後、2年後への投資であり、デザイナーを育成するための社内標準化にもつなげようとしている。
また、ECMやWCMのマーケットでは競合せず、むしろ（売り込みでは）ブログ系と重なる。

POINT：ブログのビジュアルエディター
RapidWeaverなどの（W3C準拠の）ビジュアルエディターは、CMSに組み込まれるだけではなく「ブログサービスのビジュアルエディター」として標準搭載される可能性がある。ビジュアルエディターによる生活機能の提供は、利用者のサンクコストに対して良好なブランドを打ち出すことができる（マニアックにならないよう、あくまで生活機能に特化することが条件）。

参考1：
キノトロープのノウハウをCMSに生かす
「Three Int CMS」株式会社スリーイント／株式会社キノトロープ

参考2：
「iSell version 3.0」

iSell 3.0 offers e-store owners the ability to sell physical or downloadable products and interfaces with the most popular payment gateways. The most requested addition to this new version is the ability to utilize themes designed for the popular web design app, RapidWeaver. With the click of a button, the store admin can easily install and utilize a number of professional looking templates.

WebデザイナーとCMSマネジメント

以下の小テーマは、雑誌の記事になりますので省きます。本日はユビキタスコンピューティングに絞ってお話します。

今月発売の（「2007年市場予測」などの特集がある）ビジネス誌はたくさん買っておきましょう。記事内容はさておき、掲載されているデータが役立ちます。お奨めは前にお知らせした20誌ほど。2万円以上かかってしまいますが、重要な資料になりますので。

以下はカットします

小テーマ（２）：
「WebデザイナーとCMSマネジメント」

・WebデザインよりもCMSの収益の方が大きい理由は？
・なぜ、「CMSの設置」依頼が急増しているのか？
・この状況はいつまで続くのか
・中小企業に人気のあるCMS
・政治家に人気のあるCMS
・タレント／文化人に人気のあるCMS
・なぜ？　ブログ間借りからCMS運営へ
・なぜ？ XOOPS

・サイトクレジット「CMS：xxx／Design：xxx」は何を意味する
・完全デザイン分離と専門会社の裏事情
・要求される「モジュールコーディネイト」のセンスとは？
・急増するCMS関連の仕事はWebデザイナーの仕事？

・曖昧になってきたWebデザイナーの仕事
・一から作り込むWebデザインだけではやっていけない？？
・重要なキーワードになってきた「モジュール化」

・エネルギーの配分
・どの作業に時間をかけるべき？
・趣味、研究のWebデザインと明確な線引きが進む
・役割分担論とCMS

・WebデザイナーとCMS（総論）
・より重要になる情報デザイン構築、UIポリシー
・デザイナーの教育を再定義

ブラックボックスデザイン講座

明日の夜です
よろしくお願い致します

参考（過去記録）：
design zero - PSP web 2006/5/11

2007年の中目標、小目標、日々の目標

●謹賀新年

●2007年の目標：

［file-208］
街とローカル・ルール（14:15/MP3）

［file-207］
資本の原点「体」を意識する（16:03/MP3）

［file-206］
2007年はデザイナー育成に取り組む（14:31/MP3）

●年賀メール：
40%程度、送信‥

勉強会「ワークフローを作ろう！」

勉強会テーマ：

• CMSとビジュアルエディター

コンセプト：

• ビジネスブログのもう一つの方向性

今回の要点：

• 中小企業を対象
• HTML、CSS、PHPを完全ブラックボックス化
• パブリッシュされるドキュメントはW3C 準拠
• 関連ツールはすべて安価（でもパワフル）
• 実績、導入成功事例があること

意見交換のポイント：

設定：
ソフトウェアはCMS+オーサリングエンジンで2〜4万円程度。コンストラクションキットの販売が収益となる。コンストラクションキットの費用には、ビジュアルデザイン、UA閲覧保証、構造化モジュール（XHTMLなど）、CSSモジュールが含まれる。

市場の創出：
ビジネスブログのサービスが競合ではなく、あくまで開発ツールがターゲット（コンストラクションキット作成のための開発ツールが新事業となる。つまり収益の二重構造）。

［拡大表示］

デザイナーのための情報デザイン

勉強会：
今回は高校生向けの内容をデザイナー対象としておこないます

テーマ：
マス・マニピュレーション「大衆操作」
※何度もやってますので、かなり重複します

・衝動買いの仕組み
・「必要のないもの」でも買ってしまう心理
・店内の雰囲気と「なんとなく欲しくなるモノ」
・故障することがわかっていても「かっこよさ」で買ってしまう心理（自動車などの高額商品）

・人口比率でみると、テレビコマーシャルは無くならない？（※逆説です、ご注意）
・イメージで利潤を上げている「使いづらいWebサイト」事例
・Webサイトデザインの超裏技「グラフィックデザイン」

・なぜ人気のあるタレントやスポーツ選手を広告に起用すると売上が伸びるのか？
・なぜ売れると「さらに売れるのか？」
・人気のあるWebサイト「ほぼ日刊イトイ新聞」を見てください
・コンテンツを楽しむ人
・情報を探している人
・目的を達成したい人（チケット予約など）
・Webサイトの個性とそこに集まる人たち
・実利的判断（お金、時間）で決まる優先順位［現実］
・［理想］を放棄しない

・人間のことをもっと勉強しよう
・機能、スペックは他社にキャッチアップされるが、イメージ戦略は独自性が（設定期間）持続する

課題：
利便性、使いやすさが「標準化」された後の差別化について考えてみよう。
人間とイメージ情報について考えてみよう

参考：
予備知識として見てください
情報デザイン「effect vol.1」後編（再生時間：19分40秒）
情報デザイン「effect vol.1」前編（再生時間：18分16秒）
※ページにリンクします（ビデオファイルのリンクではありません）
※視聴にはQuickTimeが必要です

勉強会のお知らせ

こちらも延期となりました。後日調整。

テーマ：
デザイナーが安易に「ステルス・マーケティング」を行わないための体験実習

・ユーザーエクスペリエンスと「買い物体験」
・「買い物体験」の少ない人は何が問題になる？
・Webにおける偽装アプローチのリスク
・「集合知」の応用は想像上に高度な作業
・体験者ブログの失敗例
・ネットに上がっていないセールステクニックを知ることで、同質のWebサービスを見抜く
・Webの上級ユーザーは「監視員」

エア・デザイン（空気の流れによる誘導デザイン）

●フィールドワーク
「エア・デザイン体験・買い物体験」
すみません、延期となりました。
多分、12月上旬に（決まり次第お知らせします

テーマ再録：

フロアの入り口からエレベーターまでまっすぐ歩けばよいのに、時間帯によって少しだけ遠回りさせられることがある。矢印の看板によって人の流れが制御されているのだ。
なぜ、こんなことをするのか？

デザイナーはこう言った。
「カーペットの汚れを均一にするため」

「入り口からエレベーターまでのルートが1つだとそこだけ痛むだろ。これが、エア・デザインってやつだ。都会にはたくさんあるぞ。」

「冷房の強弱、風の方向でお客さんの流れをデザインする人もデザイナーって言うんだ。」

・冷房（もしくは暖房）の「不快な風が体に当たる位置」と「混雑する立ち読みの位置」
・不快な店内BGMの加減
・人間工学とイスの硬さ、角度（居心地の悪さと回転率）
・空気の流れで誘導する方法

POINT：
コンビニエンスな社会・サービスは、人からの「注意」を嫌う。店員は立ち読みを注意しないが、空気の流れを制御してお客さんの動きをコントロールする

車を何百台も売るセールスマンがいる。月に一台も売れない人もいる。同じ環境、同じ販促ツールを使って動いているのに、何が違うのだろう？　
訪問販売から店頭販売、そしてネット販売へとビジネスの比重は変化しているが、トップセールスマンはWebというフィールドでも同様に貢献している。販売のプロセスがシステム化されても、顧客からの信頼を獲得している人が多い。訪問販売であっても、Webを活用した販売でも、同じように成果が出せるのはなぜだろう？

ダイレクト・デザインやエア・デザインは、金融業とか清掃業など、一見「デザイン」とは無関係な業界が先行している。

「イメージデザイン」とは対局にある「ダイレクトデザイン」のスーパーデザイナーはセールスの世界に多い。この世界の特長は、情報の共有化が遅れていること、伝達方法が特殊なことなど（例：各家庭の表札やガスメータなどに小さく書く暗号など）。

この分野はかなりダーティなイメージがあるが、（個人情報の自動収集・解析とアプローチの巧みさでは）現在のWebマーケティングはそれを超えようとしている。
今回の重要なテーマは「手法とイメージ」にある。

業務連絡

以下の研究会は、資料データの再調査が必要になりましたので、延期することになりました。
（変更日のメールお送り致しました）

■common style.
「講義の無料配信によって得られるもの、失われるもの」
「学校が（学生にとって、先生にとって）魅力的な”場”として機能するには」

■教育デザイナー育成（準備会）
「専門および分野をつくらない俯瞰教育」
「教育デザイナーを育成するためのプラン」

Sergey Brinの講義

次回のcommon style. 勉強会テーマ：
「講義の無料配信によって得られるもの、失われるもの」
「学校が（学生にとって、先生にとって）魅力的な”場”として機能するには」

以下、Google Videoを活用した事例です。
講義の評価などチェックしてみてください。

サーゲイ・ブリンの講義（2005）
ダウンロードしてiPodやPSPで視聴することも可能
「SIMS 141 - Search, Google, and Life: Sergey Brin - Google」

Google Videoを使った大学の講義配信：
Press Release
「UC Berkeley offers courses and symposia through Google Video」
「UC Berkeley on Google Video」

大学、専門学校の講義配信にバリエーションが出てきました。iTunesやGoogle Videoをプラットフォームとするエデュケーションサービスは（もちろんタイアップもありますが）単独の学校プロモーションとしても価値あり。

補足：デジタルテレビで取得できる番組情報

昨日、時間が足りなかったので補足を掲載しておきます。

参考：
番組に関する（視聴者が知りたい）情報について

フジテレビ
http://www.fujitv.co.jp/index.html
TOPページ「こちらフジテレビ」＞「FAQ・Q&A」＞「番組で使われる曲」＞フレーム内の「番組で使われる曲」＞FAQ

［引用］
土曜プレミアム『電車男DELUXE　最後の聖戦』
http://www.fujitv.co.jp/faq/qa/2006/20060926.html
＜使用された楽曲に関するお問い合わせ＞
＜出演者に関するお問い合わせ＞
＜その他のお問い合わせ＞

・番組情報：現在はPCやケータイによる公開だが、デジタルテレビ（※これから発売される商品）で取得可能になった場合どういうサービスが展開できる？　昨日、議論された通り、バラエティ番組と映画・ドラマとでは扱いが異なってくる。
・番組情報：テレビプリントにスタイルフォーマット（きれいなレイアウトで印刷できる機能）を組み込むべき？
・番組情報：ショッピング・コードとクレジットカード、PCを使った従来のネット販売

・テレビ検索（TVの中で使うGoogleなど）のデフォルトは人気キーワード選択で十分か？　リモコンを使ったキー入力はあくまでオプション？（PCを使った検索との差別化）
・戦略的ダウンロード配信（テレビ局が配信する番組動画）と放送番組とのデータベース共有は動画ファイルに埋め込むメタデータが鍵となる

・利害関係：探ると、何もアイディアが出てこないほど複雑なので‥先送り。但し、いくらアイディアや技術があっても、関係する企業の立場（特に現状維持を主張する企業、団体）やレギュレーションによって「実現不可能」になる場合が多々あるので、情報収集は怠らないように。

業務報告：デジタルテレビが普及しなかった場合

本日の会議ですが、補足です。以下のテーマを取り上げたいと思います。現在、2011年までに「デジタルテレビ」が完全に普及する前提で進めてますが、若年層の動向が気になります。

●追加テーマ：
「若年層でデジタルテレビが普及しなかった場合」
一応‥議論したいと思います

１）デジタルテレビを買わないでPCでテレビを見る人が増える
Aパターン（若年層）
＞安価なチューナーの製造、容易な購入

２）デジタルテレビを買わないでPCでテレビを見る人が増える
Bパターン（若年層）
＞録画された番組がネットで流通
・デジタルテレビの画面「カメラ撮り」映像を320x240px程度に縮小（テロップも読めて、かなりきれい）

居間に大画面の液晶テレビ‥は良いとして、PCを仕事やプライベート問わず、日常の道具として使っている若年層はどうか？
人間誰でも等しく1日24時間、コンテンツビジネスは「時間の奪い合い」だが、ネットでテレビ番組のダイジェストをつまみ食いする習慣がついてしまうと、どういう変化が起こるのだろう？

議論するときの題材：

１）事件が起こる
２）ネットのニュースで知る（mixiなど）
３）詳しく知りたいので検索する
４）ヒットした個人ブログなどを読む
５）リンクされていたニュース映像を見る（YouTubeなど）
６）PCだけで、ニュースソース、テレビの報道番組の映像、個人の意見、等々‥多面的かつクリティカルに読み解くことができる

テレビをいつも見ている友達とある程度「共通のリソースを共有」できるので、テレビを見ることにこだわらない。

業務連絡：common style.

明日の会議：
１）前回の「DTVとSaaS」についてのまとめ
２）事業提案

事業提案については、学校法人において（少々中途半端な状態で‥）試行しているcommon style.の教育プランAと同じです。「2007年から全身全霊をかけて〜」と言ってきましたが、その決意をダラダラと聞いていただくことになるかもしれません‥。まずはインストラクショナルデザイナー（IDデザイナー）についてのモデルイメージでしょうか。現在「教育デザイナー育成プログラム」としていますが、これが急務かと思います。

事前に見ておいてほしい参考サイトは「UCLA MAGAZINE」です。

ご迷惑おかけしてます、行方不明ではありません‥

Webデザインの自動化［2010］メモ「海外クリエーターチームとの協業」

2010年プロジェクトの2006年レポートまであと3ヵ月。次は2007年レポートである。「2010年のWebデザイン」については書籍には盛り込まず（本当は結びで簡単に触れようかと思ったのだが）、もうしばらくクローズド。
以下、昨日テーマにしたメモ（※Googleサービスは勝手な憶測）

・デジタルテレビ向けにGoogleが提供する「番組検索」サービス
・ソフトウェアキーボードはサブインターフェイス
・注目度の高いタグやキーワードを表示してリモコンで選択
・キャノンのテレビプリント市場戦略
・テレビ仕様のWeb標準化団体（例：韓国はDPF）
・デジタルテレビ情報化研究会（シャープ、ソニー、東芝、日立、松下電器産業）
・デジタルテレビのWebブラウザ（同上）

2010年のWebデザイン（9/5のメモ）：

・SaaSによるWebデザインの完全自動化
※「SaaS」に関しては、ASPイメージを払拭するマーケティング戦略上の言葉と認識しているが説明コストを下げるため使用する

・Webデザインを自動化するSaaSモデル（2007年研究会発足）
・グローバルなアウトソーシング体制が重要となる
・コーディング作業と視覚表現、訴求、ユーカビリティ関連作業の分離
・海外のWebデザイナーチームにコンストラクション・キットを発注
・情報デザイン、視覚表現を徹底的に追求（韓国のデザイン教育機関との連携）
・海外のマークアップエンジニア・チームにユーザエージェントサポートを発注
・ユーザエージェント閲覧保証プログラムと契約
・オーサリングインターフェイスの研究拠点（米国）
・中小企業向け勉強会の開催
・学校向けデザイン教育のアプローチ（情報デザイン教育）

近況報告、サイトのトップを経由しないLPデザイン講座

7月7日（金）曇り
2010年プロジェクトで苦しい日々。
時は2010年「あの時、もっとやっておけばよかった‥」と後悔する「夢」を頻繁にみる。目が覚めると（当然）まだ2006年。「よし、もっと取材しておくか」となる。要するに4年後の自分にダメ出しされているのだ。
このプロジェクトは、20年前‥社会に出て初めて携わった大型仕事キャプテンシステムに次ぐスランプとなる。

逆に教育関連の仕事や本の執筆は良い感じだ。新しい本は出だし好調、まだまだ余裕がある。取材が多いのでシグマリオンが役立っている、外出先で問題なく作業。

高校生向けの情報デザインB講座、実技パート概ね完了。
RSS購読やアグリゲートされることが前提、サイトのトップを経由しないランディングページのデザインを課題にしている。

検索キーワード群を壁に貼り付け、表示させるページのデザインを紙にスケッチさせる。ラフページの作成はRWを使用。視覚表現はCSSEdit、RWのCSSファイルを読み込んで構造化する。こうやってプロセスを文章にすると難しそうだが、やってみると簡単。
XHTML とCSS2を採用。ページビルディングのブラックボックスが優れているので安心してデザインに専念できる。

久々にeラーニング関連の勉強会へ。教育コンテンツ制作における注目度は、いつの間にかFlashからAjaxへ。Ajaxのワークショップは教育者にも人気がある。互いの利点を生かして組み合わせると良いだろう。
ラーニングシステム導入時に必ず聞かれることは「セキュリティ大丈夫？」ということらしい。受講者のパーソナルデータをどこまで扱うか悩ましい問題。

・オープンソースのeラーニングCMSアプリケーション「ATutor」にクロスサイト・スクリプティング（XSS）の脆弱性
IPA［JVN#44846612：「ATutor」におけるクロスサイト・スクリプティングの脆弱性］

・Microsoft社がeラーニング情報共有ソフトを無償提供
Microsoft Learning Gateway「Microsoft SharePoint Learning Kit」

2011年のWeb業界［12］

・Webデザインと言語
・アジアのWebデザイナー台頭
・インドの役割

Webをつくる人々

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

■今月の課題：
2005年に登場した概念、造語などをまとめて「認知の経路」を図解してください。

・誰の発言？
・どうやって伝播した？
・影響を受けた人の行動は？
・ビジネスチャンスを感じた人は何をやった？

自分のメディアを持っている人の発言（概念、造語）は、多くの関係者に影響を与えます。業界の話題になれば、マスメディアで取り上げられ、ブームが作られます。
純粋な啓蒙者から利益を生み出すビジネスとして展開する人まで、さまざまなレイヤーで活性化されます。
皆さんは、この流れをトラッキング（追跡）しながらWeb業界の出来事を解析してください。

■ポイント
「現在」だけを追っていると日々のニュースや情報をインプットして終わってしまいます。タイムラインをながめるメリットは、最新の情報を孤立させないことです。過去の出来事とリンクしていることが分かりますので、たとえニュースの内容が正しくなくても自分で補正できるようになります。
将来を考える原動力にもなりますので、タイムライン・シンキングを意識して情報収集しましょう。

●発言者・提唱者：
ティム・オライリー（Web 2.0）、ジェシー・ジェイムズ・ギャレット（Ajax）、クリス・アンダーソン（ロングテール）等、数名

●概念や造語を公開するメディア：
論文、会議イベント、専門誌、ブログ

●影響を受けた人
・エバンジェリストになった人
・批判した人
・論じた記者、評論家、ブロガー

●伝播およびブームの経路
・ブログ、SNS
・マスメディア

●具体的なビジネスに発展させた人
・Webサービスに発展させた人（起業家など）
・セミナーや会議ビジネスに発展させた人（イベントプランナーなど）
・映像メディアや書籍に発展させた人（出版編集者など）

2011年のWeb業界［08］

■1996〜1998年

HTMLオーサリングソフトに「テーブルグリッド・レイアウト」機能が搭載され始める。作業が飛躍的に効率化され、視覚表現が豊かになる。＜table＞タグの複雑な入れ子構造を手作業で作成する時代は終わり、一般ユーザー層も取り込んで「表現」の拡充へと進んだ。

■2008年

「ビルダー」は、W3Cの仕様を読み込んだ上で、適切かつ最小限使用のCSSハック適用ガイドラインを作成、ターゲットブラウザの閲覧を保証する。これらの情報はデータベースで管理され、日々アップデートされる。
「デザイナー」は、ページレイアウトのプランニングやグラフィック表現などのコンテンツ（デザインワーク）にエネルギーを注ぐ。ページビルディングの作業は自動化され、CSSは直接操作せず、レイアウトアプリケーションを使用。

2007年までは、ビルダーとデザイナーの役割分担が曖昧で、1人が抱える作業量が膨れ上がっていた。状況が変わってきたのは、初心者層向けに提供されていた「モダンパブリッシャー」の普及からだ。

モダンパブリッシャーは、直感的な操作が売りだが、Web標準に沿った厳格なXHTMLとCSSをパブリッシュする。ターゲットとするブラウザの組み合わせに応じたCSSハックも適用されているため、安定したページとして評価されていた。［参考ムービー(FlashVideo)］

モダンパブリッシャーには膨大なデザインテーマがリリースされていた。2005〜06年に流行ったブログのテンプレートとは異なり、デザインテーマごとに必ずユーザー・インターフェイスが提供される。ターゲットブラウザごとの閲覧保証ルールがあり、初心者が感覚的にレイアウトを変更してもトラブルは発生しない。

世界中のビルダーが競って、美しく、かっこよく、クールなデザインテーマを開発し、メーカーに卸した。新しいバージョンのブラウザがリリースされると、すぐにアップデートされ、バグなどもハックで対処される。そのハックも不必要になればすぐに外される。
［参考サイト: multi RapidWeaver themes］

結果的に、Web標準やCSSについて何も知らない一般層によって、厳格なWebドキュメントが広められた。

■2009年
G社のモダンパブリッシャーに次世代のセマンティックスタンプが搭載されるが、規格がなかなか統一されず、安定したサービスに展開できない。
平行して進んでいたフィードのダイレクト生成とライブドキュメント化がブレイクする。デジタルテレビ・メディアへの情報提供はフィードベースで構築され、リッチ・アセットはテレビ側の「標準」BML(Broadcast Markup Language)拡張版で完結する。

■2010年
HTMLドキュメントのパブリッシュが減少、パーソナルブラウザの利用者が急増したことで、サイトの概念が変質する。11月、「HTMLが消える日」が刊行され話題になる。

会社のオフィシャル情報と社員ブログのVideocast

2011年のWeb業界［04］

「中小企業のためのビデオキャスティング」セミナー開催のきっかけとなった、ある会社の社員ブログ。このブログは（結果的に）会社の販促ツールとして機能したのだが、始まりは「個人発」のブログという位置づけだったのだ。

2005年11月のこと‥
広報部の社員（Kさん）が作った社内会議向けのビデオが面白く（テレビの通販番組をパロディにして新商品を紹介する内容）、会社のサイトで公開しようという話になった。ただ、いかにも素人ぽい映像だったので、もう少しきちんと見栄えを整えたいということでFさんのところに相談があった。

Fさんは、その映像を見て「これは会社のサイトで公開しない方がよいですね」と言った。単に雑な作りだから‥という理由ではない。もっと有効に活用できる方法があるという。
その方法というのが「社員ブログ」であった。

Fさん
「この人の個人ブログを立ち上げましょう。」

社長
「個人ブログですか？」

Fさん
「そうです。映像の内容はすごく面白いし、商品の便利さもよく伝わります。何より、この人のキャラクターがいい。」
「でも、会社のサイトで公開すると、その魅力が半減しますし、オフィシャルな情報との混在は閲覧者を混乱させる危険性があります。」

社長
「その個人ブログは会社の宣伝として行うのですか？」

Fさん
「ブログサービスの会社が、お金を払ってタレントやスポーツ選手にブログを書かせていますよね。個人ブログといっても、そのくらいの契約関係があるというのは、むしろ分かるようにした方がよい。」
「露骨な芝居をさせるようなやり方はネガティブ・キャンペーンを発生させます。クリティカルに読み解く閲覧者がすぐに反応するでしょう。そうなったら逆効果です。」

社長
「なるほど。」
「ただ、勤務時間を使うわけですし、どういうレベルの仕事になりますかね。」

Fさん

報告［一般ユーザーとWebモダンパブリッシャー］

終了しました（お疲れさまでした
このレポートはdesign zero（2007年最初の勉強会）の発表資料になります。
-2006.5.24 AM7:00

「2007年に流行る？モダンパブリッシャー」の話題は音声雑記で。但し、ボイスレコーダー故障中なので今日は無理‥（週末、買います

●モダンパブリッシャーとは、一般ユーザー向けの安価なオーサリングソフト。数千円で買える。非推奨のタグは一切使用しないW3Cの仕様に沿ったXHTMLとCSSでパブリッシュされるのが、今までの一般ソフトと異なる。現在、IE6で若干の問題が発生するが、プラグインのバージョンアップで対応される見込み。2007年後期にはブログサービスと連携するのではないか‥という噂あり。
厳格なXHTMLドキュメントでありながら、適切なブラウザ対策を施したWebページを一般ユーザーが容易にパブリッシュできるため、動向が注目されている。

●現状
総じてdivタグが多くなってしまう傾向にあるが、今のところしかたない（iWebはやり過ぎ）。プラグインも充実して、あと1年くらいでかなり状況が変わってくるだろう。プロのデザイナーが使うソフトではないので、普及させるには効果的なキャンペーンを半年は続けないといけない。一般ユーザーに向けたアプローチは、プロに訴えるものとは大きく異なる。
パブリッシュされるドキュメントのソースを検証するのは時期尚早かもしれない‥（商品としては優先度低い）
教育関係者にとっては無視できない興味深いツールである。

・Sandvox
　→正式リリース版はよい仕上がり
・RapidWeaver
　→次のバージョンがかなり良さそう
・iWeb
　→少々トリッキーなことをやっているので次のバージョンに期待
・その他‥

●昨夜の記録

実証実験中：
(X)HTML、CSSの知識がない学生さん3名が、Web標準のサイト構築に挑戦中！
CSSを意識せずに、直感的な操作でどこまでいけるか、明日の朝まで（よろしくお願い致します）。

CSSデザインの80%が自動化される

2011年のWeb業界［03］

Fさんについて紹介しておこう。
彼はデザインCMSのプロジェクトを2005年から動かしている。

2007年の冬に登場したブログサービス「zero」は、Fさんがプロデュースしたもの。従来のテンプレート・チョイスだけではなくCSSオーサリングツールまで提供していた。XHTMLやCSSの知識がないユーザーでも簡単に扱えるため、幅広い層に支持される。このブログが書き出すXHTMLとCSSはW3Cの仕様に沿っていて非常に厳格だが、ブラウザ対策も適切なものだった。

2008年春から、ブログサービスを提供する多くの企業が同等のオーサリングツールを追加、あっという間に標準の機能として定着することになる。

そもそもブログサービス「zero」のオーサリングツールは、M社のデザインCMSとして使われていたものだった。他社との差別化で力を入れていたのが「サイト構築の自動化」。

文章を書く、図を描く、レイアウトを考える、といったデザイナーの作業は自動化できないが、ページを構築するビルダーの作業は可能だと考えていた。
40種類のページビルディング用のプロファイルを用意して、段組みやブラウザ対策などの工程をブラックボックス化した。ビルダーはこのプロファイル設定と日々のアップデートが仕事になる。

XHTMLとCSSのハンドワーク（手作業）は20%ほど残ったが、かなりの工程が自動化された。デザイナーはCSSの手作業から解放され、コンテンツチームに加わることになる。デザインの作業に集中することで、十分なバリエーションを準備して検討できるようになった。

但し、CSS作業のブラックボックス化は、すべてのデザイナーに歓迎されたわけではなかった。マークアップやページビルディングのスキルが錆付くことを恐れた人はM社を離れることになる。

3年後（2008年）、オーサリング機能が使えるブログのヒットによって、W3Cの仕様に沿った厳格なXHTMLドキュメントが一気に増えた。オーサリングツールが参照するデータベースは、優秀なビルダーたちが日々アップデートしているので、新しいブラウザがリリースされてもほとんど問題が発生しない。

一方、プロのデザイナーたちは、プロフェッショナルツール「Adobe Dreamweaver 2008」によって、ライブドキュメント・デザインの作業がメインとなっていた。

つづく

●参考：
「データベースによってビルダーの作業は自動化される」
K社で採用されていたデザインCMSのイメージ

［映像を見る］
（FlashVideo／音声はありません）

使用アプリケーション：
RapidWeaver 3.2（4,500円）
Firefox（閲覧チェックのみに使用）

※これは「2011年のWeb業界」という本の荒原稿です。書籍にするよりブログ向きだろうと思い、公開していくことにしました

2011年のWeb業界［02］

「中小企業のためのビデオキャスティング」セミナーのカタログには以下のようなショートストーリーが掲載されている。

「Webは”編成”の時代へ向かっている。作り込まれたWebページをバラバラに分解して、再編成することに多くのユーザーは慣れてしまった。
2007年に流行ったコンポーネントタイプのWebページは、デジタルテレビやデジタルラジオ、ケータイやPSPなど多くのネット機器にデータを提供したが、流れを変えたのは第三世代のブログによる。
わずか3年で‥数百万していた業務用CMSを超えるパフォーマンスを持つ新しいブログが、誰でも簡単に、しかも無料で使えるようになった。」

新しい技術の登場（あるいは枯れた技術の新しい活用法発見）と利用者の「慣れ」によって、ネットの使い方がダイナミックに変化していくことを表現したストーリーである。

駅前の広場で新聞を読んでいる会社員AさんとBさん。
2人が読んでいるのは日本経済新聞だ。
同じ新聞だが紙面の構成が違う。
Aさんの日経新聞のトップ記事は「イラク本格政府 発足」
Bさんの日経新聞のトップ記事は「ソフトバンク、iPodケータイ発売」
同じ日に発行された朝刊なのに
読む人によって記事の構成が異なっている。

セミナーのオープニングでは、必ずこのイメージビデオが上映される。
受講者は年配の経営者が多く、新しい専門用語は極力使わないようにしているようだ。本当は「RSS」や「Feed」の話をしたいところだが、まずはビデオで大まかにイメージしてもらおうという狙い。

ビデオの上映が終了すると、Fさんがサイボウズの「feedpath」をスクリーンに表示させて、操作しながら話を始める。セミナーの進行はいつも、こんな感じらしい。ビデオを見せたり、実演しながらの講演だ。

驚いてしまうのは、映像と音声の検索や引用などを受講者の方々に体験させていること。このセミナーは前半が講義形式で後半がハンズオン形式なのだ（ハンズオンでは1人1台ノートパソコンが用意されている）。セミナー名をまともに受け取ると「ムービーカメラで撮ったビデオデータを簡易ソフトで編集してネットにアップする」といった流れが自然だと思うが、ちょっと違うのだ。
以下、ハンズオンセミナーから抜粋。

「これからはデータがとても重要になります。私たちはアセット（資産）と呼んでいます。」

「皆さんに体験してもらいたいことがあります。」

「簡単に言います。ホームページの中にある文章とビデオの１シーンをリンクします。」

「たとえば、海外向けに日本を紹介しているページがあって、その文章の「富士山」の部分をクリックすると、ビデオファイルが表示されて富士山の映像が再生される‥といった感じです。」

この体験とビデオキャスティングがどういう関係になっているのか、まだ説明されていないが「ビデオとビデオが参照しあうようなイメージ」を理解してもらうための第一歩というところか。
Fさん曰く「新世代のブログでは、アップロードするビデオに（簡単に）メタデータとチャプターマーカーを埋め込めるので、シーン参照が容易になる」と。

つづく

●参考：
ハンズオンセミナーの最初の体験
「QuickTimeムービーにメタ情報を埋め込んで、シーン検索の対象とする」

［セミナーのビデオをみる］
（FlashVideo／音声はありません）

使用アプリケーション：
Automator
QuickTime Player Pro（3,400円）
Apple iMovie（MacOS Xに付属）

※これは「2011年のWeb業界」という本の荒原稿です。書籍にするよりブログ向きだろうと思い、公開していくことにしました

2011年のWeb業界［01］

中小企業の経営者が集まる某研究会に参加した。話題は「実演デモの配信」である。要するに‥

自社製品のデモを配信したい！

ということだ。今の時代なら「ポッドキャスティング」「ビデオキャスティング」となる。先行している会社が、しゃべり上手の社員を使って製品のデモを撮り、ビデオデータをアップしたところ、大きな反響があった。反響だけではなく、売り上げにつながった。

その映像は素人のレベルで、照明とかフレーミングとか、ほとんど考慮されていないのだが「Flashで制作した商品解説ムービー」より反応があり、商品が売れたのだ。
「ジャパネットたかた」通販のパーソナル版ということか。

この事例のインパクトは大きく、「ポッドキャスティング」「ビデオキャスティング」に興味が向かう。今までは「プロに依頼して制作してもらう」ものだと思っていたが、自前でもいけそうだ。‥と感じた経営者の皆さんは、あくまでサブ・プロモーションという位置づけと言いつつも可能性を見つけようとしている。

重要だったのは、ビデオデータがユーザーに再利用されたことだ。会社のWebサイトで単にビデオが見られるという話ではない。ビデオを自由にダウンロードして二次使用できるルールにしたのだ。不評の製品だったら、めちゃくちゃに遊ばれてしまうが、そこそこの評判であればユーザーのブログでリンクされる。
その会社では最初から「ビデオ投稿サイトなどに（勝手に）アップロードされるのも歓迎」という方針だった。

製品を発売している会社が作った実演ビデオが、ネタとなり素材化することに新しさがあった。
但し、こういう手法はとてもデリケートである。前述したとおり、安易な出し方をするとネガティブ・キャンペーンが起こり、評判ガタ落ちである。レピュテーションリスクが高いのだ。

そこで「中小企業のためのビデオキャスティング」セミナーである。
会議ビジネス・マネジメント、イベントプランナーとしてのティム・オライリー氏を尊敬するFさんは、「ユーザーと一緒に製品を育てていく」ための「ポッドキャスティングおよびビデオキャスティング」活用に注目。

うっかりすると単にデモ映像を自社サイトで公開するためのセミナーと思ってしまうが、ビデオの共有化やユーザーのためのプレリリース・キット（ユーザーが自由に使える販促素材）、社員ブログ、社員の自由行動、コミュニティとの接続など、今までのアプローチとは違うものだった。

つづく

※これは「2011年のWeb業界」という本の荒原稿です。書籍にするよりブログ向きだろうと思い、公開していくことにしました

PSPユーザー優勢

アンケートの結果、PCよりもiPod、iPodよりもPSPという結果となった。ケータイはパケ代（パケット料金）にとても、とても、とても神経質なので外れてしまう。かなり意外な結果。

偶然にもPSPに関しては、ビデオキャスティングの対象メディアとしていたのでノウハウが生かせるのだが。それにしても若者はパソコンをあまり使わないのだろうか？

PSPが好まれる理由は、価格が安い（2万円）、月額数百円でネット使い放題‥（やはりお金）。あとは、iPodより画面が大きい、JavaScriptやFlashのWebコンテンツが利用できる、Google VideoがPSPのダウンロードに対応している、膨大なフリーウェアがある等。

参考：WIRELESS GATEは月額基本料金210円

■eラーニングの講座コンテンツ（ビデオ）を配信、PC経由でもMSコピーでもOK

■Web教材は、XHTML1.0 とCSS2で作成（CSS2は一部未対応）。PSPのブラウザ「NetFront」で閲覧。MacOS Xのブラウザ表示のように美しいレンダリング。私のWindowsマシンより読みやすい。
Web標準の仕様でページが作られていれば、PSP用のCSSレイアウトを適用するだけ。

PSPの液晶画面でビデオ（UMD）を90分観るというのは、私には無理だが‥そこそこ売れている。是非とも調査したい。PSPくらいの画面サイズなら「慣れ」でいけるのだろうか？

映画館でも観る、大きなテレビでも観る、パソコンでも観る、そしてPSPでも観る‥
ディスプレイ・インパクトのレポートを（もっと取材して）書き換えないといけない。

尚、このPSPレポートに関しては音声雑記で詳しく。

design zero - PSP web 2006/5/11

終了、お疲れさまでした（メモ）

●「ミドルディスプレイとしてのPSP」

１）Webドキュメント
＜div id="scene00102400" class="documentary"＞

２）ビデオの要約、引用
＜chapter maker="scene00102400"＞
ビデオの＜div＞タグとシーンのグループ化
V-CSSでDVDとiPod、PSPにリデザイン

３）ビデオのマークアップとダイジェストの書き出し
Webページの画像をビデオからパブリッシュ

PSPをモデルとする理由：
・低価格なので複数台用意できる（2万円で買える）
・無線LAN機能がある
・ブラウザでFlashが再生できる
・FlashPlayer 6搭載
（※システムバージョン2.70にアップデート）
・MacOS Xのワークフローで書き出されたビデオをPSPに転送できる
（※Popcorn 2が必要）
・文献が多い（世界中にユーザーがいる）

●勉強会
「ミドルディスプレイで見るカスタマイズ・ウェブ」

・小さなディスプレイとグローバルブレイン
・メタデータと再利用技術
・5年後のライフスタイル
・人間と道具、慣れと標準

●「PSPを指南書にする〜ライフスタイルデザイン」

お知らせ

デザインゼロについて

・勉強会を始めた経緯
・パーソナルなレベルでアセットマネジメントを実践
・フロー情報もストック情報もメタで管理
・個人創作物の再利用、共有
・デザインゼロのメンバー募集

[file-151]　勉強会デザインゼロ
※音声雑記のブログにリンクししています

Videocasting : デザインゼロ

common style 勉強会「デザインゼロ」のビデオキャスティング

デザインゼロは、PC-Web、TV-Web、モバイル-Webのアセット共有、コンテンツ・アダプテーションについて考えていく勉強会（2007年よりメンバー募集）
common style では「ブラックボックスデザイン」や「インストラクショナルデザイン」などの勉強会も不定期に開催中。2007年4月までに50本のビデオアーカイブが蓄積される予定。

■ミクチャーラーニングコンセプト
コンテンツは作り込まずアセットで提供し、誰でも自由に教材を作成してもらうための仕組み
・オリジナル（DV NTSC）→DVD配布用
・ビデオキャスティング（FlashVideo）→PCで視聴
・モバイル（MP4）→iPodなどで視聴
・ポッドキャスティング（MP3）
・ドキュメント（XHTML）

以下はやや強引にビデオ化したもの‥

・視聴する［Flash Video（標準画質）／9:32／12.6MB］
※Flash Player 8 が必要です

・視聴する［Flash Video（低画質）／9:32／22.1MB］
※Flash Player 7 でも再生できます
※低画質なのに22MBもあるとは‥

・iPod［MP4（高画質）／9:32／13.6MB］
※右クリックでファイルを保存してください（クリックすると面倒なことに‥）
※これは試しに用意したファイルです。iPodの液晶画面では小さな字が読めません

このテーマのビデオは全部で3本、後日2本をアップする予定
映像ブログ「週刊徒然映像雑記」は近日公開

「ブラックボックスデザイン」書籍化メモ（02）

2月28日（火）朝5時
月末の慌ただしさは本日の夕方まで。雑務から解放される。夕方からは執筆作業などに集中する。明日の朝までの時間割。

3月中旬頃から複数のプロジェクトに復帰する予定。他業種の方々と意見交換など。インターネットが社会に浸透し、いつの間にか同じ仕事をしている。分野は違っても、やってることは同じだ。個人もしくは一社だけの単独プロジェクトでは、どんどん遅れていくという危機感あり（ただ、最近は融合の好奇心が大きくなっている）。

積極的に他業種が集まり、情報を共有しながら、独自の戦法を打ち出していく必要がある。気になるのは、情報共有の場が厳格なクローズドネットワークに移っていることだ。素人お断りという厳しさ。ビジネス目的のSNSはこうなる。
とりあえず、素人扱いされないようにがんばろう‥

●本日の参考メモ：
Microsoftの「origami project」

●ブラックボックスデザイン・メモ

「ブラックボックスデザイン」書籍化メモ（01）

●「Webデザイン基礎」という本

2002年1月に「Webデザイン基礎」という書籍を出版した。前年にヤフーBBがスタートして、「日本もブロードバンドが普及するか！？」と興奮していた時代だ。

この本の執筆は、過去3〜4年で得た情報をベースにした。最初は難解なテーマばかりを取り込んでいたが、結果的に初心者向けの仕様におさまった。

「NTTサイバー総研」（私は科学特捜隊基地と呼んでいた）で講座を担当させていただいた経験や「SFSU」のプロジェクト、「MIT Media Lab」や「NYU」で見せてもらった研究の数々など、ネットにアーカイブされていない情報が山ほど集まり、（その一部を）Webルールという括りで置き換えながら体系的にまとめてみようと思ったのだ。

●「ブラックボックスデザイン」の書籍化

この頃から「ネットにアーカイブされていない情報」「アーカイブされることを嫌う情報」を追い続けているわけだが、4年経って”ある情報のかたまり”が蓄積されてきた。
昨年後半から断片的に取り上げている「ブラックボックスデザイン」である。来月中旬あたりから執筆を始める予定だ。このテーマについては複数のプロジェクトが動いており、現在も某業界の方々と異種格闘技戦のような攻防が続いている。

●フィールドワークの優位性について再考

Googleの勢いは凄まじく「アーカイブされることを嫌う情報」もどんどん検索の対象になってきた。これは恐ろしいことである。同時にエキサイティングでワクワクしているが。
いずれにしても今までのフィールドワークでは厳しくなる。そういう意味でも「ブラックボックスデザイン」の体系化はこのタイミングが良いと判断した。今のところ、解説書ではなく読み物になる予定。ただ、いつものパターンで図解が増え、ハイブリッドな仕様に変わっていく可能性もある。

●執筆のメモをテキストと音声で公開していく

アプリケーション本はなかなかメイキングを公開できないが（すぐに何の本だか分かってしまう）、この手の内容であれば「リフォームデザインガイドブック」の時のように、ブログにメモしていくことができる。昨年の夏からPodcastingもやっているので、音声メモも残していこう。

「書籍の執筆メモ」＋「ブログ＆Podcasting」＋「eラーニング」の連動で進めていきたい。本の執筆中にここまで展開するのは初めての試みとなる。特に”完成していない本”とeラーニングを絡めるのは、新しいIDの提案でもある。

●2011年に社会人となる高校生

この「ブラックボックスデザイン」は、高校生にも読んでほしいと思っているが、その理由は追々書いていこう。