安藤日記

[&] xtel: Ubiquitous Content Project

2010-02-16T14:23:00.001+09:00

xtel: Ubiquitous Content Project: ユビキタスコンテンツシンポジウム 2010　開催のお知らせ

xtel
ユビキタスコンテンツ制作支援システムの研究

[以下敬称省略]

石黒：次のメディアは遠隔コントロールできる新しい携帯電話
奥出：直感的にやることを整理してあげると、皆が使える道具になる。
　　　親しみやすいデザインとは、ユーザビリティを超えた世界。
山中：形を描こうとしてはいけない。
　　　構造を描くことによって自然に形が生まれる。
稲蔭：生活空間に誰しもが持っているものを使ってどう見せるか。
　　　だれもが持っているものを進化させる。

-------------------------------------------------
創造社会到来
　日常の中の非日常
　
クリエイティブな活動が社会的にも重要に。
ひとつのデザイン的な建築で世界的な注目をあびるきっかけになったり。
生活に密着した生活者のための実空間に根ざしたコンテンツ
生活の中でふとした驚きや楽しさをういmだし足り、没入的な感覚ではなく、
長い時間をかけてじっくりと体験を生み出したりという
生活の豊かさそのものに関わるコンテンツ

デザイン理論（哲学／方法論）
コンテンツの製作　事例の実証
制作支援システム　環境の整備
ユビキタス／コンテンツ新領域の創出

スペインのホテルのロビー (josonbruges.com) 擬似的な陰を生み出す壁
オーストリにある建物 (www.bix.at) 建物全体がディスプレイになる。
ブティックのインテリア。行動に反応する照明 (electroland.net)

空間の中に楽しさをどう演出するのか？
センサー、アクチュエーターの投入で生まれつつある。
人の会話、人の発表によってライティングが変わることも自動的にできる。
新しい空間づくりの技術開発と、技術をつかったコンテンツ開発をすすめている。

xtel (moXa, Talktic, Entity collaborator, Life)
moXa: 小型のネットワークコンピュータ。
　　　　床に埋め込むとかマイクに埋め込むなど。
Talktic : コンテンツアプリケーションの実行開発環境。
　　　　画面を制御するように部屋を制御できる。
ENtity collaborator : コンテンツ同士の交換ネットワーク
Life : 活動の経験をどうやって生かしていくのか。
　　　　コンテンツの経験をLifeシステムに蓄積する。
Xtel with xtunnel : 小型無線ノードからのウェブアクセスを実現

ユビキタスコンテンツ理論
　Design Thinking to Sketching Hardware

最新のもの
　フリミフラズミ：ミラノ・サローネ　サテリテ部門に採択

どう製品化していくのか、社会へ貢献していくのか、
足りない研究は何なのか？

本研究は JST の CREST 事業として 5ヵ年活動
-------------------------------------------------------------------------
「親しみのデザイン」
石黒浩：大阪大学基礎工学研究科システム創成専攻

アルスエレクトロニカで展示以降、アート的なものも面白くなってきた。
ロボットをやっていると「いつこういう時代がくるのですか」と聞かれる。
評論家では無いので、そんなことはわからないが、
明日にでもそういう時代が来る。５年後？１０年後？
人とロボットの関わりを研究したり、センサーネットワークを開発したりしている。
そういう未来がくるのかな？
アランケイに情報化社会がくるのですか？と聞いたら、
自分は思い描いた世界を作ったので、お前も作れと言われた。

ショッピングモールでロボットが案内したり、
アシモが店員のカフェとか。
実証実験にこだわる理由がある。
人とどう関わるのか？一番疑問で、一番難しい部分が
研究室の中ではわからない。実証実験にこだわって研究してきた。

ロボットへの疑問。
見かけ、動き、近く、対話、発達するソフトウェア、生体模倣型メカニズム。
人間型のロボットでサービスしようとしており、結局は人間を求めている。
ロボットを作りながら問題を考えていく。
ぶつかる問題も難しい。

見かけと動きの基本問題、人間らしさ、人間らしい存在感、
人間のような発達機能。
人がロボットを作っているに関わらず、動きばかり研究している。
人は見かけを重視する。
奇麗なお姉さんをみて、動きがカッコイイと思うことは少ない。

不気味なアンドロイド。
　世界で最初の４歳児のアンドロイド。
　頭部にのみモータを埋めこむ。
　最初に娘がアンドロイドに対面したら、ものすごく怖がった。

不気味の谷
　人間に近づく直前で不気味になる（不気味の谷）

女性のアンドロイドの開発（with 株式会社ココロ）
　無意識的動作はアンドロイドを非常に人間らしくするが、
　脳の専門家は不自然さを指摘する。
　人間は心の状態を持つため、その反応動作はより複雑
　改良するためには脳科学や認知科学の研究が必要。
　（頭を叩いても反応しない）

不気味の谷は超えたが、何か違うところが残る。

ジェミノイドの開発
　人間のように対話可能なアンドロイドの開発。
　遠隔地で「存在」するためのメディア（通信機）
インターネットを介した世界中からの遠隔操作
　２つのモニタ（ジェミノイドの体と相手）を見て話をする
動かないジェミノイドは立体鏡
しかし自分の動きを見ても自分だと思えない
　自分の動きは実は良くわかっていない。
頬を触られると感じる。他の感覚も補完される。

実は見かけで無いことに気づいた。
人間と変わらない自然な会議。
学生は教授の権威までも感じる。
子供と遊ぶ。子供はすぐに適応する。人として受け入れる。
父親としてのジェミノイド「偽物のパパ」と呼ばれる。

盲人と対話する @アルスエレクトロニカ
カフェの中のジェミノイド（日本から遠隔操作していた）
半分くらいのひとは気づかない。

携帯電話に続く新しいメディアとしてのジェイノイド
レストランで携帯電話で話す怒られるがジェミノイドに話すのはOK.
ジェミノイドを通して恋愛できるか？
次のメディアは遠隔コントロールできる新しい携帯電話。

映画「サロゲート」のオープニングシーンに謎のロボットとして登場。
このままサロゲートの世界がやってくるわけでは無い。
映画の中で何を想うか？

あなたは、あなたのサロゲートに似ている。
本当の君が欲しい。君の心はどこにあるの？

化粧は（サロゲートは）人を変えるのか？
精神は体に（ロボットに）宿るのか？
人とは何か？

ATRの所長に「ジェミノイドに似ているね？」と言われる。
化粧が進化したものがサロゲート？

現実は人間の創造を超える。
サロゲートの世界は遠からずやってきる。
SF映画は絵空事から、近未来の思考実験の場にかわってきた。
しかし、現実は映画以上にまれである。
悲しむアンドロイド、人間のような豊かなアンドロイドの表情がつくれる。

アンドロイドによる死の表現。
死んでいくアンドロイドは人にしか見えない。
修理を受けるアンドロイドを見ても生々しさを感じる。
解体されるアンドロイドは人間を強く意識させる。芸術か？

アンドロイドは人よりも人らしい。
ロボット演劇（心の表現）
　役者には心は必要ない。ロボットでも十分心を表現できる。
　ロボットは単純なプログラムに従って動いただけ。
　ロボットの演技にほとんどの観客が人間らしい心を感じる。

人よりも人らしい人を造る。
　人間のマキシマルデザイン
　人間よりも豊かな表情　
　
人間の最低限の形。ミニマルデザイン（挑戦）
人間から人間には必ずしも必要ではない部分をそぎ落とした形。

人とは何か？何が人を人間たらしめているのか？
　体を機械に置き換えた人間に残るものは何か？
　心の実体を持たないに人間には何が残るのか？
　人間にミニマルデザイン（最低限の形）はあるのか？

メディアとしての人間とは何か？
　人は自分のことを他人ほどしらない。
　心は互いに持っていると思う故に、自分にもあると感じる
（相手がいないと自分がわからない）
　人間は社会的な存在である。
　脳と体は密に繋がっていない故に、
　情報／機械と融合できる（メディア／人間社会）

-----------------------------------------------------------------------------
道具としての親しみ (Naohito Okude - Experience Design)

人間と機械とのインタラクションの中に、生きている感覚。
機械の道具としての親しみやすさがある。

アンドロイドと社会
　仮象少史 - 古代かコンピュータ時代まで（ノルベルトボルツ）
　まさに機械と人間という関係。身体性を感じるか。

日常世界と経験
　経験デザインと親しみやすさ。
　親しみを生み出す道具をデザインする。

人間は経験がある。経験を何らかのメディアとしてくれるのが道具。
人間を何かの経験をさせるのが価値だということに気づいた。
スターバックスでコーヒーを飲むこと。高価なコーヒーでも、そこで経験することに意味がある。
Nike はなぜ Nike なのか、ランニングしている人へのメッセージを発している。
シューズを買うことだけではなく、ランニングコニュティに属していることを思い起こさせる。
ハーレーダビッドソンに載るという経験を生み出す。中年で革ジャン。
ハーレーの物語が生まれた。会社のロゴを入れ墨にするくらい。

日常生活を生み出す。
ホスピタリティの演出と日常。
Service Design (A brief introduction to service desingn - live|work)
コミュニケーションが介在する。サービスをデザインする。
サービス思考。バスを待っている、銀行の列を待っているとき。

サービス産業はサービスを「もの」にしようとしている。
商品にしようとしているのでわからなくなってきている。
ものの魅力をデザインする。
Alvin Toffler
ものを使ってみて「親しみ」を感じる
ものをつかって「親しみ」をあたえる
つくることと使うことを分けて考えなくていい。

道具としてものを考える
　道具は使ったときに意味がでりう。

デザイン思考
消費者ではなくユーザーである。
　買って満足するのではなく、使って満足する。

サービス思考
　サービスの中心に人をおく

加賀屋（ホテル）：道具としての心地よさ。

加賀屋の哲学と尾錠。
　哲学：笑顔で気配り
　客の気体に応える
　正確なサービスを心がける。
サービスの問題
　労働集約的で難しい。
　サービスを可能にするネットワークを構築する。
　台所から客室まで配膳するトレイロボット
　コンセプト：ハイテク／ハイタッチ
客室中心のシステム
客室係がきめ細やかなサービスをするためのデータベース
継続的なサービスが出来るように従業員を支援するシステムを構築

◆道具としての親しみやすさ
　
親しみやすい道具をつくる７つのステップ

１. サービスデザイン
　サービスデザインとは様々な「タッチポイント」を使って
　人々に触れることのできない経験をある程度の時間の中で
　提供する仕組みをデザインすることである。
　デザイン思考方法論を使う。

2. サービスエコロジーをみつける
　サービスエコロジーとはサービスとそれが提供されている
　民族誌的調査を行なう。
　医療行為によって感謝が発生している。
　彼らの世界とのタッチポイントを見つけないと行けない。
　どうやって医療従事者が患者をみているのか？

3. Touch Point
　ペーパープロトタイプ。動かしてみる。形が見えてくる。

4. ものではなくサービスを望む
　親しみをあたえてくれる「もの」を求めるにではなく、
　親しみのサービスを望む（service envy) ように演出していく。
　ここが一番難しい。
　モデル分析

5. 実証する
　開発した道具をどうつかってもらえるのか？
　ペルソナを作成する。
　患者、医師、ヘルパー、全てのペルソナをつくった。
　シナリオをつくる。

6. 経験をプロトタイプする
　顧客とサービスを提供する専門家に実際に使ってもらいながら
　デモをしてフィードバックをもらう
　何も言わないで使ってもらう。いきなり使い始められるか？
　在宅医療という目的がはっきりしているところで検証した。

7. 検証モデル。
　実際にどういう形でサービスを提供するのか？
　過去から存在していたかのように使ってもらえるのか？
　当たり前の項目があたりまえに使えること。
　フィールドテスト
　
ヘルスケアという特定の状況。
日常生活は非常に複雑なことを行なっている。
体験があると思い込んでいる。
inter subjectivity のポイントをつかんでインタラクションに
持ち込んでいても、日常と変わらないのですぐ使える。

コンピュータの設計は、システムを使うと物事が解決する。
直感的にやることを整理してあげると、
皆が使える道具になる。
カンナ（鉋）のような道具。

人間は均質で同じ運動している。
人間が端末を持って、複雑な世界にはいっていく。
人々と人々がコミュニケーションが積み重ねるところに
どう経験デザインをいれていくのか？
親しみやすいデザイン、ユーザビリティを超えた世界。

奥出：アートとエンジニアリングの境界線にデザインがある。
石黒：超えてはいけない一線は無い。やろうと思ったらやってしまう。

---------------------------------------------------------------------
山中俊治美しさのデザイン

大学の時に機械工学科、卒業に６年かかった。漫画を書いてばかりいた。
漫画と機械工学の両方を生かせる仕事を探してプロダクトデザインに行き着いた。
日産のデザイン部に漫画をどっさり持ち込んで面接をうけた。
Nissan 945 のデザイン、その後独立して、時計のデザインなど。
一番皆さんに使ってもらっているのは、スイカの自動改札。

最初に設計する時に、どうやったら人がうまく使ってくれるのか考えた。
ほんの少し斜めにする、丸く光らせる。
それだけで劇的に認識率が高くなった。
スイカの改札、13.5度傾いている。その角度を決めたのは私。

W-SIM カード、カードそのものをデザイン。
時計の内部機構、そのものをデザイン
大根おろしのデザイン。
両手親指キーボード。NY MOMAのコレクションになった。

年配になるとデザインを辞めてしまう人もいるが、私はずっと続けている。
富士通に依頼されてつくった、携帯電話のコンセプトモデル。

その１：構造をデザインする

　形を描こうとしてはいけない。
　構造を描くことによって自然に形が生まれる。

絵を描くと輪郭線を書いてしまう。
昔書いていた漫画はスポーツマンガ。
重要なのは、構造、骨格がどうなっているのか描けると自然に人間の形が奇麗に描ける。
外観を造ろうとするのではなく、構造を自然に造ることでできる形が美しい。

　有機的なスタイルを与えることよりも、
　洗練された設計解の達成によって、
　結果的に有機的な印象になることの方が上位にある。

からくり人形：弓引き童子
玉屋庄兵衛、９代目、道具も全部自作。
最近になるまで内部構造を見せないものだった。
からくり人形の内部構造こそが美しいものを作ってみた。
加工性に応じて、様々な素材が使われている。
全部で 11本の糸が胴体の下にある。
カムが一本一本の糸をコントロールする。
イヌワシの羽が矢をまっすぐに飛ばすのが重要。

顔をのっぺらぼうになるよう提案した。
うっすらの鼻の部分が突起している。
玉屋氏は、まず顔から作っている。
図面書いて造らないとダメかと思ったが、
顔から全体が造られていく。
古き良き、デザイナー、エンジニアである。

◆美しいスポーツ義足
　現在手がけている。来週にも１本新しいものができてくる。
パラリンピック、人間に似せた義足ではなく、
人の足に似せるのをあきらめることによって、
性能が得られた。
その義足の構造が美しい。彼らの姿をスケッチしながら、
何ができるのかを考えていった。
新しい義足を造りつつある。

その２：生命感をデザインする

漫画が実物と似ない点において正に実物
自身よりも実物に似るというパラドクシカルな
言明はそのままに科学上の知識に適用することができる。
（大正13年、寺田寅彦「漫画と科学」）

この３体のロボットを造りながら探求してきたものは、
生き物の仕組みではない。
人がどんなものを生きていると認識するか、
つまり私たち人間にとっての「生き物っぽさ」の抽出である。

◆働かないロボット

ロボットはもともと「労働」の意味なので、矛盾した意味。

Cyclops
2001 年に造ったロボット。愛知万博にも展示。
Cyclops の制作風景（takram の田川さんが作業している！）
動くものに反応してそっちを向く。人は何か知性のイリュージョンを感じる。
考え込んでいるのだろうか？と想い、皆が呼びかけする。
「ああそうか」ある意味での抽象化。
エッセンスを造ることが意味がある。

Ephyra
日本の繊維技術を示す展示。Sensware 。
4m のストッキングのような素材の中にアーム。
アームの先端には静電容量センサーがついていて、
人がさわったか触らないかで反応。
やわらかい動きに苦労した。
シリンダーに何秒後に伸びきるのか予想させて、
伸びきる少し前に勢い良く収縮するような作りに。

Flagella
SFCの研究室で作ったもの。
曲がった素材を組み合わせ、
お互いに回転することで曲がっているように見せかけている。
SFCは機械工学が無い。本を紹介し、独習させ、作った。

その３：応答をデザインする。

レイテンシーが無いことが重要。
メディアアートの場合、やれる可能性を探してしまうので、
何かするのに、一瞬遅れる。
携帯電話でさえ、一瞬おくれる。
山口のミニマルインタフェース展用の案内システム。
穴の開いた紙が配られ、会場に設置されたテーブルに置くと、
オーバーラップして案内が表示される。
レイテンシーが無い。
言語的な制限、覚えなければいけないことがない。
失敗して困ったことにならない。
使い勝手を教えないでも使えるようになる。
案内システムが一番人気の展示になった。
紙がしわくちゃでおちゃんと

iPhone Baby
1歳半の子供が、iPhoneを使いこなしている。
手のサイズとの比較だと、iPad のようにも見える iPhone（笑

-----------------------------------------------------------------------
稲蔭正彦 xtel 21世紀型コンテンツのためのデザイン・エスセティクス

5年間、新しいデザインの領域を開拓しようとしてきたプロジェクト。
まとめのシンポジウム。美しいもの、心地良いものは何だろう？

iPhone baby に対抗するわけでは無いが、
動物達はとてもクリエイティブである。
　Monkey Painting (Hardcover) by Thierry Lenain
　巨匠の作品と比べるとたいてい間違える。
　When Elephants Paint
イルカも絵を描く？動物達はとてもクリエイティブ。
子供達にアーティストですか？と聞くと全員が手をあげる。
だんだん大人になると、アーティストでないと思ってしまう。
アーティストという職は楽で、自分がアーティストだと言えばアーティスト。

作品を作るときに大事にしているのは、プロセス。
作っては直し。作っては直す。
いかに早く繰り返すかが大事なポイント。
ラピットプロとタピング、いかにたくさん繰り返すかが
作品の優劣を決める。
Hagoromo Densetsu (Paris, France 2008) 舞台装置、映像。
セットでは出来ないことを映像でカバーする。

自分でアルゴリズムを作成し、反映してきたもの。
アーティストにとって、アカデミアの技術は、絵筆を開発するようなもの。
SFC入る前と後ではそれほど変わらない。
近未来のパフォーマンスを手がけている。
こういうコンテンツはスクリーンや舞台が主役。
生活の中にちょっとした、スナップサイズのコンテンツとして
作り出せないか。
映画は映画館にいって、２時間楽しむもの。

脇役としてのコンテンツ。
　ユビキタスコンテンツは、脇役として心豊かな生活を支援
　5 seconds of fun - 一瞬の癒し

生活とコンテンツ
　衣食住＋楽
{行動的、視覚的、時間的 }コンテンツ

ユビキタスコンテンツのデザイン
　モノ・空間・情報をデザインする
　インタラクションをデザインする
　行為・行動をデザインする
　経験の連鎖をデザインする
　Collectivity をデザインする
　ストーリーをデザインする

インフォメーション・エスセティクス

データビジュアライゼーション、可視化。
美しく、興味深く可視化しないと人の興味をひかない。

SURROUNDINGSWELL
雨漏りをうけるバケツ。
フリミフラズミ。ミラノ・サローネ　サテリテ部門に採択
局所的な天気予報がバケツの形の音と光で表現。
http://surroundings.sfc.keio.ac.jp/swell/

インタラクションのデザイン
どうやってインタラクションを促すかが重要。
生活の中でどうやって誘導するか？
「影の世界」影の中にキャラクタが表示される。

行為と行動のデザイン

Amagatana(雨刀)
傘を振るのは自然な行為。どうやってインタラクションに持ち込むか。

Panavi
フライパンが料理のアドバイザーになってくれる。
美味しい料理を作るプロセスを紹介。
生活空間に誰しもが持っているものを使ってどう見せるか。
だれもが持っているものを進化させる。

MYGLOBE
http://www.myglobe.jp/blog/
地球儀を進化させることができないか？
人が外で活動している経験を地図に引き戻せないか？
町を歩いていても、よく知っている道と知らない道がある。
認知地図。

Collectivity のデザイン
集合知。みんなの力でできることをデザイン。

Fleur（フルール：フランス語で花）
単なる照明器具ではなく、呼吸をしている。
膨らんだりしぼんだり、会話の盛り上がり度によって、変化する。
会話のスピードと合う、合わないことに気づくことがある。
パブリック空間とプライベート空間のスイッチ。

経験の連動。
連鎖をコンテンツに応用できないかと考えた。
Amagatana と Sound Candy の連動。

ストーリーのデザイン
　ライフスタイルは日々のストーリーの積み重ねである。　

Safe Social Networking
社会にどうやって使ってもらうのか。
かざすと建物の向こう側が見えるデバイス。
経験を蓄積する都市のコンテンツ化。

-----
Q（奥出）もともと違う分野から今の

山中：最初コンセプトを話しただけ。最初はギアひとつ知らないところから始まった。
　　　1年後には作れてしまった。適応能力の素晴らしさは驚きであった。
　　　そうやって鍛え上げて 1-2年すると居なくなってしまう。
稲蔭：大学に入って、学生と向き合うとき、教えるのではない、
　　　自分が学費を払わないといけないと思うくらい、アイデアをもらっている。
　　　学生がアイデアを出し、自分たちで作っている。
　　　自分は良きパートナー。「何々をやれ」とは言わない。
　　　大きな流れのを語る、コンテキストが固まってくる。

Q. 美学は意識している？

山中：僕はなにやっているんだろうと、考え続けている。
　　　美しいと思います。なんで？の問いが大切。
　　　シーンの直感。科学は抽象化概念を探している。
　　　美学は主観的に到達してしまう。アプローチは違うが
　　　我々が見ている中で、いつのまにか感覚的に
　　　健全さ、ものごとがうまくいっていること、
　　　起こっていることが明瞭に意識された時の直感。
　　　感情と正しく連動しているか。
　　　何に気づいて美しく感じているのか。
　　　「なんかいいから」という表現はダメ。
　　　作っている途中で分からなくなるからダメ。
　　　直感的に良いと思ったものが何だったのかを問いかける。
　　　それを言葉にできないといけない。

稲蔭：作家としてはスタイルが大切。複数の作品で１つの個性が大切。
　　　それが主張できないと一人前の作家とは言えない。
　　　うわべの色使いだけではな。
　　　どうやって魔法をかける。魅了する魔法のかけかたにスタイルがある。
　　　魔法のかけ方のスタイルを教えようとするが難しい。
　　　魔法の隠さないといけない部分を露出しないように。
　　　隠すことによって魔法が生じる。そうやって作品を仕上げていく。

山中：いろんなところに妖精や精霊がいる。
　　　それを皆が共有しているのがわかる。
　　　リアルな存在では無いが、ふと感じている直感のひとつ。
　　　
稲蔭：音楽の調律のようなもの。
　　　イマジネーションがどこかにいくとぶれてしまう。
　　　常に原点にもどす。

山中：ロボットでもセンサーや仕掛けが記憶にのこってしまい。
　　　同じ仕組みで何かしようとするが。
　　　生きているっぽい感じを表現する。センサーやコンピュータは隠す。
　　　ひとつ作ってしまうと、同じ仕掛けで似たようなものを作ってしまう。

Q. 人間の身体の動き、機械と身体の動きもデザインしている。
　　インタラクションデザインで動きそのものはどうやってデザインしていく？

山中：昔スポーツマンガを書いていて、止まった絵だが、間が大切。
　　　どの瞬間を絵にしてもいいものではなく、人が印象的に思う「間」がある。
　　　それは実際に物を作っていても「間」やタイミング。
　　　身体は、重心の移動の瞬間がある。
　　　動的なところがつかめると動いているときに自然になる。
　　　そういう整理をちょっと入れてあげるだけの動きを美的直感でとらえる

稲蔭：もともと視覚メディアはビデオシンセサイザーから。
　　　時間には連続性がある。自分のイメージどうり作りたいときCG。
　　　CG は直感ではなく、思考でつくる。不連続ではなく、連続の錯覚。
　　　本質的にみると動きが違うことに気づく。
　　　本物そっくりに見えても動きが偽物に見える。
　　　考えながら作っているものに関しては、納得する動きが作れない。

Q. メカニカルな割には、時間の流れには敏感。
　　頭の中でどうやって整理している？

山中：直感的にこうでないかと思ったことを単純に力学として理解することも重要。
　　　数学的な直感は大事。後で自分の美意識の裏付けになる。
　　　SFCは数学を教えないから....

メカニカルな数学的な動きを知った上で、もうひとつ上の段階で捉えないといけない。

稲蔭：クリエーターの立場から数学的にCGでは作れる。
　　　意外と自然界に無い動きに共感を有無ことが心地よい瞬間がある。
　　　それが見つかった時、その表現メディアの特性をとらえたことになる。
　　　実空間のコピーでしかない。
山中；最適化された何かが見つかるかもしれない。

実世界は複雑。CGはメカニカル空間。
僕らが持っている感覚の方が大きい。

稲蔭：実空間に無い空間での動きが新しい美学に繋がっているところもある。

Q: 複雑の物理現象を感じるときは？

山中；快感は、ある意味倒錯。
　　　子供はある種の食べ物を嫌う。
　　　大人になると、ちょっと危ない食事を味わうことが美食になってくる。
　　　完璧に動作しているものだけではなく、
　　　不自然と自然の間の絶妙なところを生み出す。

稲蔭：人間の本質は変わっていない。
　　　ストーリーを考えるときは予期させた結末と意外性の結末の微妙なバランス

山中：確かに少し前までは、モダンデザインで見逃していることがある気がしてきた、
　　　ひととおりやってしまうと、
　　　テクノロジーが未熟だったから、モダンデザインになった。
　　　最新テクノロジーで脱モダンデザインが可能になる。

Q. 心がけていること

山中：ひとつは、作家として気がついたこと。
　　　仲間と作らざるを得ないとき、人と作らざるを得ないとき、
　　　自分が一番わかっていて、それに従わせようとするとうまくいかない。
　　　自分が主導権を握ろうと無理をすると良くならない。
　　　いまいるメンバーで一番良いものを作るにはどうしたら良いかを考える。
　　　なにを人に期待すると最も良いものが作れるのかを考える。

稲蔭：違う文化圏、同じ人が組むとなにも生まれない。
　　　会話が成立しないようなバックグラウンドを持つ人と組むほうが何か生まれる。
　　　オペレーションが難しいが。
　　　２つのレイヤー。大きな流れ、ビジョンを持つちから。
　　　今作っているものを光らせる力を持つ。
　　　「何のため」という大きなビジョンを見失ってしまわないように。

山中：自分のアイデアを了解を得て、押し付けることもイイと思っている。
　　　自分の方が経験があるので、仕方が無いときもある。
　　　主導権争いは作家として本気で向き合う。

Q. 弟子として学びたいことと、師匠として学び取りたいことがある。

Q. 会場から：エンジニアとデザイナーとしての境界が自分の中にあるのか？

山中：エンジニアでもあり、サイエンティストでもありアーティストでもある。
　　方法論が違う。主観をセンシティブにし、内製的なものを掘り返す。
　　アーティスト的な作業。論文にもならない作業。
　　これを終えると、実験やプロトタイプで検証しながら事実はなんであるのか
　　客観化し、だれもが同じ言語でかたれるようになる。
　　両方を混ぜない方がいい。
　　エンジニアとアーティストが違う人ではなく、
　　一人の人間がやることで到達できることがある。
　　喧嘩しあうので、論理が主観を殺すときもある。
　　人格の使い分けが大切。

稲蔭：レオナルドダビンチは天才だと思うが、
　　　日本には足りないのはエンジニアマインドもクリエイティブだと思うし、
　　　ビジネスにする新しい仕組みを思いつくのもクリエイティブだと思う。
　　　一人の中でこなせるし、一人だからこそ生まれるもの。
　　　アーティストでも、エンジニアでも、ビジネスマンでもある、
　　　だからこそクリエイティブな社会が生まれるので、分けることには意味が無い。

Q: 会場から：構造をデザインする。iPhone を考えたとき、
　ネットワークに作業させる、空っぽな構造になってしまう時、モノのデザインは？

山中：せいぜい手触りの良い背面がついているだけ。
　Apple は良く理解している。ボタンが 2個あるといろいろできるのになぜ？と学生はいい。
　Apple が言語的なルールをつけない。
　２個ボタンがあるとルールを決めないといけない。
iPhone はそれをしていないから赤ん坊でも使える。
　そこで何を言えるかというと、あらゆることをソフトウェアで実現する思想。
　ユーザインタフェースをソフトウェアで実現する。ハードウェアはそれを支える。
　フィジカルな構造が非常に重要になってくる。それはソフトウェアで解決しない。
　デザインがソフトウェアになってくるとき、
　ソフトウェアを含めた「フィジカル」をデザインするのが大切。

[&] 3D VIERA

2010-02-10T00:58:00.005+09:00

VT2シリーズ | プラズマテレビ／液晶テレビ「VIERA(ビエラ)」 | Panasonic

CEDEC や CES でお目見えしていた立体視用テレビ Panasonic 3D VIERA
VIERA VT2 シリーズ (54inch, 50inch) と
3D対応 Blu-Ray DIGA が4月23日に発売開始とのことで、
一足早く実物を観てきました。

まず、アクティブシャッターグラス（液晶シャッター眼鏡）が
サングラス風にカッコ良くなっていました。
Xpand3D の重くて不評な眼鏡に比べて、10g くらい軽いだけの 63g
らしいのですが、圧倒的にかけ心地良し。
眼鏡かけている人は、眼鏡の上部に立体視眼鏡がひっかかる仕組みがあって、
重さが自分の眼鏡に分散されて耳が痛くなることもない。
ボタン電池 CR2032 で約100時間弱くらい。実売 1万円くらいとのこと。
また、鼻の上に載る部分を調整できるので、子供でもかけやすいらしい。

あと、3D VIERA の方は、部屋を真っ暗にして観たせいもありますが、
黒色のしまり具合や、反対側の目用の映像がもう反対側に漏れるクロストークも
皆無で、数ヶ月前に 3D VIERA のプロトタイプを観たときよりも
格段に見栄えが良くなっているのがありありと分かりました。

もちろん両目視差で立体視を感じる部分もあるのですが、
背景の深黒が見えると、それだけで奥行き感が増します。
画面はいわゆるグロス表面でテカテカなのですが、
あまりに黒味が黒いため、まるでマットな画面に見えるのです。

その他、細かいいろいろなこと....

　● 3D対応 Blu-Ray では MPEG MVC によって普通に考えると
　　2倍の情報量になるものを
　　1.5倍程度に圧縮して Blu-Ray に記録しているそう。
　　この利点は、2D(立体視でない）プレイヤーでも観られることと、
　　映像を詰め込みすぎて、画質が落ちるということも無いそう。
　　（左目映像だけを再生すると、2D用 Blu-Ray と全く同じ画質）
　● 旧 DIGA では残念ながらファームのアップデートで立体視に対応するのは無理。
　● 静止画対応は、考えているけど、今はまだとのこと。
　　Fujifilm の立体視デジカメは、
　　撮影できる視差がきつすぎてテレビには向かないそう。
　　8インチの立体視フォトフレームで観るのに最適化されている。
　　いずれ、3Dテレビに最適な3Dデジカメを夢見て、
　　有志で立体視写真コンテストをしているそう。
　● もちろん BS11 の Side-by-Side 形式の立体視放送にも対応。
　　今のところ残念なのはリモコンで方式を切り替えなければいけないところ。
　　これもいずれは規格化して全自動で。
　● インターネット上の動画コンテンツにも対応しているので、
　　YouTube の立体視オプションにも対応。
　　YouTubeの立体視は、Google の 20% ルールのもとで開発されているので、
　　開発の進みが遅いし、赤青が逆だったりもするけど、今後に期待。
　● Panasonic は現在ハリウッドにオーサリングスタジオ（研究所）を持っており、
　　この分野を広める役目を担っている。
　　今後は SONY はもとより Deluxe Entertainment や
　　Sonic Solutions にがんばって欲しい。
　● 立体視撮影時の左右のカメラが上下にちょっとでもずれると気持ち悪くなる。
　　左右のカメラがねじれる映像もダメ。
　　これは国立天文台の 4D2U プロジェクトでも
　　検証／実感されたことでした。3D VIERA で宇宙を表示してみたいな。
　● 左右同じ見栄えで立体感を感じるよりも、実は左右の目で見たときの
　　わずかな質感の違いで、より立体感を感じているのではないかという話。
　　フルCGでレンダリングした立体視映像の、
　　左右の目用にシェーダーを書き換える技もこの理由なのかもしれない。
　● あと PACE の話も出たけど忘れた。
　● 立体感をつけようと左右のカメラを離すと映像は箱庭現象により小さく見える。
　　これは、人間の目の感覚が 6.5cm 程度なのに比べて巨人の目になっているから。
　● 遠くのものをズームした状態で立体視撮影すると、書き割り風の薄っぺらな
　　オブジェクトに見える。これはズームの度合いや被写界深度（ピント）との
　　バランスで編み出されるもので、どのくらいの薄さになるのか計算できるそう。
　　逆もあり、fujifilm の立体視デジカメで撮影したものは奥行き方向に厚く見える。

とにもかくにも、進行役の徳力さんの絶妙な合いの手と、
Panasonic 末次さんの技術者魂と心意気が感じられる試写会に感謝。
製品になる時にはさらに性能が向上していることと、
次回はこの 3D VIERA で AVATAR が観られることを期待しています〜

追記：YouTube の 3D(立体視) 対応はまだ公式のものではなくて、
Google の Pete 氏の 20%プロジェクトで進行中のもの。

yt3d:enable=true 　立体視表示モードを ON にする。
yt3d:aspect=3:4　アスペクト比を設定する。
yt3d:swap=true　右目画像と左目画像を入れ替える。

アナグリフ（赤青）表示の時に、左右の目が逆転してしまうバグあり。
（眼鏡の方を反対にすればいい（笑

表示モードは
Red / Cyan Glasses: Full Color
Red / Cyan Glasses: Optimized (Dubois)
Red / Cyan Glasses: B&W
Amber / Blue Glasses: Full Color
Amber / Blue Glasses: B&W
Green / Magenta Glasses: Full Color
Green / Magenta Glasses: B&W
Parallel
Cross-eyed
Mirror Split
Left Image Only
Right Image Only

YouTube の中を (yt3d:enable=true) で検索すると、
いろいろ見つかります。

[&] Digital Book 2010

2010-02-01T01:03:00.008+09:00

iPad の発表で、ePub に注目し始めたけれど、
日本で ePub 展開するのはなんだか難しい気もしてきたので、
デジタル時代の本の新しい形を考えてみる。

前にも書いたけど、
「本」は印刷技術のおかげで今の「書籍」の形をとっているにすぎない、
未来の「本」はもっと違う読み方、使い方があるはず。

iPadの画面サイズが 4:3 なことから、
今時の映像（映画）に使うことはあまり考えてない気がする。
ターゲットは A4 や US Legal/Letter サイズの紙ってことだ。

まずは、書籍の模倣から逃れる。
既存のパソコン上で読むオンラインブックは、
ページめくりなど、どれも書籍を模倣している。
BakMagazine とか、無料でクオリティの高いビジュアルブックも、
結局は雑誌という形態の本を模倣している。

◆本の要素と電子書籍の要素を考えてみる〜

　● 最初から順番に読む本、ぱらぱらと読む本、探しながら読む本
　● 本のコレクションと、積ん読する本
　● 主に横書き。でも縦書きも大切
　● 新聞にはタイトル、見出し、リード、第1段落の概要、本文という
　分量とスコープを的確にしぼった書き方がある。
　● 見開きではない、１ページだけであること。
　　雑誌のレイアウトデザインは見開きで考えられている。
　　一度に１ページしか観られない。
　● どの文言、どの文末で、ページが変わるか。次のページに移るのか
　● カラーと白黒、背景と文字とのコントラスト
　● しおりの役目
　● 本の厚さで把握する、どれだけ読み進んでいるかという安心感
　● 嗜好品としての本
　● 装丁の美しさ
　● 読みやすい文字組み
　● フォントの大きさと、行間の隙間
　● 読みやすいフォントと見やすいフォント
　● 読み間違えないフォント、単語を覚えやすいフォントなど特定用途
　● 読みやすい本、覚えやすい本。
　● 本のレイアウトの場所で書かれた内容を記憶している
　● 出版日の関係で、海外の本が日本で読めなくなるなど、書籍リージョンの問題
　● 本の特殊形態としての楽譜の役目
　● 本の特殊形態として、裁縫の本、編み物の本とか

工学としての編集の大切さは電子書籍の時代も変わらずとても大切なもの。
電子書籍時代の「編集工学」の課題は何だろう。
オンラインメディアの編集とは違うもの。

そして図書館での電子書籍の扱いはどうなるのだろう？
ハリッポッター貸出の待ち行列に何百人も居たり、
図書館に１冊以上導入できないといった
書籍としての扱いとは大きく異なるのだろうか？

また、本に出会う方法も、青山ブックセンターや、カウブックスなどの
素敵な本にあふれたところで出会うことだけでなく、
Twitter での評判が気になったり、
本のことが書かれたものを読んで本を解説で選ぶことも重要になってくる。
一番信頼できるのは好みが似ている知人の評価だったりもする。

本に書かれた内容も、内容全部ではなく、センテンス一つ分の名言や、
技術的に役立つ引用などをきっかけに、
本全部を読みたくなる場合もあるだろう。

誰かが書いた文字の塊を読むことの楽しさは無くならない。
それは、書き手の文字を読み手が解釈して、
無限の想像力で解釈することができるからだ。

そして、電子書籍ならではの紙面レイアウトがあるハズ。
雑誌の場合、ページの見開きを考えて綿密にレイアウトデザインされている。
広告と本文、写真と文字との関係が絶妙なのだ。もちろんそこに書かれている内容が
面白く、役立たないと読まれないのだが、
その「読ませる」テクニックが駆使されている
そのテクニックを詳しく知ったのは、Jan V. Whit 氏の書籍。
今は翻訳本も出ている。
達人の雑誌レイアウトには、見開きを考えた流れが生まれるのだ。必読の書。

編集デザインの発想法 -- 動的レイアウトのコツとツボ570

ということで、デジタルならではの「本」の形を示唆しているいくつかの映像を紹介しよう。
これを見たら、きっとなにかを作りたく、書きたくなってくるハズ。

Mag+ (Bonnier R&D concept video)

What is a Vook? Vook: Read it, Watch it.

Microsoft's Vision of the Future

Sports Illustrated - Tablet Demo 1.5

Wired iTablet Concept App

New York Times Mobile on Air 1.5

Microsoft Courier Booklet

Apple Tablet PC for IKEA?

CourseSmart Tablet Concept

[&] iPad x iBooks x ePub

2010-01-30T01:50:00.007+09:00

アップル - iPad - ウェブ、メール、写真を体験する最高の方法。

Apple iPad が発表された。
とても熱っぽく歓迎する声も聞こえれば、
単なるスペック比較に終始し、別にイノベーティブじゃないと言う人もいる。
　実はハードウェアメーカーなら誰でも作れそうなスペックで、
　それもマルチタスク無しで、単なるハードウェアだけではない
　「環境」を提示したのが iPad の凄いところ。

iPAD の商標を富士通が持っていることも、
実は話題を集める戦略なんじゃないかと思ってしまう。

←富士通のiPAD

日本では Wifi 版が 3月末、Wifi+3G版が 4月に発売になる（公式発表）。
Wifi-3G版の方は GPS が搭載されているから、
少し重いけどこっちを買うことになるのか？
... と僕自身もスペックを気にしていることに気づく。

発表から少し時間がたって、冷静に色々考えると、
iPad は iPhone と比べて、画面のサイズが縦横2倍づつ、
面積にして4倍の大きさになったことにすぎないことに気づく。

面積が 4倍の iPhone でうれしいことは何だ？　それは「本」だ。
映画も大きな画面で観られるとうれしいけど、所詮はこのサイズ、
iPhone サイズだとパーソナルな視聴環境だけれど、
iPad だと一人だけの環境では無い。微妙なサイズと微妙な画質。
で、急に iPad と電子書籍の関係を調べだす。

iBooks の、なんとも気持ちの良さそうなページめくりのデモを見ながら、
Apple の iPad features のページの下にとても小さい文字で
"iBooks is available only in the U.S." と書いてあって、少し悲しくなる。
日本では iBooks Store は当分オープンしなさそうだが、
iPhone 用に書籍が出ていたように、アプリ化して販売するという道もあるだろう。

Jobs のキーノートスピーチで紹介された出版社は５社。
前日のテレビインタビューで iPad のことで口を滑らせた McGraw-Hill 社の名前は無い。
今頃、担当者がサンフランシスコの海に浮かんでいたりしないといいんだけど。

●Penguin
●HarperCollins
●SIMON & SCHUSTER
●macmillan
●hachette BOOK GROUP

◆Penguin http://www.penguin.com/
　- Wiki を活用した共同執筆の環境を推進している
　- 最近出版された全ての小説の第一章を無料ダウンロード可能にしている
　- Penguin Readers という多読用の書籍をたくさんだしているのもここかな？
　- 世界的には F1 本がうけている

◆HarperCollins http://www.harpercollins.com/
　- メディア王マードックの News Corp の傘下の出版社
　- 児童教育書に強い
　- サラ・ペイリン氏の自叙伝の Amazon Kindle 化に反対
　- 紙の本を先に出版し、Amazon Kindle 版の出版を遅らせる戦略をとっている
　- Amazon の（事実上安価に売るしかない）価格決定権に不満を持っているらしい
　- 電子書籍のマルチメディア化（ビデオ再生など）の賛成派

◆SIMON & SCHUSTER http://www.simonandschuster.com/
　- ドキュメントのオンライン共有サイト Scribd Store に参加
　- Scribd は Kindle 対抗馬。販売価格は高め。半分以上のページの立ち読み可。
　- ビデオと書籍を合わせた Vook というサービスをはじめている。
　- iTunes AppStore で Vook 版のアプリ(115円〜1200円) がリリース
　- ギャング本で儲けて、犯罪被害者の会に寄付するなど、話題性あり

◆macmillan http://www.macmillan.com/
　- 百科事典で知られる英国の出版社
　- 文学、科学、法律など。つまりはリベラル・アーツに強い出版社ということか？
　- 自然科学系の雑誌のグループ会社を持つ
　- 希少本も多いらしい？　よくわからない。

◆hachette BOOK GROUP http://www.hachettebookgroup.com/
　- 子供向け書籍や、ミュージシャンの自伝本や、図鑑、分冊百科事典など。エンターテインメント系に強い？
　- 電子書籍の発売を紙の本に比べて一ヶ月遅らせる戦略をとっている
　- ePub 推進派
　- フランスの出版社 Hachette Livre の傘下。フランス語・スペイン語の本に強い。
　- Time Warner Book Group を傘下に持つ
　- フランスを主軸とする世界一？の雑誌出版社

iPad の電子出版フォーマットは ePub.
Google Books も ePub を推進。
ePub は XHTML をベースとしたオープンな仕様で、インデックス付きの XHTML を zip でまとめたもの。
PDF と違って、画面サイズに依存しないのが特徴。表示中に文字を大きくしたりできる。
ePub を作れるツールとしては eCub, sigil,
市販ツールだと InDesign とか。InDesign で作成した書籍は
[Adobe Digital Editions] で雰囲気がわかる。

レイアウト、文字組がきちんとしているのであれば、
ePub でなくとも PDF でも十分読めると思うのだが、
Kindle の PDF 表示考えると拡大縮小はちょっときつそうな気がする。
心配なのは ePub の外字やルビや注釈、
教科書の漢文の返り点など日本語の特殊表記。
このあたりはさらに詳しく調べる必要がありそうだ。
ePub の DRM も Adobe の Content Server を使うものから、
なんちゃって DRM までいろいろあって、
iPad ではどうなるのだろう。iTunes の音楽ファイルと同じ感じなのだろうか？

iPad 上で動く iWork のデモをみると、
iPhone には無い、文字のレイアウトや文字詰めに関して
相当細かくコントロールできるように思える。
Core Text API 系が相当強化されているのであろう。

iPad の日本語フォントに関しては、全く心配していないのだが、
「縦書き」はどうなるのだろう？新聞と小説は永遠に縦書きだと思うのだが。
横書きで、英文字混在で読みやすいフォントと、
縦書きでこそ読みやすいフォントは違う。
ヒラギノは縦書きと横書きで、かなのフォントが違う。
手書きで文字を書くとき、縦書きだと漢字が思い出せるけど、
横書きだと思い出せない時がある。なぜだろう。

Kindle International 版が DX も含み使えるようになったが、
Kindle日本語サービスの展開はここ1〜2年はしないらしい。
日本の出版社の、権利処理、電子書籍用データの準備、
新刊書籍と電子書籍版の同時発行の風潮といった
流れが確立するのを待っているのだろうか。

Apple には単なる電子書籍サービスだけではなく、
辞書や読書の新しい体験を生み出してほしい。
もちろん、この役目を果たさなければいけないのは、僕ら開発者なのかもしれないけれど。

本を読むこととは？
最初の１ページから順番に読むこと。
これはもちろん小説とかミステリーでは当然のこと。
技術書であれば、習熟度合によって読み始めるところが違ったり、
逆引き的に、必要なところのみつまみ食い的に読んだり。
連歌的な複数の人が書いたものを読み進んだり。
名言集みたいにどこから読んでも感銘をうけたり。
持っていることに意味があり、使うときには必ず検索するための本だったり。

「本」は印刷技術のおかげで今の「書籍」の形をとっているにすぎない、
未来の「本」はもっと違う読み方、
もっと違う使い方ができる「本」本来の姿を iPad の上で見てみたい。

新しい出版を考えると、電子書籍ならではの特装本や、
1000冊限定本など、電子出版ではあり得ない事柄がウケるかもしれないし。

と、4倍になった時のユーザインタフェースって何だろう。
両手分の面積と、本一冊分の大きさと重さ。
UI Design のパターンと、アンチパターンを集めるとしよう。

テクノロジーとリベラルアーツの交わるところに立ち位置を置いて。

( Photo by Hokayan )

追記：参考資料リンク

Open Publication Structure (OPS)日本語訳
Open Packaging Format (OPF)日本語訳
日本語組版処理の要件
日本語Epubブックサンプル(横浜工文社)
ePub validator

[&] Tangible Bits / Hiroshi Ishii @ AXIS

2010-01-15T19:07:00.006+09:00

MIT Media Lab - Tangible Media Group

Tangible の概念を主流のものとした MIT Media Lab の石井先生の講演、
Media Lab, 新しい建物が出来上がり、12月に引っ越したそう。
５億円寄付すると、部屋に自分の名前をつけることができるそうです。

石井先生定番の英単語と日本語のごちゃまぜ講演。
今回ならではの新しい気づきは
"atom hacker"
インテリジェントな新しい素材や材料が生まれるのを待たずに、
デザインを初めてしまおうという新しいプロジェクトについての紹介。
僕らの分野でもこれをヒントに何か新しいことができそうな予感がする。

-------------------------------------------------------------------
栄訣の朝 Tangible Bits / Hiroshi Ishii / MIT Media Laboratory
-------------------------------------------------------------------
なぜ自分が仕事にとりくんでいるのか、
どういう未来を考えているのかを
共有しながら、議論を頂けるとうれしい。

若い学生さん、デザイナーさんは？
未来は皆さんの上にある。
ぜひ、何か今日の講演から持って帰ってもらうものがあればうれしい。
どうぞ、割り込んで質問して欲しい。

英語、日本語、なんの言語でも。
デザイナーは一番こわいオーディエンス。
ビジネスマンと話すなら大丈夫なんだけど。

どういうテーマで話すか？
９つのテーマで話す。

「表現」
表現は本質的、ある種、どういう解釈をするのか。
宮沢賢治を例に紹介。
プロセスにひかれる。
明朝体９ポイントの奇麗な文字で読んだ。
宮沢賢治記念館で、手書きの原稿を読んだ。
苦労のプロセスが見て取れる。
身体の痕跡がキャプチャーされている。
その表現に深い感動を覚えた。
なぜ、文庫本、印刷でしか読むことができなかったのか。
大量印刷の中でそぎおとされてしまったもの。
表現者が嘆いたことを聞いたことはない。なぜ？
きわめて効率化されている。
標準化の中で消えてしまうもの。
本、フィジカルなもので持ち運ぶことができる。
なんども何度も読んだ、読み手の痕跡が文庫本には残る。
読み手の痕跡を残すことができる。
Kindle には痕跡さえ残せないものになっている。
表現者、鑑賞者の本質的なものを考える。

「想像」
感動は何から来るか。
いかにイマジネーションを喚起するか。

「感動」
何が感動させるか。
空想する隙間の無い完全なピクセルのハイビジョン映像ではない。
頭に浮かんだ想像にかなうテレビはない。
記憶を想起して作品として完成させるか。

「子瓶」
●musicBottles (jazz)
http://tangible.media.mit.edu/projects/musicbottles/
どうしてもあうボトルが無くて、
実際にガラスをふいて、検討した。
割るとおなじ物が得られない。一個しかないもの。
パーソナルな理由。
天気予報の入った個瓶を母親に贈りたかった。
（Origin :Weather Bottle)
醤油の瓶をあけると、香りが漂ってくる。
基本はマシンに触ることなく、理解をデザインする。
コンピュータを使いこなさないと仕事できない時代ではなく。

「表現」
粘土。
●Illuminating Clay
http://tangible.media.mit.edu/projects/illuminatingclay/
粘土ほど、フレキシブルなマテリアルは無い。
コンピュテーションできない。
粘土のアフォーダンスを生かしたプロジェクト。
新しいマテリアルになる。
光があたると、コンピューター的な表現ができるようになる。
ランドスケープデザイン、水がどの方向に流れていくのかを形で分かる。
レゴを使った実験。バーチャルな世界に即反映する。
フレキシブルにランドスケープに入り込む。

●Sand Scape
新しいテクニックで、ビーズを使った。
http://tangible.media.mit.edu/projects/sandscape/
子供に人気がある。
ガキのことの砂遊び。
ビーズが散らばって、拾い集めなければいけなかった。
インタラクティブな表面になりうる。
建築家ゲーリー。フィジカルなマテリアルを直接つかって設計し、
弟子が図面にする。
コンピュテーションは大きな役割を持っている。
上流のマニュピレーションしやすいのが本質的なもの。
デザイナーもアーティストも、Physical と Digital のどちらかを
選ばなければなかった。
ダンサー、コレオグラファー、
描くことは大切。
いったんデジタルに行ってしまうと、物理的なものが失われてしまい、
戻ることができなくなる。
すでにあるマテリアルのいいとこどりをして活用する。

「変化」
宿命だと思う。
スピードが速くなってくる。
企業と議論する一案のテーマ、
どこに向かっているのか？
ゲシュタルビューを持たないと自分の位置も見えなくなる。
変化していく大変な時期である。
大きくアンテナをはって、自分たちで未来を発信しつづける。
人々に対して、早期警戒システムとして機能しうる。

北斎の絵。
The Great Wave off Kanagawa (Hokusai 1832)
ファンドを集めないと行けない状況。
研究の価値を伝えるのが難しい。
静かに存在しているのが富士山。

Vision
Users' need
Technologies

客に欲しいものを聞いて、欲しいものが言えるようなのは未来ではない。
クォンタムリープ
自分たちが思い込んだものを作った。
周りに聞いても意味がない。
マーケティングは大切、売るためには大切だが。
ビジョンを支えるものは「アート」
アートから数多くのインスピレーションを得た。

なぜか？
ライフスパンを考える。
技術は１年で古くなる。
Application は 10年で古くなる。
Vision (Art) は 100年保つ。

0.5% 優れているものに青春を費やすのも大事だと思うが、
自分が居なくなっても貢献することに全力を尽くす。

新しいアプリケーション、価値観を作ることができる。

「存在」
基本的な仕事。
タンジブル、存在、確信させるもの。
存在の確かさ。映画みたことある？
バーチャルな世界に情報が吸い込まれる。
「鍵」鍵束は感じることができる。存在の確かさ。
どこにどのキーが有るのか分からない不確かさ。
いかに存在感の無いものに存在感を与えるのかがタンジブルの役目。
目は受け身で、情報を得ることができる。
クリエーターは自分の身体を使わないといけない。
手がとても大事。

Orrery : Tangible Representation of Knowledge
骨とか肉がきしみながら動く惑星時計。

いつもそろばんの例を出します。
そろばんは 10進数を表現している。単なる「玉」
入力と出力が一致している。

Tangible Bits
抽象的な情報に形を与えてみた。
GUI と TUI
Visual - Tactile
General Purpose - Special Purpose
Remote Control - Direct Manupilation
MIT に居たとき、マービン・ミンスキーと聞くと AI（人工知能）が 0.5 秒で思い浮かぶ。
世界のトップ 100 人の中にそういう反応が得られればテニュアとして認められる。

GUI と全く反対なものとして TUI を考えた。
結果的に GUI は水の底に情報が沈んでいる。
TUI は基本的なものは氷山として水の上に見えている。

「触」
InTouch
http://tangible.media.mit.edu/projects/intouch/
"Reach out and touch someone"
普通のオブジェクトをコントロールする。
ローラーとローラーがネットワークで繋がっていて、感じることができる。
自分の信号をおくりつつ、反発を感じることもできる。
それまでのテレプレゼンスをフェイクなんだがスクリーンの裏に表現しようとしていた。
表現せずに表現してみた。
見えない存在を見せる。
論文は落ちた。アーティストにはウケた。
ある種メタなコンセプトは科学の領域では扱えなく。
どう存在を示すのか？

「重力」
重力は我々を惑わせるもの。
もし Media Lab. が宇宙船だったら？
ある瞬間に無重力環境を作ることができる。
自由に想像ができる空間。
ブラックホールが突然現れて、予測不能なくらいなものが現れている。
Google がそう。
あちこにちブラックホールが現れている。
どう吸い込まれないように、宇宙航行していくのか？

思考の多くはメタフォリカル。
世界はメタ。
全てには意味があって、デコードすると、新しいジャンプが生まれる。

セキュリティがしっかりしている会社の人は？
会社から gmail もだめ、google docs もだめ、。。。。
ペリー提督の黒船。これが Google Wave.
会社は鎖国状態。
日本には出島があった。
出島に相当するものは何なのか？
核先制攻撃症候群？

こういう話を日々学生とディスカッションしている。
Media Lab は未来にかけている。
自分たちが欲しいという未来を規模が小さくてもいいので作っている。
デモする、気に入ってもらう。
それによって影響力を公使する。

少しの人が「緑がはやる」といえば、流行るけどそういうものじゃない。
The best way to predict the future is to invent it. (Alan Kay)

PingPong Plus
http://tangible.media.mit.edu/projects/pingpongplus/
卓球は相手にミスさせて勝つスポーツ。
もっと平和なものが作れないか？

はじめ MIT で落ち込んだ。学生の方がよっぽと優秀。
その時に卓球を思い出して、学生達に勝った。
卓球台を買うのに研究費を使ってしまったので、
ロンドンで卓球するのが仕事になっておいしかった。

深いことを言う。身体の痕跡。
卓球のラケットは、多くのことを語っている。
使い続けるうちに身体の一部になる。
全てがインビジブルになるのではなく、
二次的なツールは隠れていてい。

フォアグラウンドとアンビエントがこれからの課題。

「感動」
I/O Brush
http://web.media.mit.edu/~kimiko/iobrush/
Kimiko Ryokai
二週間で考えて作って論文書いたもの。
RGB のドライな色ではなく、現実世界の色から新しい織物を織れる。
鮮やかな色を見ると感動する。
その色を利用して、表現する。

絵画というのは二次元の世界にスタックしたもの。
アートから学び、アートに返そうとするもの。
大事なもの。
アートは熟成している。
技術で新しい多重のメディアを作ろうとしている。
人々をどうインスパイアするのか？
八百屋は素晴らしいパレット。これでどういう表現ができるか？
いかに人々をクリエーションに向かわせるのか。

「未来」
タンジブルの限界。
ピクセルはスクリーンの上で自由に扱える。
atom は形は変わらない。
夢見ているのは、将来きっとマテリアルが変化し、
プログラマブルのマテリアルができる。

atom hacker が現れ、とんでもないマテリアルを作るハズ
テクノロジーが来るのを待たずに、デザインしてみる。

餅：簡単にコントロールできないけど、形が変化する。
そんなマテリアルがあった時に、何ができるのか？

また始めたばっかりのプロジェクト。

「空想」
SF読む人！　〜いいですね〜

「光陰」
I/O Bulb and Luminous Room
http://tangible.media.mit.edu/projects/luminousroom/
風（流体）の表現を見ることができる。
はじめてタンジブルが行けそうなことがわかったあ。

2054 Minority Report
MIT の卒業生 John Underkoffler がデザインしたもの。

g-speak
http://web.mit.edu/invent/iow/underkoffler.html

John Underkoffler が院生だったときに考えたもの。
空間に充満する情報を自由に操作できる。
John はトムクルーズを使ってデモビデオを作った。

The Future is Already Here - It's Just Not Evenly Distributed (William Gibson)

「独創」
何が大事か？

　本質的な問いを発することが重要
　独自の視点から新しい本質的問題を見いだし、新領域を開拓すること

　ビジョンがエンジン
　技術／ニーズ駆動

「協創」
デザイナーを雇う、アーティストを雇う、というのは間違い。
頭の中でアーティスト、エンジニア、頭の中で高速にスイッチしないといけない。
全部マスターはできないが、基本的に知ることはできる。

「競創」
NHK の対談で話が８時間もりあがった。

100m トラックを人より速く走ることは、
真の競創ではない、誰も分け入ったことの無い原野を一人切り開き、
まだ生まれていない道を一人全力疾走することこそが競創だ。
そこには観客も審判もストップウォッチも存在しない。

「出る杭は打たれる」
「出過ぎた杭は誰も打てない」

「再起」
MIT に行ったときの条件。
ネグロポンテが提示したもの。
今までの仕事を全部捨てろ。
その挑戦によって、タンジブルを始めた。

「燃料」
そのためには燃料がいる。
「飢餓」
そのための燃料は飢餓感。
ビジネスに飢餓感を持っているか。
食べられるか食べられないか瞬時に判断できるか。
それがものすごいボトルネック。

「屈辱」
屈辱はプライドが無いと屈辱にならない。
いつま返してやる。
竹内まりあ「マンハッタンキス」そういうマインドセット。
自分に対して誇りを持つと屈辱感が多くなるが、
そういう内燃機関を作る。

「誇り」
「情念」
長距離走。
「問」
「何故」という問いが大切。
５回、７回、問いを続ける。
「哲学」
哲学の次元までいく。普遍的。ここまでいくと Ph.D がとれる
「未来」
１００の人がいれば、１００の未来がある。
大事な未来。

The best way to predict the future is invent it.

2050年違うところに居ます。
2100年、ここに居る皆さんも亡くなります。
2200年、孫かひ孫がいっぱいいる人達に何を残せるか、
どのように思い出してもらいたいか。

「死後」
円満退職で人生がおしまいではない。
未来に何かを残す責任がある。

Q & A
過去最高の質問は「どうやったらスポンサーになれますか？」
新しい MIT Lab の建物ができました！ 12/1 に引っ越したばかり。

Q：プロフェッショナルの仕事の流儀、１００人の日本人の番組で感動しました。
　すごい館内を走り回っている印象。あれだけいろいろ考えているのになんで走り回れるのか？
　なぜ走り回る？
A: Life is Short のこっている時間が少ないから。
　　やりたいことがいっぱいあるから。1分一秒無駄にしたくない。
　　ごはんと牛乳。
　　MITは１分で病院に行ける。健康的な人生なんじゃない。

5億円で部屋に名前が残せます。

Q: メディアデザイン研究所。古川さんの研究室。
　ものごとの本質を見てデザインするという。楽しく話しをきくことができた。
　デザインをすると、意味を聞かれることが多い。
　アーティストは好きなことができる。

A: 人生そんなに甘くない。「デザインは語らない」
　アーティストは作品が語っているといいわけできる。
　デザインしたもののストーリーを語る努力をしなければいけない。
　ビジョンを語るには、戦略をたてて、理解して伝えないといけない。
　アーティストとして自己表現することと、未来に提示しないといけない。
　苦しみを喜びとして感じられるようになったら面白い仕事ができる。
　最終的に行き着くことは同じ。

Q: インターフェースの話。わからなかったもの。
　　今の人、世界中で流行っているインタフェースはキーボード。
　　地域によって違ったものがあった？
　　筆とペンがあった。将来またできてくるのだろうか？

A: かつて色々な表現方法があった。
　一方でいろんなジェネラルなものではなく、スペシャルなもの。
　何が流行るというものではなく、新しいものを作るとそれが「筆」になる。
　どういう表現をするために、どういうものを作るのか？
　iphoneとも違うものを。
　スイスアーミーナイフ一本で料理するかというとそうではない。
　包丁もナイフもいろいろある。
　面白いもの。これからのスタンダードを提案していって欲しい。

Q: ポストタンジブルに関して。
　　こたつ、そろばん、昔からあるものが好き。
　　私たちがこれから使うもの、道具にビジョンが宿っている。
　　こたつに家族があつまって YouTube が見られる？

A: 今はいろんな可能性がある。
　　こたつで Youtube も実現できる。
　おもしろいだけのものを作るのは簡単。
　アーキテクチャが必要。
　まったく新しい、習うことができるランゲージを考えないといけない。

[&] 2010 CES (CES Unveiled)

2010-01-06T11:47:00.003+09:00

2010 CES: Press Events

CES 展示会は明後日からなのですが、
今日からすでににぎわってきています。
CES Unveiled で目玉展示をつまみ食い的に見ることができます。
明日からは１時間区切りのペースで、各社のプレスイベントが開催されます。
プレスイベントは、展示会だけだと見逃しがちな細かな製品や話題まで
しっかりと説明してもらえるところがいい点です。

entourage-edge という電子ブック。片面は電子ペーパーの白黒表示
片面は、カラー液晶の Android 画面。
本に書いてあるリンクをクリックすると液晶画面に画像や動画が映るという
もうこれは本の域を超えている。
折り畳んで片面使いもできる。タッチパネルにペンで書き込みもできる。

PARROT の空飛ぶヘリのオモチャ。iPhone でコントロールできる。
画面がなんとも AR っぽい。
iPhone が無くてもカラフルな筒を画像認識？して、高さをコントロールすることができる。

PocketRadar は手のひらサイズのスピードメーター。
走っている人の速さや、サッカーボールの速さとか、手軽に計れるようになる。

ThinkPad の新しいノート。思った以上にハイスペックで $899 とのこと。

ThinkPad の新しいネットブック。ARM ベースで Skylight Linux が載っている。
3G 対応で $499 とのこと。

marvell では Spring Design 製の nookじゃない方の電子ブックと
ARMADA の展示。
Spring Design の電子ブックは nook とそっくりだけど
（訴訟の経緯から考えて逆か。nook がそっくりなんだ）
nook を見て予想していたよりすごく薄くて、思ったよりも小さい。
下部の Android が動いている部分は普通の Android,
日本語の Web ページも表示できます。

置くだけで充電できる PowerMat

The Sharper Images の置くだけで iPhone が置き時計になるグッズ。
こういう脱力グッズがあるのも CES らしいところ。

VNA のフルキーボードつきゲームコントローラ。わけわからん。

そんなこんなで、CES レポート続きます.....

[&] 2010 International CES

2010-01-05T12:22:00.001+09:00

2010 International CES, January 7-10

CES 参加のため、Las Vegas に来ています。肌寒くて乾燥してる。

今年の目玉は、
DELL の Android 搭載ネットブック、
HTC や freescale も Android タブレットを出すらしい、
電子ブック系も Amazon Kindle に続いて各社リリースし始め、
Android と電子ブックのが注目株かな。
立体視関連は今年はさらに勢いを増してきそうだし、
エコを売りにした家電もますます多くなってきそう。

会場の様子は
[engadget] や
[c|net] が大量にレポータを送り込んでいるので、
網羅性は高いはず。

はてさて。CES は「未来」というよりも「今」を知るイベント。
今年も、だたっぴろい会場をひたすら歩きまわります〜

[&] Fitbit

2010-01-03T20:53:00.002+09:00

Fitbit

いわゆる IT系のデジタルサービスと、
健康／ヘルスケア／スポーツ　といった分野が少しづつ繋がってきている。
Fitbit は TechCrunch50 で話題になって、なかなかリリースされなかった
フィットネスガジェットとよばれる $99の電子機器。

人の動き、睡眠、カロリー消費を日々記録し続けるデバイス。
ワイヤレスデバイスであることも、大きな特徴。

ソーシャルな要素もあって、自分と似た体型の人と比べることもできる。
腕時計式ではなくクリップ式なのも手軽なところ。

デジタルデバイスを活用して、質の高い「眠り」を手に入れることが、
これからの流行になるかもしれないと思った。

[&] nanoblock

2010-01-02T22:33:00.001+09:00

nanoblock｜カワダ

LEGO ではなく、ダイヤブロックの流れを組む
超極小ブロック [ nanoblock ]

ブロックは、ただでもチマチマしているのに、
この nanoblock はさらにチマチマしている。4x4mm ブロック。

まあ、結構複雑なものを作っても、
それほど大きくならないところが良いし、価格も手頃。
一つ一つが小さいので、より細かな細工ができるのがメリットか。

カラフルなバージョンだけでなく、
モノトーンバージョンや、
渋い色を集めたダークトーンセットなどもいろいろ使えそう。

その上、長野県東御市の自社工場での一貫生産ですと。

白い北海道犬（アイヌ犬）のモデルに
「お父さんとも呼ばれる」と書いてある。それって......

[&] Sculptural Photography

2010-01-02T01:10:00.001+09:00

Sculptural Photography - today and tomorrow

Sculptural Photography,
写真でもあり、彫刻でもあり、写真でもあり、彫刻でもある。
この現実とも虚構とも言えない不思議で不安定な感覚は何なんだろう？

Szymon Roginski氏と Kasia Korzeniecka 氏による広告表現の一つ。
服飾系のブランディングのひとつの表現方法。
ものすごく手間がかかっていることが分かるのだが、
その大変さが微塵も感じさせないところが、作品の凄さかもしれない。

"Project UFO" という UFO が居そうで居ない写真集も不思議すぎる。

[&] Happy New Year (2010)

2009-12-31T23:48:00.006+09:00

Happy New Year (2010)

あけましておめでとうございます。
今年も素敵な年になりますように。
皆にとって素晴らしい一年でありますように！

[&] SIGGRAPH Asia 2009 (Joe Rohde)

2009-12-19T15:41:00.001+09:00

Story structure and the Design of Narrative Environments
Joe Rohde / Walt Disney Imagineering
----------------
ディズニー
入社して 30年ほど。
物語の構造を語る環境のデザイン。
ディズニーの場所は非常にこの場所がどうして成功しているのか
普遍的なのはミステリー
ブランドアイデンティーや、キャラクタだけが原因ではない。
さまざまな要因がこの空間にあるから。

空間デザインの話をする。
もちろん事例としてディズニーを参照するが、世界中の例を提示する。
ものを語るスペースの硬化性を話したい。

物理的な設計、建築を行なうことは手がけていないかもしれせん。
仮想空間や、デジタルインタフェース、CAD、コンピュータを使ったデザインの参考になるはず。

私の経験は、ディズニーのアニマルキングダム。私の経験の中心となるもの。
この他のパークとは非常に違っている。
本質的に何かが違う。主役は動物であること。
本質的には不可能なもの。テーマパークはあるべきものを構築していくもの。
最も根本的な側面を評価していかなければいけない。
動物を扱う困難をどう解決していくか。

テーマパーク 600エーカー以上もある
自然がシンボルである。
人工的なものもあるが、自然に見えるものでしめられている。
意図的に、瞬時にデザインをこの中で示している。
奥深く、自然という世界の中で、木が単なる木ではなく、自然であると認識して欲しい。
パークはバイオロジーの世界、生物学的たとえが非常にたくさんつかわれている。

動物由来の経験、いろいろな要素を入れている。
ファンタジーは外している。
このテーマパークはできるだけ本物志向、動物たちのための環境を作っていった。

動物の周りは動物と一体化している。
調和をとるために、動物達と共存する。
意図しない事柄がおこった場合、
普通のテーマパークならば、全て理想的な問題の無い、普遍的な環境。

動物が居る環境では違う。
動物の営みの前を車で通っていくことになる。
どういう行程を？
新しい考えが必要になった。
アニマルキングダム、世界６０ヶ国からの、世界の動物の保護に貢献している。
動物保護の考え方も組み込まれている。
この場所がどういう風に動いていくのかストーリーを考えた。

「分類」「語る」ということは
人の考え方の根本にある。
データをもとにモノを語っている世界の中にいる。
環境というのはモノを語ると脳は消化しやすい。
何をもってストーリーとするのか？
ストーリーはフラクタル構造になっている。
なんどもなんども繰り返しになっている。
どんどん小さく小さな段階になって、詳細部分が繋がっている。
ストーリーを経験している。
ランダムでは無い、一貫性がある。

シダを使った例。
CGのシダ、数学的に非常に完璧なフラクタル。
天然のシダは不完全だからこそ、興味深い。
現実には言語の制限、形の制限がある。
だからこそストーリーは興味深いものになる。
虫に食べられたり、病気になったりする。
不規則性があることによって、興味深いものになる。

フラクタル、
根本的なものはテーマ。
まず先にくるのがテーマ。非常に重要。
それを行なってからストーリーを作る。
この環境の中にいる。プレッシャーやゴールに囲まれている。
物理的な成果を生み出していかなければいけない。
簡単なのはチャレンジに取り込むこと、
ストーリーワークをその前に。
物理的なマテリアルがなぜそこにあるのか。
テーマを決めるとパターンが決まる。

例。
主題「日本」ここに多くの人がいる。
この日本のイメージは無限にいろいろある。
テーマが無ければ、日本と言っただけではいろんな意味になってしまう。

テーマがあることによって、普遍的なものになる。
自然の力は否定することができないのもひとつのテーマ。
これを「日本」という主題にあてはめてみると、日本の解釈に繋がる。

日本の自然の力は、小さな漁村に代表される。など。
まずテーマがあって、ストーリーが作られる。

根本的なテーマとして「動物が自然の中になる内在的な価値」を表現。
自然の中にある価値は、動物の価値と矛盾をきたしてはいけない。
選択において、
例えば自然の価値を得るためには何をしたらいいのか？
建造物の良さ、ランドスケープの良さをとりこまなければいけない。

ランドスケープの要素とは？
これに自然の価値が無いとしたとしても、
人間がコントロールする要素がある。
ランドスケープの良さ「季節的」直線的なものも。

自然の価値をいれたかったら、ランドスケープの要素は、
季節が無いのか？季節があるのか？
手入れされていない風なのか？手入れされているように見えるのか？
直線的なのか、曲線的なのか？
デザインも自然でなければいけない。
ランドスケープ、風景は偶然として生まれたように見えること。
たくさんの人が関わっていく。難しい作業。

建造物も、ランドスケープとマッチしていなければいけない。
建造物が自然に従う形でなければいけない。
非常に小さなところから始まる。
例えばドア
木で作るべきなのか？磨くべきなのか？ドアノブは？
ドアノブはスチールなのか、ブロンズなのか？　ブロンズの方が自然にあっている。
細かいディテールから調整していかなければいけない。
すべてが調和を持って基本的なフラクタルなプログラムに戻っていく。それがテーマ。

一つの物語的空間にもどっていく。
自分たちが信じる空間。
存在、概念、真理としての想像。現実としておこっていないかもしれないものとの間にある。

この物語の中のコンテキストでは、実在するもの。
物型知的空間としてストーリーの中に存在する空間。
例えば天国を表す、自分たちが知っている機能だけではない。
物語的空間は、全てを必要とするとは限らない。

蘇州にある中国の傑作の芸園。Humble Administrators Garden, plan
メンテナンス用に使う通路、ゲスト用の通路。
物理的なリアリティそのものは重要ではない。イリュージョンとして。
庭園はどうあるのか、物型知的空間として表される。

ジオメトリとして組織として作られるのではなく、
アイデアを集めてつくられる。
つまり、主観的な見方をしてもらう。
我々のキングダムの「アフリカ」エリア。
メンテナンス用のエリアもあれば、配管もある。現実がある。
物語的空間には存在しない。
物語的空間は、永遠に続きそうな自然のランドスケープ。

物語的空間が何であるか考えると、
空間の中心にあるものではない。
われわれの中にある、内部の世界。
我々の精神と、外側にある現象との間に人間が存在する。
物語的空間は、我々が中心にいるような間隔がえられる。

非常に強い機能的なものが入っている。
本質的なデザインがある。
物語はコミュニケーションが必要。アイデアを伝えていかなければいけない。
様々な意味がある。
それが空間にもある。空間の言語を作っていく。
それを組み合わせていく。
物理的空間に行くときに、空間が何かを話しかけていることがすぐにわかる。

パリの庭園。
同じような環境にある２つの庭園。
空間の中で訴えている。
プランが必要。
まず、物語的提案から始まる。
詩のようなアイデア。
それが基礎となって、建造物となっていく。
1990 年の時につくった、アニマルキングダムの概念図。
カードを何枚もつくって、何ヶ月もかけて、キングダムを作り上げた。

イメージをつくりあげるにあたって、
モトになるものが何かをつきつめた。

「詩」のようなもの。
感情の浸透、避けてはいけないもの。
ディズニーのあにめーた、眠り姫を作った人。
お城が雰囲気にとけこんでいる。
何か違うものを作ろうという意図がとけこんでいる。
機能的な教会としての空間をかんがえてみるとする。
空間は「比喩」、生死の比喩でもある。
物語空間を作ろうといもの。教会としての用は比喩の後にくるもの。

強大なステートメント。
主に文化の強さ、民族に属するということ。
現代の瞬間から、遠いかこにつながりまでの物語的空間。

キングダムの中に山がある。
巨大な空間の中で大きな意味がある。
皆の間隔に訴える。
物理的空間ではなく、物語的空間にある。
人は物語の一部、間隔も物語の一部。
外側からみることはない。

劇場で仕事をしたことがある人。
一貫性。
何かアクシデントがあってはいけない。
目的があって、すべて小さい事柄まですべて意図的におこなわれる。
観客がストーリーの一部でないといけない。

視覚的な環境のアピール、匂い、香り、空気の動き、触覚、すべてが仮想の設計以上。
たがいにぶつかりあっている、現実世界などデジタルテクノロジーでも。
触覚的間隔にも対応できるようになる。
空間体験、完納性がこの物語の中にある。

巨大なシミュレータ、19フィートくらいの長さのある蒸気で動くもの。
パリで作られたもの。
Mare-Orama
地中海クルーズのシミュレーション。
クルーズに出かける。蒸気がつかわれており、海に乗り出す。背景にはスクリーンロールが表示される。
別のドアからでると、トルコ風のもてなしが待っている。
これも物語的環境の一つ。
感覚に訴える。

この結合、物と、行動と、意味が結合すると、ストーリーが意味をもつ。

子供の頃から、映画において、
なぜこのショットを残しておくのか、捨ててしまうのか考えた。
監督がダメだしをするアクションの違いはほんのすこししかない。
髪を動かしたとか小さなディテールを重要視する。

空間を進んでいくのは、文章を読みすすんでいることにつながる。
Humble Administrators Gard, Souchou ストーリーボードの考え方がある。
魅力的になるように、足を止めてしまうように設計されている。

動くとまた別な景色があり、動くとまた別な景色がある。
庭園の中にはステートメントがある。

ローマの Pantheon の例；
このパンテオンは、当時は非常にコントロールされていた。
魔法の世界のように統制されていた。
皆がローマにきたら観に行くもの。

ドアをとおった入っていくと、何か大切なものがあるという雰囲気を醸し出している。
門が中央にあることによって、その先の建物を見ることができない。
アーチの門を通ると、実際はどこにでもあるような典型的な建物しかない。

中に入ると、空間の現実に気がつく。
空間は設定されてた、コントロールされていたもの。
建築物に含まれているもの、自分はそこに居るんだという圧倒的な経験をあたえている。

フラクタルには中身がある。
物語環境がうまくいくためには、
直感的にナビゲーションできる力が必要。
認知の状態は別なもの。
フィクションのパラドックスでもある。

映画を観に行く、映像を見ていく。
非常にドラマティックな瞬間には、感覚が詰め込まれている。
我々の認知の能力は、そこで何が起こっているのか分析してしまうが、
物語として認識しなくてはいけない。
ロジックは動いているが、現実には触れない。

建物のファザード。
窓も不定形につくられている。

「意味」を考える。
自然とどうよう複雑である。
ここには反復性が無い。
概念的なフラクタルの関係性がある。

すべて直感的なナビゲーションにつながる。
練習しなくてもいいもの。
脳の中の直感的は働きが機能してくれる。
重要な要素。
テーマパークでも、直感的に分かることが重要。

地図は
直感的なナビゲーションをさらに細かくしたもの。

シンボルや比喩が使われて方向性を示してくれる。

パリは非常に多くのテーマがある。
建物ごとに、多くのパターンがある。
例えば、自分が街のどこにいるかわからなくても建物を見れば居る場所がわかる。

空間と活動には「比喩」がある。
あるものの印象を他のものに対しても持つ。

たくさんの入り口がある。
これら全てが「非優」になっている。
多くの遺跡の入り口は「口」が比喩として使われる。
ビジネス的にみれは否定される。
異質な考え方。

比喩は人の原始的なもの。
自分で体験しなくてもいいもの。
体験しなくても見ているだけでも感じることができる。
感じることができる遺伝子は共通。差別や区別がなければ。
感情を移入することができる。

これらが全て比喩になる。
自分の体での感覚、感情移入できる。
木が悲しそうだな。とか。
本当に感情的な方程式を生み出すことができる。
自分たちとの間との感情移入。

物語的感覚、
作者がいかに上手でもパワーは読者の側にある。
まず、膨大な情報、リッチに書かれたテキスト情報。
これらの情報は意味をもっていなければいけない。
さらに読みやすいこと。

情報の密度によって非常に広範囲な人々に伝える。
個人が物語を作り出すこともできる。
物語に命を吹き込むのは、読者。
読者が何を感じつのかは分からない。

色々な場所、オリジナルの物語
環境は新しい意味がある。
重要で無い情報は中央に残って、あらたな意味をもたらすことができる。

オーナメント：装飾の話。
近代のアーキテクチャの中では装飾は見過ごされている。
やりすぎ、道徳的でないと言われることがある。
建造物とは関係ない。
キャパシティから物語的情報が得られる。

ギリシャ、建造物
すべて当たらし意味をもって、わし達に語りかけてくれる。
イメージとして復号した人はいない。
意味がもうあまり関係ない
他のアイデアをもたらすことができる。
存在の意味が眠っている。

装飾を使うことによって、非常に役立つ、直感的なナビゲーションができる。
自然に考えること無しに、空間を動き回ること。
エッジの部分を見たり、開口部を見たり。
空間を物理的に歩いて、さまざまなところに気がつく。
同時にあるアイデア、ある物語のナビゲーションを行なっている。
これがオーナメント装飾の一つの作り方。

もう一度、モダンなスペースを学びださないといけないかもしれない。

複数の意味の例に繋がっている。
深さ、ストーリーの分解性に繋がる。

この中でどれが、当時の意味そのままなのだろうか？
場所としてディテールとして全く新しい役割を持っている。
様々な解釈のレベルがある。
これは新しい投資といえるもの。将来の設計。
意味の解釈。
何かを作る、長期に保存したい。５０年は持たせたいと考えて作る。
この時間の中で個人としてのパーソナリティ、社会の成長はわかない。

環境の中に複数の層を作り出すことで将来も生き残るようにする。
チケットのファザード、キングダムのもの。
これはローラーコースタ。自然の価値が入っている。
チベットの伝統、雪男が聖なる土地を守っているというコンセプトが入っている。
土地の中に根付くもの、なんらかの儀式やレセモニー、伝説的なもの、
色々なものがビルの中に層として組み込まれる。

アトラクションを作るにあたって、山とバランスをとるものである。
さまざまなレイヤーでのバランスを考える。
例えばその時代、過去を意味をもたらす、たくさんのレイヤーの情報を持ったもの。

象のブロンズ像。この何回も繰り返す牧草のアイデアを組み込んでいる。
シンボリックな表現が様々なところで見られる。
解釈ができない人もいる。
文字で伝えるようにもする。別の観点からも理解できるようにすうる。

物理的なコードと、本来の自然の価値の間の矛盾をもたらしたもの。
物質世界と自然の本来間にある矛盾。

この環境の背景を示す。これはファンタジーではなく、
ドキュメンタリーのようなことが現実世界で起こっていることを示す。
アトラクションの中で、他のものを無視することもある。

物語的環境というのは、俳優のような存在になる。
動機があって、意味があって、意図がある。
いいパフォーマンスをするには、背景が必要になる。
ステージにあがって、自分の役を演じる。
俳優としては、全てを理解をしなければいけない。
なぜお茶を持っていくのか、すべて背景を知らないといけない。
最終的な幻想としては、演じているのではなく、役の「執事」である。
悪いパフォーマンスであれば、理解していないことが見てわかる。

高校、大学で舞台に載ることがあるが、本格的な俳優の経験は無い。
いい俳優として何かステージの上でしようとすれば。
その時、相手が居て、相手がいい俳優であれば、自分の演技も良くなるのがあきらか。
現実性を受け取ることができるから。
物語的ストーリーは、相手の良い演技をする俳優であるべき。
パフォーマンスがなじまないことが無いよう。
そのストーリーの中でより豊かに想像することができる。

パリンプセスト。という言葉。中性の言葉。
羊皮紙上に文字を書いていた。
新しいテキストを書くために、羊皮紙を削り取って書いていた。
古代文字の上に文字を書いた。
過去の記述が残っている。足跡が残っているようなもの。
これは動かないもの。過去がどうだったのか？
過去の行動の足跡として残っている。これは素晴らしい俳優と同じ。
物語を意図した空間には、過去の行動の足跡が残っている。

そこに唯一の話が存在する。過去の活動がアクションとしてある。
キンダムの一部。レストランなのだが、古ぼけている。
古い郵便ポストが設営されている。
着いたときに、古いアクションは起こっていないが、自分がともに存在することに意味がある。

UHURU 1961
何かの勢いでかかれている。

ぶつかり合いを示している。
観光産業でお金を作っていく。
伝統的な建物、伝統的な使われ方をする。

あるアフリカの海岸のビーチの例
人の存在を示している。
自然の本質的な価値を擁護している。
社会的なメッセージも含まれている。
ドラマチックな要素。

もうひとつストーリーについて考える。
ストーリーは脆弱なもの。
寒すぎるとか、椅子が座りにくいとか、
自分の目前で１億５０００万ドルかけた映画が上映されていたとしても、
物語的環境に入り込むことができない。
脆弱なもの。
心の状態は全てストーリーであると認識してしまう。
記憶、感覚の中に貢献しないと、ストーリーが破綻してしまう。

よく見られるのは映画の中で録音用のマイクがあり、
画面の中にそのマイクが見えてしまうと、矛盾。全く関係の無いもの。
仕事の中で成果物、制限、コスト、スピード、意図、の中で
矛盾を管理するのが重要。

アプコットセンター。
幻想の物語。自分を想像してフランスにいることを考える。
似合わないホテルを建ててしまうと、まったく違う物語になってしまう。

その一方、成功とは？
成功すると感情的に大きなインパクトがある。
意味の幅、フラクタルの中の小さな変化。

我々は物語を脳の中でつくった。
われわれはストーリーの中を生きている。
瞬間のことを物語として記憶する。
自分たちにたいして物語を語る。
この場所というのは、物語を作る脳の中の習慣、
そとの世界と繋げる。

アイデアと場所を繋げる。非常に強力な調和。
空間そのものと繋げる。
すべての感覚、認知は記憶によるもの。
この場所でおこったこの全ては記憶に残る。
記憶としての力の方が経験としての力よりも強い。
この記憶の中に自分がいるものとして覚えることができる。

技術は進化している。
環境を作るのは物理的なものばかりでは無いかもしれにい。
物語がインプレッション、幻想をつくってくれる。それがパワーがある。
将来へのチャンスを拡げてくれる。
技術／デザインによって非常にパワフルな空間ができる。
そして通常我々の人生の経験、感情的な経験のように
将来につながっていく。
将来的には可能性の爆発として、
イリュージョンとこの非常なデザインのやりかた。
2000年は昔のもの、知識がつながって、その積み重ねによって、
皆さんの世界にあるものが、その側の世界になって展開していく。

[&] SIGGRAPH Asia 2009 (Back to the Tradition from the Future)

2009-12-18T11:58:00.002+09:00

Back to the Tradition from the Future
---------------------------------------------
CGアーティストの教育方法
Clone Monitoring と Animation Template の手法の紹介

Clone Monitoring を採用した理由。
通常は講師と受講者が対面して、講師の操作する画面を前面に投影していることが多い。
そうではなく、新人の画面が常に講師の方から見えるようにして教育している。

スクリーンは細かいものが見づらいので、
講師の操作画面モニターを、受講者のセカンダリモニタに表示するようにしている。
メニューの位置などの細かい説明がわかりやすい。
理解度が高くなるので、同じ時間あたりに教えられる事柄が多くなる。

新人研修の後、現場で鍛えられるが、だんだんと成長曲線が低下していく。
理想的な成長曲線は、常に伸びて行くタイプ。
成長を妨げるものを打破する手法が必要になる。

なぜこのような成長限界があるのか？
他人の仕事やテクニックを見る十分な機会が無いことが要因。
ゲーム制作は PC 上で行なう作業。PCでの作業を外から見ても良くわからない。
もし自分が普段おこなっている作業と違うテクニックを見ることができれば、
成長限界を突破できるかもしれない。

似たような分野である、アートと工芸を参考にした。
アートは素晴らしい作品を見ることによって学ぶことができる。
毎日の作業からいろいろ試せる環境を作ることで実践できる。

もう一つのアイデアはエクストリームプログラミングの手法、
ペアプログラミング手法からアイデアを得た。
クローンモニターという名前をつけた。
講師と受講者のお互いのモニターがお互いに見られるようにした。
お互いにやっていることを見られるような環境を用意した。

クローンモニタリングの成果；
ペアプログラミングと同様の成果を得ることができた。
お互いに作業をなんとなく見るだけでも、作業の違いがわかり、
「見て盗む」ことが可能になった。
自分とは違う制作手法を知るだけではなく、
それによって物が作られる過程を見ることができるので、
学ぶ意欲が向上する。
一度そういう体験をすると、自ら学ぶという姿勢が形作られる。
相手のところで何か問題がおこっても、すぐに反応すること、対応することができる。
命名規則の間違いや、無駄なデータがあるかどうか、アニメーションの間違いなども
すぐに指摘することができる。
不謹慎にも YouTube をみてさぼっているのも、見られてしまう（笑）
YouTube を見ていることがばれるようになれば、いつもの２倍のスピードで仕事できます（笑）

似ている仕事をしている同士を見ることだけではなく、
違う仕事をしている同士の画面をみつことでも、あらたな発見ができる。
例えば 3Dアーティストと 2Dアーティストの画面をつなぐことによって、
お互い、新しいツールの使い方を覚えることができる。
普通、新人に作業のスピードアップする方法を教えても、継続して実践してもらえない。
そのコツを実際に実践してスピーディに作業しているところを見せると、
説得力があり、真似するようになってきた。

クローンモニタリング独特の面白い結果を得ることもできた。
お互いの画面を見ることで、会話の量が増える。
より潤滑にコミュニケーションをとることができるようになった。

どのように人材育成するかを考えることで、机の配置を調整する。

問題点：
一度クローンモニタリングに慣れてしまうと、
スクリーンセーバーのように感じてしまい、見ることが無くなってしまう。
クローンモニターは半年から１年をめどに実施するのが適していると思われる。
まだ事例が少ないので、全般的にあてはまるかどうかわからない。

◆Animation Template
ゲームアニメーターは不足しがち。常に育てる必要がある。
アニメーションはモデリングなどに比べ、学ぶことが難しい分野である。
アニメーションの善し悪しをセンスの問題として評価されることもある。
どうして 3DCG のアニメーションはモデリングより難しいのか？
モデリングは目で見える概念だが、
アニメーションは「時間」という目に見えない概念なので難しい。

ポーズ、キーフレーム、タイミング、リズムに別れる。
伝統的な手法を調べた。2D,3D の違いはどこにある？
原画と動画の違いはどこにあるのか。
キーフレームと中割りには師弟関係がある。
原画が重要なポーズとタイミングを押さえる。
動画の実力がついてくると、原画の修正、原画を描く作業にステップアップすることができる。

3D には原画、動画という関係が無い。
たいてい一人で作業することが多い。そしてリードアニメーターにチェックしてもらうことになる
そこでこの原画と動画の関係、
うまい人のアニメーションに触れる機会をつくることを考えた、

この手法に「アニメーションテンプレート」という名前をつけた。
具体的にはすでにアニメーションがつけられているデータをいながら、
同じシーンに、新しいキャラクタで同じアニメーションをつける作業をしてみる。
これは原画をトレースするのと同じ作業。
いままでもそっくりの動きを作る教育は行なわれてきた。
今回は可能な限り作業の単純化を考えた。

アニメーションにデッサン力を適用する方法を考えた。
アニメーションの要素である、ポーズとタイミングを学ぶようにした。
テンプレートにしているアニメーションのキメとなるポーズをまねるようにした。
（この段階では、タイミングは無視）
ひととおりポーズをつけた後で、その後動きのみをみてキーフレームを調整する。
　キーフレームのみを調整すれば良いので初心者も戸惑わない。

要素を分解して教えることで、アニメーションづくりを迷わないようになる。
おかしいアニメーションの時に何がおかしいのか気づけるようになる。

スクワッチ／ストレッチなど基本的なことを学んだだけの人の場合。
制作当時は 80%のできだと思っていたが、今みるとヒドイ。
うごきがメチャクチャ。やりたいことはあるが表現できていない。
ポーズそこそこきまっているが、タイミングやリズムが悪い。
その後、アニメーションテンプレートに挑戦。
本当に力がついたのかどうかをチェックした。
標準的な教育用サンプルである、くい打ちアニメーション。

まねをすることで良いセンスを身につけることができる。
見落としがちなディテールに気づいてまねることができる。
既存のアニメーションを読み込んで使うだけなので、非常に手軽にできる。

問題点：
ゲーム特有の瞬間的なアニメーション、待機アニメーションなどを例にすると作業が苦痛。
まだ実験的な段階。効果は感じている。
アニメーション学校で同じことをしているかもしれない。

ロトスコープに似ているかもしれないが、実写は情報が多すぎて、参考にするのは難しい。
アニメーションの復習は難しい。虫食い問題は役に立たない。

今回マインドマップを利用した。
効果の復習方法として役立った。
アニメーションに重要な要素、動きの喚起やコントラストなど気づいたことを記入していく。
確認する側もすぐに分かる（学習度合いが）すぐにわかるのが良い。
復習のために問題を用意しなくてもいい。

トレーニングには cable, LCD, Video Splitter と「勇気」が必要。
教育現場ではアニメーションを教える講師の確保が難しい。
2-3年の在学中では、ポートフォリオに載せる作品を作るだけで精一杯で
アニメーションを学ぶところまでは難しい。

Q&A
Q. アニメーションテンプレートをまねる場合、強引にキーをつけるような場合はなかったか？
A. 単純にシーンを使うとそういう例もある。なので、厳密にアニメーションを再生しながら
なるべく単純化して学ぶようにした。機械的な感じがするが、それぐらい単純な方が学びやすい。

Q. クローンモニタリングの実施規模は？
A. 非常に少ない。試しに 3,4人。でも皆で同様の効果を得ることができた。
モニターをつなぐケーブルが 5m ほどしか無いので、机が離れすぎると繋げない問題があった。
どうしても小規模から行なう必要があるかもしれない。

Q. クローンモニタリングを長く続けていると慣れてしまって見なくなるのはどれくらいの期間？
A. 最短で 1-2 ヶ月、最長で一年くらい。
効果は三ヶ月くらいでピーク。あとは外すの面倒だからつないだままの人もいる。

Q. 見せたくないページを見ているときにはどうする？
A. 実際にはもう一枚モニターを用意して、人から見えないモニターも用意している。
実際はトリプルスクリーンで運用している。

Q. この手法を受ける人材の選出はどのようにしておこなったのか？
A. 隣にいた人と後ろにいた人を選びました（笑）
だいたい１年目の人、２−３年目の人を対処とした。
それ以上の年数の人は、ものすごく拒否する。

Q. アニメーションテンプレートの手本は？適切ないいお手本の選出方法は？
A. まずは手付けのアニメーションであることが重要。
すでにあるものを移すので手間がかからない。
まずは色々やってみるのがいい。
アニメーションをつけていくうちに、本人がいいものを分かってくるようになる。
それも効果のひとつ

Q. アニメーションテンプレート、アニメートごとの動きの個性は？
A. 大規模にやっていないので、そうなるかもしれない。
基本は昔ながらのテクニックを使う（アートや工芸などの）こと。
皆でデッサンをやっても、それぞれ違うものになる。
ちゃんとしたアニメーターになれば、それぞれの個性は生かせると考えている。

Q. テクニカルアーティストの仕事。スクリプトの作成はどの範囲？
A. 基本はアーティストが必要なツールを用意する。
ゲーム本体に関わるようなものは作らない。
一部、全体でつかうコンバータを作る場合もある。
たとえ一人しか使わないものでも作る。

Q. 勉強会について。任意参加？必須参加？全然参加しない人は？
A. 基本的には任意参加。参加しない人もいる。
　どうしてもついていけない人は、どんどんついていなくなる。
　強制的に参加してもついていけないので、マンツーマンで指導する。仕方ないこと。
　皆がみんなそうなってしまうと困るが、プロとして仕事しているので、各自でがんばってもらう。

[&] SIGGRAPH Asia 2009 (Try Realtime Shader for artist)

2009-12-18T11:02:00.001+09:00

Try Realtime Shader for artist
アーティスト（デザイナー）もリアルタイムシェーダーをやってみよう
ーーーーーーーーーーーーーーーーーーーーーーーーー

数年たったアーティスト用
アーティストが Shader を学ぶことの利点など。

グラフィックツールの開発や、R＆Dを行なっている。
Softimage をメインにツール開発やサポートを行なっている。
テクニカルアーティストという立場。

デザイナーがシェーダーが書けることの利点；
　プログラマの時間を拘束しないで、表現の調整にこだわることができる。
　現在制作上のデータがゲーム上でどういう表現がなされるのかを試すことができる。
　シェーダーで何ができるのかが分かり、表現の幅が広がる。
　もしもアーティストが書けなかったとしても、可能な表現をしることで表現の幅が広がることが重要

明るいところで肌が透き通る現象。サブサーフェーススキャッタリング。
使い古された技術ではある。フェイクのシェーダーを書けるようになるまでの道のり。
最初にイメージベーストライティングの例から始める。

◆最初のハードル。内積 (dot)
シェーダーの基本は normal vector と light vector の組み合わせ。
法線ベクトルとライトベクトルが 60度の場合、Brightness は 0.5 になる。
Cg shader で表現すると 1行。
float dif1 = dot(normal, light)
softimage に Cg シェーダーを適用する方法の説明。
スペキュラーの意味や効果を試したりすることができる。
オブジェクトの輪郭が光ったような表現も可能になる。

◆次のハードル。Normal Map、環境マップ
Normal はオブジェクトそのものデータが平坦だとしても、でこぼこを表現することができる。
頂点数を増やすこと無く、質感表現を豊かにすることができる。
Object space normal map は
法線データを RGB の色で表現したもので、見ただけでどの方向かが分かるようになっている。

c.f. こんなやつ
http://www.surlybird.com/tutorials/TangentSpace/images/gargoyle-uv_world_space.jpg

tangent space normal map の説明
法線をどちらに倒したらよいのかを把握。

環境マップ。ゲームでは環境（風景）をテクスチャに焼き込んでいく表現が多く使われる。
Simple Environment mapping (sphere) オブジェクト方向によって、移り込みが変化しないもの
Dual Paraborid maping
cube mapping GPU サポートによりハードウェアサポートしている。6方向の絵で表現する。

Dual Paraborid maping
テクスチャや半球の移り込みを前後を表現した１枚の素材から生成する。
softimage の環境マップでも Dual Paraborid maping が採用されている

◆最後のハードル、Shader Blending
今まで使ったシェーダーを足したりかけたりして、最終的なシェーダーをつくる
フェイクのフルネルと環境マップを合わせたものを作る
一番の難関はテクスチャをぼかすこと。
シャドーマップをぼかすのに使っている数式をあてはめて実現する。
プログラムを１から考えるのは難しいので GPU Gems を参考に作る。

ぼかしのパラメータを softimage のカスタムパラメータにすることによって調整が可能になる。
softimage ではシェーダーの動的な変化をコントロールすることができる。
指の動きによって、浮き出す血管などの表現ができるようになる。
一枚のポリゴンなのに、水際のような表現ができる。

シェーダーの細かいパラメータを調整することのできる CgFx は Dxfx を使う
ある程度なれたら、FX 形式に切り替えるのが良い。

情報をイントラネット上に載せておき、
時間があるときにオンラインで学べるような素材を用意している。

[&] SIGGRAPH Asia 2009 (SEGA Corporation’s Training Programs)

2009-12-18T10:14:00.001+09:00

SEGAの新人研修について
SEGA Corporation’s Training Programs
-----------------------------
セガが最近出しているゲーム：
ビヨネッタ、End of Eternity, 初音ミク、PHANTASY portable、みんなのプヨ顔

カリキュラムやトレーニングについて（ゲームに関係するところのみ）
セガはAMゲーム部署と、CSコンソール部署に別れる。今回は CSの説明
新人とは新卒者のみ。中途採用は研修の対象では無い。

新人研修は二種類。グループトレーニングと
Game Design ,Visual Arts, Programming の３分野に分かれ、二ヶ月
ゲーム制作の基礎知識などを職種に関係なく受講する。
社内のスタジオでアフレコの体験なども。
新人などもある程度の知識を身につけている人もいるが、
常にベーシックレベルに合わせた研修を行なっている。

Gme Graphics 研修に関して。
CGに詳しくないことを前提に基礎的なことを教える。

デザイナーの場合、必ずしも CG に詳しいことが重要ではなく絵が描けることが重要なので、
CG のことを詳しく知らない人も居る。
一般的な説明以外に、リアルタイム描画、
　アルファチャンネルに関する説明ではゲームならではのポイントも教えている。
　（あまり重要ではないオブジェクトは白黒の 1bit で表現するなど）

3D に関する概要、基礎的な内容だが、ゲームに特化した内容が含まれる
例えばモデリングの場合、多角形ポリゴンに関して説明する。
（三角形、四角形ポリンゴンが主流。それ以上のポリゴンだとゲーム機で表示できない場合があり、
　かならず確認するように教育している）
（四角形に見えてもエッジがあって、実際は六角形の場合もあり）
（口角の部分など、六角形になりがち、多角形が発生しがちなところを教えている）
（車の車輪など、普通にモデリングすると、ピザのような形状になるが、
　縦に分割することによって、ポリゴン削減することができる）
見た目を保ちつつ、できるだけモデルデータを削減するテクニックを教えている。

ZBuffer の説明。Z-Sorting の説明。
画面上のピクセルごとに前後判定する。カメラからの奥行きを保存するバッファ。
間違えると表示に影響を及ぼすこと。
ZBuffer では後ろの物体が透けるような半透明な表現ができない。
透明度を含む場合は Z-Sorting で描画する。
半透明は色をブレンドする処理もあり、負荷がかかる描画であること。
負荷が高いので本当に必要なところだけ使うように。

カメラからの距離に応じてモデルの詳細度を変更する LOD (Level of Detail) について。
複数段階の詳細度をもったオブジェクトモデルを用意し、
カメラとオブジェクトの距離に応じてモデルを切り替えて表示する。
例えば車のモデルの場合、遠景用は形がだいたいわかるくらいにポリゴンを削減している。
近景は 12000ポリゴン。遠景は 50〜100ポリゴン

テクスチャの LOD. テクスチャのミップマップ手法に関して。
元のサイズの 1/8, 1/4, 1/2 などのサイズを用意しておく。描画の高速化にも貢献する。
ギザギザになる現象を避けることができる。
デザイナーが小さいテクスチャを用意する場合と、
プログラムで自動生成して用意する方法を使い分けている。

カリングの説明。視線、カメラの範囲外を表示しない手法の説明。
カメラから見えない、オブジェクトの裏側にあるオブジェクトなどをレンダリングしない。
同じシーン内のオブジェクトでもカリング用にいくつかのオブジェクトに分割しておく。

集合研修では、ゲームの企画を作る。
研修中の試作ゲームの企画として使われる。
デザイナーは 3DCG ツールを使い簡単なキャラクタを作る。
一昔前はパソコンさえ触ったことが無い人もいた。
プログラマは、環境構築、デバッグまで教える。

3DS MAX を教えている。
海外のゲームでは一般的に使われているが、SEGAではそれほど多くない。
sega の中では主に背景制作に使われている。
キャラクタスタジオデータ情報をゲームで生かすのが難しい。
ゲーム業界でアニメーションで活躍したい人は Softimage を覚えることをおすすめする。

vertex color の説明。頂点カラーの説明。
ライトの位置が変わった場合、あとから修正するのが大変な場合。
テクスチャの枚数を減らし、修正も容易になる。
影付け用に、あえてエッジのあるポリゴンを増やす場合もある。

Notmal map の説明。
球体のような比較的簡単なオブジェクトで説明している。
制作は思った以上にデザイナーに負荷をかける。
必要なオブジェクトにしぼって作業するようにしている。
この段階ではオブジェクトスペース、タンジェントスペースの概念は説明していない。

職種別にどのような目的を持って欲しいかを説明している。

◆企画
企画を立てるためには、ゲーム機でできること、できないことを知る必要がある。
描画に関わるグラフィックスは開発の大きな部分を占める。
　詳しく知らないとトライ＆エラーが生じ、コストが跳ね上がることになる

一画面に数百人の登場するといった企画は、無駄な時間になってしまう。
できないことをプログラマのせいにしないためにも限界を知っておくことが必要。

◆アーティスト
デザイナーに必要なのは、ゲーム描画に必要な素材、データを用意すること、
デザイナーは画面で表現されるものに責任を持つ。品質に責任を持つ。
画面上の見た目が同じであれば、より高速に表示できる表現ができれば、
より全体の品質をあげることができる。

◆プログラマ
ハードやソフトの仕組みを詳しくしる。
新しい表現が必要になった場合は、ネットや書籍で自分で探して解決する必要がある。
ただ単に絵を出すということだけではなく、データサイズの削減を考える。
高速に動かすことも重要だが、
同じように見えるが、データが少ないといったことをデザイナーと協議して進める必要がある。

◆テクニカルアーティスト
ゲーム機の高機能化にともない、プログラマとデザイナーとの間に位置する職種。
プログラマの意識をもって、デザイナーの支援ができる。
パイプラインやワークフローを構築し、
必要があればスクリプトプログラムなどを描いて、デザイナーの補助をする。
映画業界であれば、テカニカルディレクターに相当する。
プロシージャル（手続き型）に映像を作る必要が高まってきている。

デザイナーを目指している人で、スクリプト作成できる人、
プログラマで絵が描ける人は、現在需要の高いテクニカルアーティストを目指すと良い。

知的財産関係も研修中に学ぶ。
ネットから容易く手に入れられる素材が多いので、フリー素材でも商用利用の際には
問題が生じるので、使用許諾を確認すること。
情報取得の重要性として、英語の大切さ。最新情報や、最新機能のドキュメントは英語であること。
教育６年間の英語教育は８００時間、ネイティブであれば、たったの５０日間でしかない。

研修の最後には社内見学。モーションキャプチャスタジオの見学。
一ヶ月間の研修中はスーツを着るように決まっている。社会人としての自覚を持つように。
通常の開発部署はカジュアルな服装で仕事している。
アーケードゲームの開発部門も見学する。

Q&A
Q. 二年目以降、ベテランに対する研修は？
A. 全社的に研修は無いが、勉強会は実施している。イントラネット上に情報を載せている。
不定期でシェーダー研修をおこなったりはしている。

Q. 新人研修の中でキャラクタセットアップ、モーションデータの扱いなどは研修に含まれている？
A. 一気にそこまで教えると難しすぎてついてこれなくなるので、おいおい教えていく。

Q. 中途採用者に対してのフォロー研修は？
A. 厳しくて、できていることを前提に採用するケースがほとんど。

[&] SIGGRAPH Asia 2009 (Sketch Interface)

2009-12-17T10:11:00.003+09:00

Sketch Interface

Teddy で有名な東大の五十嵐さんの講演。
五十嵐さんの研究自身も素晴らしいのももちろんのこと、
リファレンスの調査、研究の物量がはんぱない。
論文のことを「巨人の肩に乗る」と比喩することが多いが、
ものすごいたくさん調べて、巨人の上に乗っているんだなと。
あと、Teddy のすごくいいところは、アクションに音がつくところだと再認識した

------

◆イントロダクション

スケッチはシンプル、入力される情報量が少ない
補うことが必要
アルゴリズム：特定の対象に特化した知識を利用（特定用途）
インタフェース：アイアイ性を解消するための手段を提供

Pegasus のデモ
http://www-ui.is.s.u-tokyo.ac.jp/~takeo/java/pegasus/pegasus.html

コンピュータは間違える。もともとの問題があいまい。
複数の選択肢を用意することによってあいまいなものを正確なものにできる。
予測インタフェースのようなものも実現。
予測なので外れることもある。予測は色々なことに使える。

SKETCH [ Zeleznik 96 ]
http://www.cs.brown.edu/~bcz/sketch/sig.html

全てのオブジェクトは外のオブジェクトの上に乗っているというルールを作った。
ジェスチャー操作で３本線をかけば直方体がかける
空中にものを置きたいときはどうする？
影を描くと空中に浮いていることにする。

Suggestive Interfaces [ Igarashi 01]
http://www-ui.is.s.u-tokyo.ac.jp/~takeo/chateau/chateau.htm
やりたい操作に対応するところを選択すると、コンピュータが３種類操作を提案してくれる。
コマンドやメニューを使わないで図形的な入力だけでコンピュータを操作する。

Teddy
http://www-ui.is.s.u-tokyo.ac.jp/~takeo/teddy/teddy-j.htm
まるっこいものに限定したことで実現したインタフェース。
二次元の線をくるくる書いていくだけで三次元形状がつくれる。
このスケッチシステムで大切なことは、Maya に取って代わるものではない。
子供用のゲーム、落書き、ホビーユース。
プロがデザインする時にも使える。
コミュニケーションの道具として使える。
絵を描いて具体的なコミュニケーションをとるとき。
コミュニケーションの最中に立体的な概念を伝えるときに優れている。
（お医者さんが歯の説明をするとき。高校の地理の授業、理科の授業など）
海溝が穴ではなくて、溝であることがわかってもらえる。
等高線の説明にも優れている。山を見せておいて、高さを示す線を見せると納得する。

応用例
Vteddy [ Owada 2003 ]
Smooth Teddy [ Igarashi 2003 ]
ShapeShop [ Schmidt 2005 ] 後から位置を変えられるもの

FiberMesh [ Nealen et. al . 07 ]
http://www-ui.is.s.u-tokyo.ac.jp/~takeo/research/fibermesh/index-j.html
描いた線が残っていて、ユーザが引っ張って、あとから調整することができる。
メッシュの曲率の変化が最小限になるものをみつけて、きれいなサーフェスを生成するようになっている。
コントロールカーブを追加することができる。

Plushie [ Mori and Igarashi 07 ]
http://www.den.rcast.u-tokyo.ac.jp/~yuki/plushie/index-j.html
ぬいぐるみを作るための布の型紙モデルを作る。

Structured Annotations for 2D-to-3D Modeling
http://www.cs.nyu.edu/~gingold/annotations/
新しい論文発表。
回転しなくても三次元モデルができる研究。
絵本の中のキャラクタを三次元化できる。
二次元の参照画像が与えられたら、同じ長さの部分、左右対称の部分、繋がっている部分など、
二次元状で幾何学的な条件を指定すると、コンピュータが計算して三次元モデルを作れる。

Analytic Drawing of 3D Scaffolds
http://www.dgp.toronto.edu/~rms/pubs/DrawingSGA09.html
始めにガイドとなるような直線から構成される消失点のある直線的な形状を描いて、
それから曲線を描いていくことで正確な形状を描くことができる。

◆形状変形手法

Sketching Skeleton [ Kho 05 ]
自由にポーズがつけられる
スケルトン、軸を中心にした変形。

Silhouette Sketching [ Nealen 05 ]
外観を調整することによる変形。ユーザーの指定はなんとなくで良い。
ディテールプリザービング（形状を保ったまま、なんとなく変形してくれる）

◆アニメーション

Articulated Animations [ Davis 2003 ]
http://graphics.stanford.edu/papers/sketch_interface/Davis_149_SketchingAnimation_SCA2003.pdf
人間の体の知識（関節はこれいじょう曲がらないなど）から動きをつくる
アニメーション用の棒人間の動きを作る。
二次元で見ると複数の候補がありえる。人間として不自然なものは取り除くが、ユーザーに選択決定してもらう。
そのままだと、ギクシャクしてしまう。物理的に整合性がとれた動きを計算してスムースにする。

Motion Doodles [ Thorne 04 ]
http://people.cs.ubc.ca/~van/papers/doodle.pdf
描いたキャラクタの動線をスケッチ入力できる。
ゆっくり描くと、ゆっくり動いてくれる。

Animations by Performance [ Igarashi 05 ]
空間的キーフレーム法によるキャラクターアニメーション
http://www-ui.is.s.u-tokyo.ac.jp/~takeo/research/squirrel/index-j.html
今までは動きを一枚一枚描かなければいけなかったが、
これはモゾモゾ動かすだけでアニメーションがつくれる。
マルチタッチに対応。絵を手でつかんで利用できる。
一つ一つはそれほど凄いポーズではないが、
マウス一個で複雑なアニメーションもあやつれる。

◆モデリング

Trees Modeling [ Okabe 2003 ]
http://www-ui.is.s.u-tokyo.ac.jp/~takeo/papers/siggraph2003-okabe.pdf
二次元の木を描くと、三次元化してくれる。
閉じた線だと葉っぱ、閉じた線だと幹。幅や大きさを指定できる。

Flower Modeling [ Ijiri 2005 ]
http://www.riken.jp/brict/Ijiri/papers/ijiri_EG06_seamlessIntegration.pdf
花の知識を盛り込んだ専用のエディタを使う。部品をスケッチで作り、構造を作る。
普通の三次元 CGソフトだと制作が困難なものも、慣れていない人でも使えるツール。

Garment Design [ Turquin 04 ]
http://sketch.inesc-id.pt/sbm04/papers/20.pdf
二次元の人の画像の上に二次元でスケッチすると、服のモデリングできる。
服は人の表面を覆うものというルールのもとに生成する。

Clothing Mannipulation [ Igarashi 03 ]
http://www-ui.is.s.u-tokyo.ac.jp/~takeo/papers/cloth.pdf
すでにある服のモデルをどうキャラクタに着せるかというインタフェース。
着せた後にも回転させたり、ずらしたりもできる。

◆まとめ

スケッチによってインタフェースを簡略化
　初心者でも簡単に使うことができる。
　デザインの初期段階にも使える
効果的なデザインのために重要な点
　対象に特化した知識を利用して不足する情報を推測
　曖昧性を解消するためのインタフェースを提供

デザイナーとモデラーが別々なのではなく、
デザイナーが本来使えるようなものが理想。

[&] SIGGRAPH Asia 2009 (SIGGRAPH ASIA 2009 paper fast forward)

2009-12-16T19:27:00.001+09:00

SIGGRAPH Asia 2009

SIGGRAPH ASIA 2009 paper fast forward

色々間違えていそうだけど、一応......

論文のリンク集
[ http://kesen.huang.googlepages.com/siga2009Papers.htm ]

ーーーーーーーーーーーーーーーーーーーーーー
◆Texturing

Layered Shape Synthesis: Automatic Generation of Control Maps for Non-Stationary Textures
最初の発表で気をぬいていた。わからん。

Feature-Aligned Shape Texturing
ハイライト付きのテクスチャ表現に関して。

Continuity Mapping for Multi-chart Textures
padding に考慮したマルチテクスチャ

Motion Field Texture Synthesis
煙などの質感を物理計算無しで素材を作る方法

◆Urban Modeling

Interactive Design of Urban Spaces using Geometrical and Behavioral Modeling
プロシージャルモデリング手法。地図上の道を書き換えるだけで都市の建物が変化する。

Procedural Modeling of Structurally-Sound Masonry Buildings
モンスターの格好をそしたふざけた発表。構造をもった建物が怪物に壊されるときの映像化。

Symmetric Architecture Modeling with a Single Image
一枚の画像から、三次元物体のテクスチャイメージを取得する手法

Image-Based Street-Side City Modeling
もし横浜の建築物の三次元モデルを手作りしたらどうなるか？車から撮影した映像で再モデル化。

◆Vectorization/Editing

Patch-Based Image Vectorization with Automatic Curvilinear Feature Alignment
パッチベースの画像のベクター化手法。写真から線画を全自動で取得できる。

A GPU Laplacian Solver for Diffusion Curves and Poisson Image Editing
はてな？　わからなかった？

Rendering Surface Details with Diffusion Curves
？？

Efficient Affinity-based Edit Propagation using K-D Tree
ビデオ映像の色合いを丸ごと大胆に変更する。その色合いや雰囲気を保ったままで。

◆Physically Based Animation

Harmonic Shells: A Practical Nonlinear Sound Model for Near-Rigid Thin Shells
音を発する金属質の金属音を物理的に生成。

Stretching and Wiggling Liquids
何が新しいのかわからなかった。

Synthetic Turbulence using Artificial Boundary Layers
ラップ風の排気ガスのリアルに描く。

Aggregate Dynamics for Dense Crowd Simulation
群衆シミュレーション。インドのリアル群衆、日本の群衆との比較。むちゃくちゃ人がいる時の振舞い

Skipping Steps in Deformable Simulation with Online Model Reduction
複雑な顔モデルのリダクションに関して。

◆Resizing/Montage

Sketch2Photo: Internet Image Montage
ラフスケッチした絵から、写真を探す技術。今年のベストペーパーかもしれない！！

Optimized image resizing using seam carving and scaling
最近流行のシームカービング技術。大きな画像をから、オブジェクトを保持したまま縮小する

A System for Retargeting Streaming Video
動画のクロップ、スクイーズをアーティスティックなコントロールできる仕組み。

Motion-Aware Temporal Coherence for Video Resizing
動くオブジェクトをリサイズした時の不自然さをなくす。

◆Lighting & Materials

Printing Spatially-Varying Reflectance
印刷されているマテリアルは豊かな質感を持っている。そのインクをシミュレーションして再現。

Interactive Reflection Editing
インタラクティブに鏡に写っているものや車体の反射をコントロールできるツール。GPU利用

User-Assisted Intrinsic Images
ユーザーの手作業による Illumination の編集。

Webcam Clip Art: Appearance and Illuminant Transfer from Time-lapse Sequences
写真に写っているオブジェクトを丸ごとコピー＆ペースト

◆Real-Time Rendering

Micro-Rendering for Scalable, Parallel Final Gathering
ファイナルギャザリングを並列化した仕組み

All-Frequency Rendering of Dynamic, Spatially-Varying Reflectance
BRDF オブジェクトをリアルタイムにペイントできる仕組み。

Depth-of-Field Rendering with Multiview Synthesis
DOF被写界深度を考慮したレンダリング。

Amortized Supersampling
動画像のスーパーサンプリングの効率化手法。論文を拡大すると自分の家族写真がはいっていますとな。

◆Shape Analysis

Relief Analysis and Extraction
？？

Abstraction of Man-Made Shapes
手作り形状に関しての何か？わからん

Partial Intrinsic Reflectional Symmetry of 3D Shapes
画像の中から似たものをみつけ、分離する技術

Packing circles and spheres on surfaces
蜂の巣のような数式的に繰り返す、新しい構造体に関して。建築物に活用できる。個人的にはツボ。

◆Global Illumination

Adaptive Wavelet Rendering
wavelet 手法を使った GI 。ノイズが少ないなど。ウケを狙いすぎたか？

Stochastic Progressive Photon Mapping
フォトンマッピングのノイズ軽減手法。すごい難しい数式を提示！？

Automatic Bounding of Programmable Shaders for Efficient Global Illumination
アニメ的 CGと物理シミュレーション的 CG のギャップを埋める手法。

Virtual Spherical Lights for Many-Light Rendering of Glossy Scenes
キッチンの輝く質感。VPL virtual point light を使うのがおすすめ。VSLs の売り込み。

◆Imaging Enhancement

Removing Image Artifacts Due to Dirty Camera Lenses and Thin Occluders
カメラのレンズがとても汚れていた時に、動画から補完してゴミをとりのぞいた映像を作る技術。実用的！

Fast Motion Deblurring
モーションブラー（手ぶれ）を取り除く技術を超高速化。

Noise Brush: Interactive High Quality Image-Noise Separation
ノイズ除去は正しい回答なのか？　味のあるノイズを画像に載せる方法

Edge-preserving Multiscale Image Decompostion based on Local Extrema
エッジ検出手法。縮小率によらない手法

◆Geometry: Interaction & Subdivision

Structured Annotations for 2D-to-3D Modeling
二次元の絵の動く部分を指定すると、三次元オブジェクトとして動かせるように？

Analytic Drawing of 3D Scaffolds
CAD的オブジェクトを紙で定規を使って描くものと同様にコンピュータ上で描けるツール。どこまで実用？

DiagSplit: Parallel, Crack-Free, Adaptive Tessellation for Micropolygon Rendering
オブジェクトのクラック（傷や欠け）を直す手法

Approximating Subdivision Surfaces with Gregory Patches for Hardware Tessellation
ハードウェアを活用したテセレーション。

◆GPU Algorithms & Systems

Ray casting of multiple volumetric datasets with polyhedral boundaries on manycore GPUs
GPU に対して新しいレンダリングパイプラインを実装。

Debugging GPU Stream Programs Through Automatic Dataflow Recording and Visualization
GPU プログラムのデバッグツール、

Real-Time Parallel Hashing on the GPU
ハッシュテーブルへの GPU活用

RenderAnts: Interactive REYES Rendering on GPUs
GPU でRenderMan 的レンダリングをリアルタイムで描く手法。PixarのPRMan とほとんと同じ。

◆3D is Fun

Shadow Art
影を使ったアート。見た目なんだかわからなくても影の形がアートになっているもの。自動生成する技術。個人的にはツボ。

3D Polyomino Puzzle
三次元の組み立てパズルを生成する手法

The Graph Camera
グラフカメラという新しいカメラ撮影を提案

BiDi Screen: A Thin, Depth-Sensing LCD for 3D Interaction Using Lights Fields
三次元ディスプレイのタッチ、グラブ、操作の新しい手法の提案。パイ無げ

◆Perception

Evaluation of Reverse Tone Mapping through Varying Exposure Conditions
様々な明るさで撮影した画像のトーンマッピング活用。

Robust Color-to-Gray via Nonlinear Global Mapping
カラー画像を適切にグレースケールにする手法。

Structure-Aware Error Diffusion
印刷物のトーンパターン手法。漫画のパターンのようにつぶつぶで写真画像を表現する方法

Emerging Images
動画の中に単なる粒が混ざっているだけなのだが、オブジェクトとして認識できる。佐藤雅彦さんの手法？

◆Hair & Collaborative Modeling

Exploratory Modeling with Collaborative Design Spaces
髪の毛を三次元ジオメトリとしてスキャンし、レンダリングで再構成。

Capturing Hair Assemblies Fiber by Fiber
写真の人物の髪の毛を CG キャラクタのヘヤカラーとして使える手法。色合いや風合いをまねることができる。実用度たかい！

A Practical Approach for Photometric Acquisition of Hair Color
人物モデルはポリゴン、髪の毛のスタイルを編集するは難しい。ヘアスプレーのような編集可能な髪。

Hair Meshes
手書きから生まれるメッシュモデル。

◆Character Animation

Optimizing walking controllers
人の歩きを自然に見せるのは難しい。様々な偏った人体モデルでも自然な歩き方を。

Compact Character Controllers
発表者が居ない。

Robust Task-based Control Policies for Physics-based Characters
周囲の環境や重力を考慮した歩行アニメーション。

Modeling Spatial and Temporal Variation in Motion Data
群衆アニメーションのうち、周期的な動きに関するもの

Real-Time Prosody-Driven Synthesis of Body Language
ネットワークゲームにおけるキャラクタの自動的な動きづけ。自然なジェスチャ。

◆Reconstruction & Modeling

Out-of-Core Multigrid Solver for Streaming Meshes
メッシュ形状向けの効率の良いソルバー

Dynamic Shape Capture using Multi-View Photometric Stereo
複数方向からの動画により、モデル形状の取得

Robust Single View Geometry And Motion Reconstruction
サウスパーク風の発表。笑える。

Consolidation of Unorganized Point Clouds for Surface Reconstruction
スキャンしたノイジーな三次元形状の扱い。

----
以上。明日も楽しみ！

[&] DESIGN IT Conference 2009 (Google UX)

2009-11-18T10:18:00.002+09:00

DESIGN IT! : イベント

DESIGN IT! Conference
-------------------------------
立ちこめる暗雲 - Web サービスとクラウドコンピューティングにおける課題をかんがみる
Google UX Researcher - Donal Mountain
Google UX Designer - Braden Kowitz

注：UX専門家としての発表で、Google の公式見解では無い

1. クラウドはいつでも利用できます。
2. クラウドは安全に利用できます。
　　書類をなくしたり、壊れたりしてデータを無くすことが無い。
　　違うノートパソコンでもおなじ作業が続けられる。
　　思い出を次の世代に残せる
3. クラウドはみんなで利用できます。
　　クラウドは共同作業の場になります。
　　FAX は、紙を送るだけで根本的な違いはない。
　　クラウドは新しい方法で、ドキュメントをオンラインで一度に変更できます。

Challenges Ahead - この先に進んで行こう。
　どういった要因がクラウド化を妨げているのかを認識することが大切

DM: UX の仕事。ユーザーを理解する仕事をしている。
製品をどうやって使っているのかを理解する。
BK: いろいろとプロトタイプをつくって、ストーリーをつくっている。

さまざまな課題に対する回答があるわけではない。
シリコンバレーのさまざまなところで調べた情報を伝える。

1. Always Available : いつでもつかえる
2. Safe : 安全に使える
3. Collaborative : みんなで使える

世界の貧困に立ち向かう非営利団体、世界中で活動するのに
クラウドは最適な回答。
ガーナで活動していて、クラウドの持つ問題に直面。
インターネットにつながらなかったり、遅かったりする。
ネットの復旧を待たずに作業を続けなければいけない。
ガーナの回線速度は東京の 1/400
実はネットが必要なのはデータを送受信する時のみ。

このプレゼンテーション自身もクラウドに保存されています。
ネットにつながっていなくてもプレゼンテーションできなければいけません。

ネット接続が万全でもサービスの予期せぬ停止もありえます。

Challenge #1
Works offline
オフラインでも使えるように
オフラインアプリはつくることができる。現在は少々難しいが。
ブラウザの中に多くのデータを置かなければいけない。
オフラインで使いやすいブラウザ (Gears, HTML5)
ブラウザ自身がオフライン作業に適していない。

オフラインで稼働するウェブ
Gmail のオフライン版でできる作業とできない作業があることを認識してもらう。

1987年に登場した HyperCard はさまざまな利用方法で愛されたツールでした。
Apple は HyperCard の販売を停止したが、ユーザーにとっては大きな問題では無かった。

クラウドと比較してみます。
magnolia はブックマーク共有サービス。
magnolia はバックアップからの復旧がうまくいかず、サービス自体が停止してしまった。
これがクラウドアプリと、デスクトップアプリとの違いになる。

Challange #2
Data Portability
データポータビリティ
ユーザーはデータの所有権を持つべき。
データをまとめてダウンロードすることができる。
クラウドからローカルにデータをダウンロードするアプリがある。
違うアプリを使えるように。
iPhoto から LightRoom へデータを移行。
　ハードディスク上にデータがあるので、容易にデータを移行できた。
クラウドだったらどうする？
Picasa web から Flickr へデータを移行する時には悩むことになる。

サービスが Open APIをもっていれば、間をつなぐことができる。
情報の移行だけでなく、ユーザに選択肢をあたえ、満足感につながる。

手元に物理的にデータを持つことは安全に思える。
手元におきたいというのは人間的な欲求。
安全な感じはするが、新しいハードディスクの 2% は故障し、交換が必要となる。
米国ではあたらしいノートパソコンの 10% は盗難にあう。
ノートパソコンに飲み物をこぼすこともある。
手元にデータを置いたとしても、データの消失はありえる。

2. Safe : 安全に使える。
これがクラウドにおける大きな可能性「安全性」
データを手元に置くのは短期のプロジェクトでは良いが、長期的にみると良いことではない。
銀行とお金に似たようなこと。安全性の確保につながる。
大昔は手元に金貨を置き、人に預けるのはおかしいこと。
　これが現在のクラウドの状況。
時を経て、金貨ではなく、価値を表す紙幣に移行した。
近年では、オンラインで銀行口座をチェックするようになった。
お金を預けることによる安心感と同様にクラウドにデータを預ける。

すべては信頼を表している。
昨今、銀行が危機におちいった場合、現金を引き出して手元におこうとする。

クラウドにおける信頼性
例：100分の Gmail サービス中断
その間、多くの人がメールにアクセルできなかった。
また、ホワイトハウスのメールが停止したことがあった。
こういった問題は起こりえる。
クラウドはデータを保存していて、安全だと考えている。
多くの人がサービスが中断しないよう努力している。
この先 10年を考えるとサービスの中断は起こりえることである。
業界としてサービス中断にたいしてどう対応していくか。

ほかの重要な業界から得た教訓を取り上げてみましょう。
2008年 BA 38便、突然空から落ちてきた。
なんとか飛行場にたどり着いた。
「それでも僕たちはおなじ飛行機で東京に飛ぶ」
信頼して飛行機に乗ることができた。
なぜ命を預けるまで信頼しているのか？
航空業界は信頼が重要であると認識している。
事故に関する情報が公開している。情報の公開は信頼を生む。
航空機のブラックボックス：間違いから学ぶ。
クラウドも問題の原因解明、探求、共有で、クラウド業界の信頼性をあげることができる。

サービスが 100% 稼働していて、間違いがなくても、
信頼は努力して得なければいけない。
その一つが「パスワード」
もしパスワードを忘れてサービスを利用できないことは、ハードディスクが壊れるのとおなじ。
パスワードを他人が持った時は、ノートパソコンが盗まれたこととおなじ。
パスワードは UIの中で大きな課題。

Twitter 内部資料の漏洩。
ペイリン元副大統領候補のメール漏洩

Challenge #4
セキュアなアカウント
企業向けソリューションとして、1タイムパスワードのトークン
トークンは堅牢で安全な解決策である。

一般人へのソリューションとはいいがたい。
一般の人がどうやってパスワードの安全性を確保できるかは、大きな課題。

3. Collaborative : みんなで使える。
新しいコラボレーションの形。
広がるコラボレーションの形。グーグルだけではなく数多くのサービス。
コラボレーションの良さはコンテンツを作り出すことにある。
文章作成だけでも難しいこと。Google Document
文章をつくるだけでもブラウザ上で行うには難しいこと。
　フォントや印刷の問題が難しいこと。
どうしてこれだけ苦労して、こういった問題が解決していないのか？
一つの要因：ブラウザはそのために設計されていないから。

Challenge #5
コンテンツ作成。
現状、オフラインでコンテンツを作成して、オンラインにアップロードするのが普通であった。
これからはオンラインで品質の高いコンテンツをオーサリングするのが普通になる。
将来は Web 上でビデオの編集、写真の画像加工などができるようになる。

ウェブは共有を簡単に共有にできる。
すべてが URL なので、URL を送るだけで情報を共有できる。
同時に共有するのは複雑なことである。
　個人情報を間違えて公開してしまうのは良くあること。

Challlenge #6
共有のコントロール。簡単、わかりやすく、必要な可能性を合わせ持つインタフェースをつくる。

まとめ
いつでも使える、安全に使える、みんなで使える。これがクラウドの価値。
クラウドのいいことばかりではなく、課題や挑戦も語りました。
みんなでクラウドコンピューティングに挑戦し、インターネットをいいものにしていきます。

[&] Web Directions East 2009 (Deborah Schultz)

2009-11-13T17:26:00.003+09:00

Deborah Schultz | Web Directions East

It's the People Stupid

View more presentations from deb schultz.

Deborah Schultz
Put People First『まずは人が重要！』
The Impact of the Social Web on Business
http://www.deborahschultz.com
-------------------------------------------------
これは HTML5,4,3,2,1 のことではないです。
デザイナー、デベロッパーとして企業のためにどう web サイトを用意するか？
橋渡しをする役。
Web に情熱をかけています。
P&G での経験もあります（広告）

実世界で人々がどう行動するのか？
旧来は物理的に近い位置にいる人としかコミュニケーションがとれませんでした。
新技術を活用になり、人々のコミュニケーションがかわり社会環境が変わってきました。

Flickr では写真をつかって体験供与する、写真を使って会話が広がる。

「インターネットにより人同士の会話が可能であった、
　マスメディアでは不可能なコミュニケーションが可能になった」
世界が変わりつつある。
どうやってチャンスが変わりつつあるのか。

But are these reelationships "real".
現実のモノなのか？　答えは [ YES ]
私の生活に多くの深みと価値を与えてくれています。
でもどのオンラインの連絡先がいつ手助けしてくれるのかわからない。

残念ながらビジネスというのは階層的な構造をしている。
かなり構造が分かれている。
We are organic and social
オンラインでももたらすことができる。
Social Web といのは個性の爆発でもある。
以前には考えられなかったようなチャンスが広がってきている。
チャンスの規模は大きい。
Twitter でスピーチの前に助けに求めたら、すぐに返答があったり。
このような情報の流れをスムーズに構造するのは何か？

visualcomplexity.com
さまざまな情報が表現されている。

考えようによっては、常にネットに接続している。
環境を構築する経済。
マスメディアの時代には無かったようなチャンスに恵まれている。
個人で実際に市場で買い物をする、昔に戻ったともいえる。

では、social web とは何？
私にいわせれば、古いコンピュータでもないし、数多くのサービスでもない。
技術そのものではない。
social media とは何？
アメリカ的なものとしては売りつけるものでは無い。「関係」なのです。
企業が顧客の存在なしにはなりたたないもの。

今われわれが生きているのは「関係」の社会。
関係の中からチャンスが生まれる。
グランドジェスチャーの終演。携帯電話の会社がいっぱいある。
こういった企業は自分たちの都合で顧客に対応する。
長い間、自分たちで販売したいものを売る。広告を出す。
関係ということになると違う。
ビジネスであれば、信頼の連続体。
どのようにお客様と新しくつながっていくのか。
新しいすばらしい考え方だが、どうやってやるの？
マニュアルは無い。
関係は皆違う。

参加型の Web
人として新しいデザイン的な考え方と人との関係構築のスキルが必要になる。

Organic vs Static
Emotion vs Data
Relationship vs Transaction
Continuum vs Grand Gesure
Relevance vs Chronology

単に時系列ではなく、自分が関心のあるものを見る。
有益なフィードバックを返してくれる。

新しい人のスキル

Listener
Connecor
Crinic
Partial geek
Detective
Catalyst
Diplomat
Juggler
Approachable
Intuitive
Inquisitive
driven by relationships

社会的な現実をまねしようとすれば。
いろんな人がいろんな方向を向いている。

A possible way to think about this

// デモンストレーション中

Let's Break it down

handshake (bow)
greeting
response
handoff
feedback
make me smarter about me

上記のことを、オンラインでやるとすると。

エンターキーを押す。
Web サイトに日付があれば、アップデートしていることがわかる。
　デザインの要素として必要なこと。
sign in する。
誰なのかということを認識してくれる。 DOPPLR のように。
DOPPLRはソーシャル旅行サイト
　１年に一回、PDFのドキュメント送ってくれる。旅行の履歴。
　　どういうところにいったのか、どういう関係を構築したのか、
　　わたしのことを教えてくれる。
　月までの距離の 25% も旅行した。関係趣向。非常にユニークで興味深い方法

Photojojo というサイト。写真共有サイト。
　オンラインで毎年 5000枚くらいの昔の写真から、ランダムに自分宛に送ってくれる。
　素晴らしいサービスだと思いませんか？感謝の気持ちを思い出させてくれる。

Handoff
旅行に行く時に、近くにすんでいる知人を紹介してくれる。

Esty
自分でつくったものを eBay 風に売り出すことができる。

エンターテインメント性は素晴らしい。

threadless
Ｔシャツのサイト。デザイナーＴシャツを投票する。
Ｔシャツを示すだけでなく、そのＴシャツを着ている人を見せている。

Pandra
ミュージックサイト。
オプションとして自動的にサービスを更新したいかどうかを聞いてくれる。
お客の時間を尊重してくれている。

Overnight Prints
楽しく表現する手法がある。
さまざまな名刺を印刷できるが、つまらない。

Moo は同じ名刺印刷するサービスだがまったく違う。
flickr, facebook からの写真を自分の名刺に印刷する。
「生きて」いるページ。
簡単に説明している。
名刺が欲しいのは、印刷のことではなく、
自分をどう世界に表現したいのかを MOOは理解している。

適切なステップ

Think like a sociologist or ehonographer
いままでうまくいったことを繰り返しているのみ。

Be an observer first
まずは聞きましょう。客の人生に役立つ。ものを押し付けるのでは無い。
機械的な FAQ ではなく、人が答えて欲しい。

Join the lives of people vs. interrupting them
Find a "place' in the 'community' you are designing - be a part of it
Help users participate
Stand for something &offer value
Think constancy not episodic
Experiment:Listen. Rinse.Repeat

技術は絶えず変わっているが、
人間はそう変わらない。
世界に入って、人間関係を気づいてください。

http://slideshare.net/debs/
www.deborahschultz.com

Q. ソーシャルWeb のマイナス面に関しては？
A. 高校時代の人間関係に似ている。人気度に頼っている。
　何人の友達がいるかではない。
　私たちはそれよりも成長している。数ではなく感情が重要。
　目の前で無礼なことをやるよりも、Web でやることが容易である。
　オンラインでいじめは、人間性の悪い部分が見えてしまう。
　企業から見るとソーシャルメディアを怖がる。
　商品のことをオンラインで製品が最悪であることは
　困ったことではなく、対処できるので、チャンスである。
　ある意味で思いやりを感じる。
　けんかして仲直りする機会があるということ。
　six apart に関して、ブログが 24時間ダウンした時があった。
　本当に最悪なことがあった。皆が大きな声で文句を言った。
　彼らにオプションを与えることにした。
　１年間無料でサービスを提供することにしたら許してくれる？という質問をしたが、
　実は何が起こっているのかを知りたかっただけ。
　「透明性」が大切。透明性を維持すれば、謝る機会が常に与えられる。

Q. social web は 2010年にはもっと発展する。知識社会が結びつく？
　 social web は今後どう発展していく？
A. social web はここから伸びるというものではない。
　空気のような存在。インターネットを活性化するという人もいる。
　socail web と知識社会とは同じものではなく一緒に伸びていく。
　ひとつはモバイル化、よりスマートな取り扱いができる。
　企業と顧客が一緒に商品をつくれるマーケティングの媒体になっていく。

Q. 今リーチの話があった。友人がたくさんいるのではない。
　　生態系をたくさん持っていない人もいる。その違いは？
A. アーリーアダプター、影響力のある人が取り上げられがち。
　もっている影響力も大きい。それらの人はそのことを良く理解している。
　いったい自分たちがどういう話をしているのかを考えて対応している。
　新しいものである。
　ビジネスを考えれば、ソーシャルメディアによってコストは下げられるが、
　リソースを下げることはできない。
　広告をオンラインに投下する場合、全部バナー広告にするのではなく、
　マーケティングの予算などを、お客様とのソーシャルな関係構築を築くのに使うのが良い。
　オンラインのどこに広告を配置するのかを見極めようとしているのは無駄。
　ちょくせつ顧客とやりとりする方向に向かう。時間はかかるが拡張できる。

ソーシャルメディアのエキスパートは居ない。私もそう。

Q. 人に注目して、人と人がどうつながっていくのか。
　ビジネスというよりも人に注目してソーシャル web を展開していくことがわかった。
　今日ここに来ている人を見ると iPhone を持っていたり、情報リテラシーが高い人ばかりであろう。
　リーチへの課題は？

A. リテラシーのことについて質問されたのか、リーチに関して質問されたのかわからない。
　必ずしも美しい Web サイトや、iPhone うんぬんではない。
　正しいやり方でやることが重要。自分たちの顧客に応じた方法で。

　

[&] Web Directions East 2009 (Nicole Sullivan)

2009-11-13T14:51:00.001+09:00

Nicole Sullivan | Web Directions East

Design Fast Websites - Nicole Sullivan

Design Fast Websites

View more documents from Nicole Sullivan.

Nicole Sullivan
『高速ウェブアプリのためのCSSパフォーマンス』
------------------------------------------------------

今日は CSS アーキテクチャについて紹介します。
http://www.slideshare.net/stubbornella
@stubbornella

カスケードの基本について
高速なアーキテクチャ
エンタープライズサイズのスケールのため

カスケードを理解する。
BROWSER default Styles
すべてのブラウザが難しいスタイルシートを持っている。
さまざまな要素、デフォルト値をもっている。
そこにたくさんバグがあることもわかっている。
ブラウザごとにさまざまなバグがある。0じゃないのに0値だったり。
不必要なコードになりがち。
リセットコードを用いる。
開発の負担も軽減される。

CLASS ORDER

Borken!

同じメッセージが入っていて、わからない。

ORDER OF THE PROPERTY VALUE PAIRS
BROWSER IGNORES BITS ITDOESN't UNDERSTAND
理解できない CSS をブラウザが無視してしまう。
スペルミスの場合。color と colour など。エラーにならない。

ORDER of the RULESETS
大きな web サイトで何人で作業すると、
同じ定義が重なってしまう。

ORDER of the stylesheets
コンフリクトした場合、最後の定義が採用される。どれが勝つのか？
FROM the spec:
It Goes on...

実際に CSS の開発には、早く結論をださなければいけない。

ID AND CLASS
#nav p{color: red}
.nav p{color: blue}

INLINE STYLES
エクスターナルなものよりインラインのものが勝つ。
!IMPORTANT で強制する。

CSS INHERITANCE
インヘリタンスは親から子に継承される。

AGGREGATION OF RULES
くつかのクラス、それぞれのメッセージクラスのインタンス。

理解できればいろんなことができる。
スパゲッティコードになる。

CSS IS AWESOME

CODE IS TOO FRAGILE
新しい人に渡すと壊されてしまう。
専門家がわかっていることがわからないため。
成熟性が必要。
何回もコードを書いている。
web チームで使えるものだけを公開していく。
いい開発者はすぐにでてこない。

CODE RE-USE IS ALMOST NONEXISTENT
コードの再利用はしない。

FILE SIZE JUST KEEPS GETTING BIGGER

非常に複雑な CSSコードを書いてしまっても、
アーキテクチャの中に入っていかない。
非常にパフォーマンスの高いサイトでも数ヶ月で CSSが大きく、遅くなっていく。

HOW TO ARCHITECT CSS
オブジェクトオリエンテッドな CSS
CSSさらにパワフルにしていく
違いは？
今までは括弧の中だけを見ていた。
どのようにセレクタを選ぶかが重要。

TERMINOLOGY CAN BE CONFUSING
クラスといっても CSSなのか Java なのか。サブノートという意味なのか。
できる限り、何を意味しているのか示す。

OOCSS
wiki.github.com/stubbornella/oocss

HEDDINGについて
デザイナーは何を意図しているのかをつきとめる。
エレメントを再利用する。
いろいろなパーツを持ってくる。

AVOID DUPLICATION
二度手間を避けるようにする。
いいツールは無い。
ほとんど同じようなモジュール、ほとんど差異がないようなものを省く。
同じサイトの中では使わない方がいい。ほとんど違わないことに意味はない。

場所の依存性を減らすこと。
依存性をどう解決するのか。
sandboxing した。パフォーマンスの問題があった。
どういものなのか？
FUNCTION AREA() がある。
エリアの範囲内に戻す。
Heading のたとえに戻ると、意味のある大きさと色を保つ。
グローバルに定義されていないと、ページごとに勝手に設定してしまう。
グローバルカラーを定義できたとしても間違いがある。
ロケーションで別な定義づけされて使われてしまう。
黒い文字が必要なのであれば、モジュール内での色を定義する。
一貫性が保たれない。ルールの上にルールを重ねてしまう。

コードの意味と、デザインの意味が一致しない。
その欲求をどうバランスをとるか。
90% のユーザーはビジュアル側しかみないので、尊重しなければいけない。
似たようなものが無いのかどうか、デザイナと調整する。
もっとヘディングが必要ならクラス化を考える。

REFLOWS (and rendering time)
パフォーマンスのオタク的に心引かれるもの。
CSSサイズと HTTP のリクエストを考えると、reflow は同じレベルに無い。
reflow にあまり時間をさくのではなく、http リクエストやファイルサイズに対応した方がいい。

不必要な reflow が起こる理由はいくつかある。
ブラウザによって変わる。

Toggle classes as low in the dom tree as possible
Aboid setting multiple inline styles.
Apply animations to elements that are position fixed or absolute
Trade smoothness for speed
Avoid tables for layout
Avoid javascript expressions in the CSS(IE only)

CSSベストプラクティス

古くなったルールを使い回すよりも、複製する方がまだ良い。
デフォルトバリューを定義する。
避けたいのはエレメントをスタイリングすること。
どのルールにも同じ強さ、力関係をもたせる。
どのルームも同等に同じ権限があり、ルールに関してはファイルのどこにあるのかが違うだけ。
順番だけで優先順位がわかるように。
チームで取り組むときに作業が簡単になる。だれかと力比べをしてはいけない。
ブラウザ固有のルールを使わなければいけない場面があれば、別につくる。
場所にも気をつける。どこで対応するのかを考える。
やりすぎない。定格に合わせすぎない。なるべく抽象的なものにする。
なるべく小さな機能クラスをつくってもデザインにいかされない。
SINGLETON も避ける。つくっても意味がない。一つのエッセンスだけにする。
できるだけオープンな状態に。ID はキープする。スタイリングには使わない。
MIXINSを使う。to avoid repeating code.
ENCAPSULATION カプセル化。直接アクセスされず、変更されないように。

http://stubbornella.org
nicole@stubbornella.org
@stubbornella
groups.google.com/group/obuject-oriented-css

Q. CSSのフレームワークを使っていてパフォーマンスをもっと役に立つものに変えるためには？
A. いろいろ話は聞いています。ファイルのサイズに関してはとても気にしている。
560 バイト多くても 700バイト、
別な余分なものを入れないようにしている。
簡単な例としては、ページが三つに分割されているとする。
必要であれば、コードを 1/3 反復すれば良い。

Q. MULTIPLE StyleSheet , 複数のファイルを使っている時、どのように影響を与えるか。
A. CSS を一つのファイルにまとめるのが良い。キャスケードは良くない。
　開発環境がよければ、実際にプロジェクトの人で分かれたファイルを
　ツールを使って、まとめるのが良い。
　別のファイルがあって、通常のスタイルシートと同じように統合すれば良い。

開発ツールがまだ発展途上
別のオブジェクトでまとめた方がいい。
コンベショナルスタイルシートを使う。大変だと思う。

■おまけ CSS Wish List

CSS Wish List @JSConf

View more presentations from Nicole Sullivan.

CSS WISH , W3C にむけてつくったプロポーザル
CSS は素晴らしいです。もっと良くなります。
さまざまなパターンが反復されています。
hex 値で設定できるようにして欲しい。

ぜひ欲しいものの PROTOTYPE
mod/inner/hd/bd/ft の構造で、ラウンドコーナーを表現。
@prototype .mod の設定ができる。
allowd nested childern
prototype の修正ができるようにする。
MIXINS クラスネームをつけたくない時。clearfix など。
margin top の bottom, height - corner, hight の設定
非常にシンプルに。コーナーを丸くするのが少ないコードで。イメージを取りこめるように。

#SlideShare を直接フルスクリーンで投影してプレゼンしてたのが印象的。

[&] Web Directions East 2009 (Douglas Crockford)

2009-11-13T14:48:00.000+09:00

Douglas Crockford | Web Directions East

Web Directions East 2009

Ajax Security - Douglas Crockford

Douglas Crockford - Ajax Security

View more presentations from webdirections.

Ajax Security - Douglas Crockford
--------------------------------------
http://crockford.com/codecamp/ajaxsecurity.ppt

有名なセキュリティの話題。

The SAMY Saga (MySpace 2005)
JavaScript と CSSを隠した。
その結果勝手に Friends リストに付け加えられていた。
アカウントの数が倍増していった。
名乗り出た。
その結果重罪となった。
SAMYさんは悪い人ではなかった。
サーバーからは、悪さをしていることがわからない。
制御を与えてしまう。
トランザクションの中で、ユーザーのリクエストなのか、機械からのリクエストなのかわからない。

ブラウザは上記のようなことを避けることができない。
web スタンダードは、これを避ける方法には動いていない。
これは新しいことではない
cross site scripting は 1995 年からの、基本的は問題。
セキュリティの問題、ブラウザで対応できているわけではない。
Web として必要十分というレベルにいつの日か到達することがあるのだろうか？

何か脆弱性があった場合、新しいバージョンで直していくことができる。
時間がたつにしたがって、解決していく。
ブラウザにあたらしい機能が付け加えられると、
それだけ脆弱性が付け加えられているということでもある。

新しい機能の問題。
意図した結果にならない場合がある。HTML５もそう。
前提としてブラウザのセキュリティモデルにまだ問題がある。
徐々に修正していっても、最終的に十分ということにならない。
むしろ、有害な原因をたくさんためてしまっている。
開発者としては、完全なセキュリティの知識を持たなければいけない。
現在のセキュリティのすべての理解を求めるのは無理。

Web はこのままダメになってしまうのでしょうか？
Flash も Silverlight は、オープンではない。
Web は正しい方向にどこよりも近づいていると考えている。

どこに問題があるのか？
　標準に間違いがあった。
　"We will add security in 2.0”
　バージョン 2.0 でセキュリティ機能を追加するというのは間違い。
　そういう態度が間違い。
　セキュリティこそが一番最初から考慮しておくべき。
　後付けはできない。
　後から欠点をのぞくのは難しい。
　
暗号技術やセキュリティに誤解がある。
暗号化すれば、セキュリティが向上するわけではない。
DLNA の場合、パソコンにウィルスが入った場合、家電にまで影響を及ぼすこと。
もし予防できないのであれば、自分たちでやるしかない。
暗号化技術を使って、解決するというアプローチ。本来的には正しくない。

アイデンディテイ。
　誰がソフトウェアを書いたのか、信頼できるのか？
　システムが危険なことが起きそうだと予期しているか？
　ユーザーに認証を求めても、ユーザーは理解できない。
　質問の目的もわからず、理解できない。
　
いろいろなプログラム、早く処理しなければいけない時、
二つの検疫を入れていかなければいけない。
OS側、ユーザー側
タイムシェアリングや時分割、何人もの人が同じシステムを使う。
お互いのプロセスをわけ、リソースは共有。
いい方法だが、問題としてはユーザ同士のコラボレーションができない。
メインフレームの時代が終わってパーソナルコンピュータの時代がきた。

プログラムは意図的にインストールされているもの。
使い方、動き方が変化していくもの。
Web 経由でもさまざまなものがインストールされている。
ユーザ側の検疫と、プログラム側の検疫をわけている。
ブラウザ側も混乱する。複数のサイトがあった場合。
ページの中広告や、Widget や Ajax ライブラリなどが、サイトと同じ権限をもってしまう。

Turducken 　ターキーと、ダックと、チキンがレイヤー化されていて、
何を食べているかわからない。

Web 2.0 の問題ではなく 1995 年からずっとあった問題。
根本的な問題は解決しておらず、マッシュアップが増えれば増えるほど問題になっていく。
mashup は XSSアタックになりうる。
広告があるページにあるだけで、あまり良くないこと。
JavaScript としてはセキュアな言語として使える。
新しいモデル。

Object Capabilities
http://erights.org/talk/

相互の監視によって、お互いに被害を与えないようにして情報をやりとりする。
A から B にインタフェースを提供し、インタフェースの部分でデータを送る。
リファレンスの仕方に制限を与えることによって安全なモデルができる。

By Creation.
By Construction.
By Introduction.

最終的には情報を隠すことを考えたり。
リファレンスは無かったことにはできな。ファセットを使う。

Facets

Very expressive.
Easy to construct.
Lightweight.
Power Reduction.
Revocation.
Notification.
Delegation.
The best OO patterns are also capability patterns

セキュアな用件がそろっている。
ケイパビリティが良いのが理想。
Ajax ライブラリでやっているようなこと。

W3C は逆の方向に向かっている。
HTML5 はセキュリティの問題がカバーできていない。

広告の問題。
ECMAScript の部分。Caja ライクなセキュリティ。

Q. Caja とは？
A. Google Caja, JavaScript を安全な JavaScript に書き換えるもの。
　コードをチェックし保証するもの。問題を発生するものではない。
　Yahoo! でも使っている。どんどん Caja を使うシステムが増えてくるであろう。
http://code.google.com/p/google-caja/

Q. スクリプトに署名するのでは？
A. 署名があっても機能しない。アイデンディテイの混乱を招き、
　不要の権限を与えてしまう。ユーザーに許可を聞いても意味はない。
　攻撃者にたいして攻防策にならない。
　ケイパビリティーこそが鍵になる。

Q. HTML5 は大きくなりすぎている
　　別の解決方法はあるか？
A. いろいろやっている、web sand box (Microsoft)など
　Y! はモデルに関して、かなりの経験がある。
　次のバージョンに何が必要なのかわかっている。
　初期の FORM の形にもどって、もういちど洗い出しが必要。
　考え方を変えるしかない。
　これをやることによって、Web開発者にとってはもっと安心・安全できる環境になる。
　ECMA スクリプトの方でやっている。MS,Google らと協力して作業している。
　ミーティングが始まった。
　どういうのが一番いいのかという知識を広める。実際に形にしていこうという作業。

A. JavaScript で Dojo, jQuery などライブラリがある。
　　それらのフレームワークは安全だと考えている？
Q. フレームワーク自体は現在安全では無いです。
　　Dojo はかなり安全だと考えています。
　　Dojo をそのまま使ってしまうと安全なシステムとは言えない。

Q. ECMAScript 5 でかなり難しい問題解決する。
A. Caja はゲストオブジェクトがグローバルオブジェクトにアクセスできない仕組み。
　　JavaScript ではいろいろな方法でグローバルオブジェクトにアクセスできてしまう。
　　ECMA5 でより良くなっていく。パフォーマンスの部分も良くなっていく。
　　まだ DOM でラッピングしなければいけず、パフォーマンスの問題も含む。

Q. Google オープンソーシャルは？
A. OpenSocial は Caja を使っている、非常にいい方向だと思う。

[&] Web Directions East 2009 (Christian Crumlish)

2009-11-13T12:07:00.001+09:00

Christian Crumlish | Web Directions East

Social Media Design Patterns (BarCampBlock)

View more presentations from Christian Crumlish.

Web Directions East 2009

Christian Crumlish
『社会的なウェブインターフェイスの設計』Designing social interfaces
-------------------------------------------------------------------------------

Web Directions East 2009

Christian Crumlish
『社会的なウェブインターフェイスの設計』Designing social interfaces
-------------------------------------------------------------------------------
Yahoo Desing Patterns Library の創始者
design.yahoo.com
@mediajunkie

オライリーにも訳書の要望を入れている。日本語版も出るとうれしい。

ショーシャルインタフェースについて。
新たなインタフェースがでてきたときには、人は受け入れずらい、とまどう。
電話がいい例。
最初は使い方がわからない。なぜ電話が必要なのもわからなかった。
その場に居ない人となぜ話さないといけないのかわからなかった。
そのうちみんな気付いてきた。

アメリカでは携帯電話の使い方のマナーが悪い。
昔は人に電話するのではなく、家に電話して、取り次いでもらっていた。
携帯電話は場所ではなく、相手のポケットに電話している。
電話は個人にもとづいている。
電話が変わってきたころのことを覚えている。
携帯電話は声が大きくなりがち、お互いに大きな声でやりとりしてしまう。
携帯電話に関して、まだエチケットが確立していない。
Web インターフェスに関しても、ソーシャルなものであれば、同じ問題があてはまる。
慣れるには時間がかかる。

ソーシャルデザインパターン
このプロジェクトではさまざまなパターン、プラクティス、インタフェースのデザインを行う。
ソーシャルデザインのプロセスは目立っている。
社会的な要素を組み込んでいかなければいけない。

Pave the cowpaths
どこに動物のあるく道ができる？
道ではなく、ショートカットで歩きたい。
うまく道の作り方ができていない。
Web のインタフェースを使うとき、期待された使い方をしていない。
間違って使っていると、無理やりコントロースするのはよく無い。
ユーザがどう使っているのかを見て、それをサポートするべき。
ユーザの振る舞い、それを取り入れていくのがいい。
Twitter での使われ方など、ユーザが発明したこと。ReTweet もその例。
ソフトのインタフェースでシンタクスを有効に使う。
Twitter でやっていることはユーザーの中で広まっている。
@???? でユーザのプロファイルに飛んでいく。
ユーザが実際に行っている言動を理解して、必要な機能を提供する。

dogster というイヌ好きのサイトがある。catster もある。
ソフトのもともとのビジョンとしては、ソーシャルサイト、写真をシェアすることができる。
ペットの写真を貼り付けることができる。
Web サイト、ペットの写真があるのであれば、それをいかせばいい。
ペットの詳細サイトとして発展していった

Talk like a person
人のように話す。

どのように使えばいいのか、使うことによってわかる。
お互いにわかりあえるような言語を使っているのか？専門用語ではなく。
たとえば、銀行であれば、ビジネスライクである必要があるが、
ソーシャルサイトであれば、人を呼び込むようなフレンドリーな分かりやすい言葉で。

話し方、
　How to talk like a person
Conversationnal voice
self deprecating error messages
ask questions
your vs my
no joking around

通常会話調というとカジュアルである。
どの世界でも会話調という表現がある。コミュニケーションとして正しい方法がある。

エラーメッセージ、ユーザが間違っている気持ちにさせてはいけない。
コンピュータの側が間違っていることを示す。
常にユーザーではなく、サイトのオーナーに責任があると見せなければいけない。

実際の世界では質問すると当然回答がえられる。
いうべきことを聞きたい。質問することによって関係性を深めていく。

所属するところではない、個人が自分考えていること。
所属には関係ない、ほかの人が関与することではない。
個人的なもの。
ソーシャルな経験のなかでかかわっている人のこと。

ジョークを入れるには注意が必要。
会話っぽくすると、ジョークを入れようと考えてしまうが....
リスクがある。ユーモアの感覚は一般的に面白いと思ってもらえても、
そうでない人が必ず居る。
混乱してしまったり、わからない人も。
ソーシャルな環境では注意が必要。

Play well with others
ほかの人ともうまくやる。

パターンを使う、慣れているものを取り入れる。標準を取り入れる。
新しいもの、改善を付け加えてもいい。

レゴがいい例：
ブロック自身は再利用可能、標準のもの。

Embrace open standards
Share data outside of the bounds of your application
Accept external data within the sphere of your application
Support two way interoperability

標準を取り入れる。
データが外でも使えるように。
外部のデータも受け入れる。
双方向でインターオペラビリティが大切。データのポータビリティが大切。

Learn from Games
ゲームから学ぼう

若い世代はかなりゲームを楽しむ。
スタンダード、楽しみをわかっている。
ゲームに慣れた世代がすぐに使えるようにするのも大切。
アイデアをゲームデザインに学ぶのも重要。
ソーシャルデザインはつくったら終わりではなく、変化していくもの。
建築からルールを学べる。
いつなにをやるかといったことが始まっていく。
価値のある空間をつくって、ユーザに育ててもらう。
リズムがあるところで、思ってもいなかったことさえも実施してもらえる。

Game Nverending いつまでのできるゲーム。
このゲームは非常に成功したソーシャルゲーム。Flickr のもととなったもの。
ゲームからソーシャルな体験につながっていった。

Respect the ethical dimension
倫理的な部分を尊重する。

何かうまくいかないとサービス提供者の責任になる。
どれだけの倫理観、価値観があるか。
判断していかなければいけない。
ビジネスと天秤にかけて、どれだけ倫理観を持たないといけないか考える。
決まりは無いが。

推奨できないもの。
tagged.com
メールアドレス、パスワードを入力しないといけない。
そうすると、アドレス帳にある人全員にメールを送ってしまう。
8000万以上の人が登録したが、いったいどれだけの人がイライラしたのか。
勝手にワナをかける。見えづらいチェックボックスで承認させて。

96 のパターンがある。

人のアイデンディテイのパターン
人の活動に関するパターン
コミュニティのパターン
　上記３つがソーシャルスペースになる。

Give.....
人々にどのように情報を与えるか。

MIT の pasnona , カラフルな色で、characterizing してくれる。
同じ名前だと、すべての人がミックスされる。
アイデンディテイをはっきりしないといけない。
自己をどうやってみるか。
どうシステムに入ってもらうか。
評判のパターン。どれくらい利用しているのか、信頼できるユーザなのか？

ユーザーカード、プロフィールの簡単なサマリ。
ユーザーカードは長いプロフィールの濃縮バージョン。
汎用的なアイデア。
friendfeed や flickr の例。その人の詳しい情報も、簡単に見ることもできる。

社会的な目的を考える。
単に登録してもらうだけではない。

Wha't your social object?
何か対象物が必要。

キャラでもモノでも、趣味でもいい。
グループ化していって、話が盛り上がる。
最初はそうやろうと思っていたわけではないが Fake もいい。
本名の重要だが、Fake な人間も機能している。

ウクレレが好きなのだが、Twitter で反応がもらえたりする。
やりとりができると、反応がある。人間は人間について語るのは難しいが、
対象物があると、話題が盛り上がりやすい。
飛行機に乗るときにはいつもウクレレを持って乗ると、
話題作りができる、対象物があると、人と人のつながりがうまれる。

対象物だけではダメ、なにか活動を、
集めなければできないものが、ソーシャルに重要。
1から多数への一方通行のメディアではない。

フィードバック、好き、嫌い、星をつけてレーティングできる。
いいのか悪いのか評価ができる。
人がいて何かオブジェクトがあり、レビューがあれば、交流がうまれる。
コミュニケーション、双方向のやりとりは、その後にあるもの。
直接コミュニケーションするよりも、
ものを介したほうがきっかけになりやすい。

コラボレーション。
協力関係。
一緒にオブジェクトを作り出す側にまわる。
すぐには必要ないかもしれないが....

ツール。どうやって対応するかのツール。
成功しているソーシャルサイトは、みんながそこに登録している。
そこから個別なものが発生する一つの生態系。
その中でたくさんの活動が行われている。
　検索したり、フィルターをかけたり、ツールが必要になる。

ソーシャルオブジェクトに関してはダグが利用できる。
レーティング、フィードバックのパターン。
Yelp の例。
Yehoo! Movies の例
A,b,c,d,e,f 学校での成績の付け方と同じ。A-, A+ とか。

Share This というパターン。
SHare this in the wild の例
Facebook の例

人と人のつながりによって、たくさんのことがおきる。
コミュニティである必要は無く、コミュニティとソーシャルは一緒ではない。
自分のカルチャーをつくって、何かをおこなう集団。
コミュニティは夢をもっている。
コミュニティは個人個人だけではなく、オーナーがいる形態。
コミュニティ自身が世界をつくれるもの。
Gently moderate
謙虚に動く必要がある。ルールをもって秩序正しく。

友人へのコネクション。分類するかもしれない。
コミュニティのマネジメント。
現実の場所。実際の世界と結びつけをする。
実際にあったときに本当の結びつけができる
関係性の強さを持ち込む。
文書にまとめるには限りがあるが。

Adding Friends パターン
Dopplr の例

Circles of connections パターン
カテゴリわけ。
Plaxo の例
Flickr の例

Public Conversation
Twitter の例

実際の世界でイベントを開いてもらおう。

Geo パターン。
場所で人がさがせる。
Geo in the wild (WHere for iphone)

まとめ　（サイト参照）

アンチパターンは？
　いいアイデアに見える、実際は問題が発生するもの。
Cargo Cult
DOnt' break email
password anti-pattern
ex-boyfriend bug
potemkin village

Designing Social Interfaces (O'reilly)

[&] Web Directions East 2009 (Andy Clarke)

2009-11-13T12:04:00.000+09:00

Andy Clarke | Web Directions East

Walls Come Tumbling Down

View more documents from Andy Clarke.

Web Directions East 2009
Andy Clarke『壁を壊せ』
--------------------------------

Walls Come Tumbling Down
Andy Clarke

資料の日本語は Google Translate で翻訳しました。

イギリスにあるデザインスタジオ。
デザインワークフローのいかし方。
学んだことも著書にまとめている。
Web デザインワークルフロー（訳本）
DVD も何本かでている。

常に Web デザインの仕事ばかりではない。
プラスチックのファクトリーでも働いたことがある。
この初期の仕事の製造のプロセスからもさまざまなことを学んだ。
経済不況の時代、時間を節約したい、お金も節約したい、
一番重要なところに費やしたい。

創造性は不可欠な要素である。
より多くの要素を想像する。
web デザインのワークフローを見直す。
よりクリエイティブになる時間の使い方。
Web デザインがどういうものなのか、誤解がある。
web デザインの取り組み方は製造業のやり方でやられている。
印刷などと同じになっている。
よりクリエイティブになるには？
クライアントや、上司とのやりとり

あたらしいワークフローのやりかた
ブラウザ内でのデザインをする。
　Photoshop ではなく、ブラウザの中で。

　設計改善のワークフロー
　設計はブラウザで、
　節約する
　設計システムの無いサイト

システムをデザインし、モジュール型で再利用できるもの。

時代遅れのワークフローを破棄する。
イギリスで始めにデジタルカメラをとったのは、自分かもしれない。
デジタル写真というのが写真のありかたを変えるのか？
製造業のプロセスを踏襲していた。
非常に非効率で、時間もお金がかかるプロセスのまま、
すべてのプロジェクトにあてはまるものでは無い。

現在の Web デザインは Photoshop で静止画像を作り、みせる。
その後、開発者がコードに直している。
そこで初めてブラウザ上でどう見えるのかがわかる。
実際はブラウザ間でどう見え方が変わるか、それだけのテストの部門があったりする。
この作業自体が無駄。

プロセスのあり方を考えないといけない。
いちだんかい　戻って考える。
開発者側はデザインを解釈して HTML/CSS 具現化する。
デザイナーは Photoshop でデザインして、ブラウザで表現できないことの腹をたてる。
今よりももっといいプロセスをつくっていけるはず。

皆さんに提案したいのは、デザイナー側とコーダー側でやりとりして、
時間を無駄にしない、クリエイティブに時間を使う。質の向上にも貢献できる。

ブラウザ内でデザインすることで、非常に短期的なフォーカスで仕事をしていける。
集中してできる。断片的にもデザインできる。
自分がいいと思ったものを見せて、改善していくというプロセス。
グループで作業するにも向いている。
やりとりをしながら細かい修正していくことができる。
クライアントやりとしりながらできる。
短い時間で大きな進捗が得られる。

その場でインタフェースを変えれば、すぐ修正し、すぐ見られ、試行錯誤できる。
ユーザーも巻き込んで進めていくことができる。
相手のオフィスの中でも短い時間で作業できる。

このプロセスの間にクライアントにも大きくかかわってもらう。
以前はクライアントへ一番のプランを一方的に提案するばかりであった。
デザイナーは多くの場合、クライアントのせいにしたがる。
クライアントが文句をつけるのは、作業にかかわりたいという欲求を満たすために
ものをいっている場合もある。
最初からクライアントにかかわってもらい、密にかかわってもらうことによって、
理不尽が要求がこの場合おきない。
フラットな静止画像を見せることで終わらない。

設計はブラウザで。

まずコンテンツありき。
デザインというのは決して機能しか決まっていない段階で決めるべきではない。
双方向に様子を見ながら、Web 上でプロセスを進めることができる。
静止画を見せるだけでは、動いている Web サイトをつくることはできない。

Internationalist Magazine
このプロジェクトでは何をやっているのか？
オープンデザインプロセス。すべてのプロセスにかかわっている。
フロントエンドも、ユーザービリティも、HTML/CSSも。
実際にテンプレートを作り CMSとうまく調和できる形で。
35のテンプレートが実際にある。
アーティクルのページもあり、表紙もあり。
これを 3週間で提供した。
実際にやっている作業はスピードがあった。
お金は無いが、短期間でもっとやって欲しいと考える。

古いワークフローでは、たくさんの静止画像をつくってしまう。
ワークフレームとか、静的なプロセスはまだはびこっている。
もちろん悪いといっているわけではない。
たとえば、色を変えるとか、位置を変えるとかは、非効率。

なぜわれわれはブラウザを使わないのか？
実際に本当に必要なものを使う。
もっと流れがあって、効率性のある、問題点を解決するもの。
どうやって流れのある流動的な操作を提供するのか？
ブラウザでテストすれば、もっと速いプロセスを回せる。
Photoshop の場合、時間がかかりすぎる。
HTML/CSSだとすぐ見られる。修正できる。
デザイナーはクリエイティブな作業をできなければいけない。
最終的にどのように見えるのかを提示する。
　モックアップで、何種類かの見栄えを提示するばあい、
　マウスオーバーなど動きのあるデザインを静的な画像でうまく見せることはできない。

クライアントもデザインのインタラクションに関与することができる。
実際に初期の段階から作り込むことに意味がある。
クライアントに、静的なデザインを見見せることを止める時がきた。
静止画を見せるのはもう古い考え方。

問題は静止画に関して、クライアントがゴーサインを出してしまうこと。
クライアントがそこで決定してしまうのには問題がある。

Web サイトが、すべてのブラウザで全く同じように見えることは必要ですか？
その答えは「No」
すべてのブラウザで同じ経験ができれば良い。
ここを間違えると、最終的に間違った道になってしまう。

とにかく Web サイトで同じように見える方がいいという観念がまだ残っている。
すべてのブラウザで同じでなくてもいいことがなかなか理解してもらえない。
別に壊れたわけではない。
違うということは壊れているわけではない。
見方とか経験とか、技術的な経験も違う。
時々、ベースレイヤーを共通に。
ブラウザによる違いをテストしておく必要がある。
ソリューションごとに時間がかかる。
Web のアクセシビリティをどこまを取り入れるのはプロジェクトによる。

タイポグラフィーについて。
たとえばスタイル的に、最初のパラグラフで大きめのフォントを使うとき。
古いタイプのブラウザだと対応していない表現がある。
それでも十分満足できる。
少し読みやすく調整する。
iPhone 対応にする時
少し派手にする部品もあり。
いろんなブラウザを使っている人には見えない部分もあるかもしれない。
装飾的に使っているものは見えなくてもいい。
微妙なシャドーなども、
ブラウザで SHadow をサポートしてしないものもある。
でも、何かが抜けているということには気付かないものがある。
気付かない人の方がおおいはず。
box shadow,どのブラウザでもできるわけでも無いがいい。
デザイナーはすべて同じに見えないことを理解する。
クライアントに説明することは難しいが。

CSS はいくつかのモジュールに分かれている。
すべての古いブラウザが、新しい CSSをサポートすることはありえない。
すべてのブラウザで同じように見せるために時間を使わない。

一番最新のブラウザのためにデザインをしていい。

Selling Universal IE6 CSS to clients
クライアントに IE6 対応に時間を使うか、クリエイティビティに時間を使うのか選べばいい。
一歩進めるために一番最新技術をつかって、Web で何ができるのか、
より先に進めるために、デザイナーも成長が必要である。
業界として共通のパターンを作り、価値を付け加えるように、
最新のアプローチを使うべきと伝える。

ぜひ、どのようになるのか、考えて欲しい。
仕事のためになにをして、何をさし示すのか？

http://twitter.com/malarkey
stuffandnonsense.co.uk
forabeautifulweb.com
transcendingcss.com

Q. 日本ではあまり事例として見られないが。イギリスでは普通に行われているのか？

A. イギリスでも普通ではない。
　　クライアントに理由づけを説明するのを考える。説得しなくていい。
　　自分のやり方を押し付ける。携帯でも見えることで説得できる。
　　予算的にも増えるコストもない。
　　ブラウザ間で同じように見えることには価値がないことに気付く。
　　あと三年すればこの考えが一般化する。

[&] Web Directions East 2009 (Cameron Adams)

2009-11-13T10:43:00.001+09:00

WDE2009 | Web Directions East

Web Directions East 2009
---------------------------
Cameron Adams
『Google Wave の裏舞台』Making waves

Google wave
複数の人々が同時に。
コンテントの編集。コラブティブドキュメント。
Wiki スタイル。
最初にスタートする時には慣れないかもしれません。

"Google Wave Drip s With Ambition" - MC Siegler, Techcrunch

一ヶ月間に製品がリリースされ、その前にはビデオしかなかった。
ビデオのいいところは、いろいろな質問があった。
何ができるか、いろいろ想像してもらえた。
Google Wave を使う、いろいろなシナリオがあった。
注意深い楽観主義であった。教育を変えてしまうアイデアもあった。
Google Wave はテレポーテーションじゃないかといわれた。

このような形。
Google wave のストリーについて、
そのようにデザインしていたかを。

Googel Maps からスタートラズをエンが Mapping アプローチについて。
地図にランドスケープ、あたらしいインタフェース、地図の確信であった。
google Map のアプローチが Google wave につながっている。

3つのエリアを１つにする。
１．CENTRALISEDすべてを一つのサーバに集める。だれがどこからでもアクセスできるように。
2. DOCUMENTATION ドキュメントについて。
3. Discussion

この三つのアイデアを革新的ではない。みっつとも見たことがあるもの。
ワープロも 20年前からあるもの。

ディスカッションも、古くからある。世界中の人が使ってきた。
特に人気が出てきたのはクラウド的サービス。
これらを連結させたサービスは無かった。
一つのところで、ドキュメントをサポートし、ディスカッションできる。
別々のものをただ張り合わせたものではない。
GOogle wave はシームレスな形で、３つを一つの体験にしてあげるもの。

いろんなコミュニケーションがオンラインで

マーケットは第四四半期はどうですか？という質問があったとする。
じゃあ、ミーティングでこれらのことを話すとしましょう。
４人とか５人の人がメールで返答してきた
もしかしたらプリントアウトして、さらに仕事を大変にするかもしれません。
もしかしたら、２回目のメールをする時にミスをしてしまうかもしれません。
ミーティングの際にはリマインダを送らないといけません。
議事録をかかなければいけません。
議事録を送らないと
議事録の間違いをチェックしないと。
議事録の中からまた戦略をかいたドキュメントをかかないといけないかもしれません。
最終的な戦略のドキュメントがやっとのことで完成します。
３種類から４種類のアプリケーションを使い、

Google Wave はドキュメントが中心にあって、皆で編集する形になる。
googel wave に参加者を追加していく。
自分たちのコンテントも入れていく。
共同でレビューをつくっていく。気にいらないところがあれば、編集できる。
議事録もすぐにでき上がる。
必要な人に伝えることができる。
ミーティングの後にすぐに活用できる。
皆でチェックし、編集・修正し、確認して、最終的なドキュメントができあがる。
同じオブジェクトに皆が関与できる。
すべて履歴が保存される。
どういうプロセスでできあがったかを履歴で見ることができる。

Wave は流体になって、すぐに流れていくことができる。
今まで入っていない人が急に chat に入ってくることもできる。
今までにないこと。
リアルタイムであること。
ロボットが Wave とインタラクションするようにプログラムを書くこともできる。
自分でタイプしたものを翻訳するロボットもある。

もう一つ面白いのは、ガジェットを組み込むことができる
ガジェットを埋め込むと、Sudoku を何人かで遊べる。
非常にパワフル。
ドキュメントだけではなく、アプリケーションになりうる。簡単！

"Google Wave : Finally, Innovation" - Waveomatica

Wave イノベーションがキーワード。
企業の武器として使われている。
経済学者は違う言葉を使うかもしれない。

AWESOMENESS として使うべき。
四つのエリアを説明します。

ETHICAL PRODUCTION
倫理的なモノづくりをする。

INSANELY GREAT
社会の人々が欲しいと思わせるものをつくらないといけない。

LOVE
クリエイターの「愛」
Apple Store の例のように。Apple が好きな人たち。

THICK VALUE
価値のあるものをつくらないといけない。
人々が利益を得られるようなもの。

AWESOMENESS の色になる。
インスパイアされるようなプロダクトをつくる。

インベーション = AWESOMENESS

Goole で働いている、三つのエリアがある。
一つ目は、新しいアイデア。 (jagolive)
IDEAS
考えを歓迎する風土。アイデアを使ってもらえる社風。
wave は３−４人でつくったプロトタイプから始まった。
ラリーとセルゲイに提案する時があり、
アイデアに共鳴する人を引き込んでいける。
自分が働く職場を信頼できることはアイデアをいかしていける。
アイデアを歓迎する文化を関係するには、
すべてのアイデア、会社をダメにするアイデアも聞かないといけない。
競合にはできないアイデア、企業をひっぱっていくアイデアが必要。
アイデアを最大限活用する。

EMPOWER
従業員への権限委譲。
20% ルール。一週間で１日好きなことをしていい。
従業員にたいして、権限委譲をしている。
新しいアイデアを思いついて、それに使える時間がある
そのアイデアをもとに行動する権限が与えられているということ。
いいだしっぺであれば、チームリーダーになれる。
新製品のような大きなものではなくても、新機能のようなものでも。
うまくいくようであれば、もっと人的資源も追加してくれる。
そこからどんどん進展していく。

RISK
リスクをとれないとイノベーティブなことはできない。
Google では小さなリスクをとっていく。
革新を共有して、最初は小さなものをつくって、
うまくいくことがわかってから、次にいく。
まずはプロトタイプから。１万ユーザー〜10万。１００万。
小さくすすんでいく。途中で問題があれば、撤退できるようにしていく。

DESIGNING INNOVATION

PATTERNS
デザイナーであるからには新しいパターンを扱わなければいけない。
何かと何かを比べて、何がうまくいくのか、以前うまくいったのは何なのか。

Web のデザイナーとして実績をつみかさねていくと、パターンが蓄えられる。
建築や、テキスタイルのパターンを Web デザインにいかしていくことができる。
心の工具箱から、一番いい道具を出していくことができる。

何か問題があった時にアプリケーションの機能をつくりたいときに、
そのパターンにあうものを探す。
まずは２つの分野で比べる。
どれだけ発見できるのか、人が新機能を見たときどれくらい認識できるのか。

もう一つは効率性。
その機能を知っているひとが、どれだけ使えるのか。

よくあるテキストボックス。
そこにテキストボックスがあれば、そこに入力すればいいことがわかる。
一見してすぐ使うのかがわかる。
効率性も高い。

このパターンを何かほかにあてはめられうのか？
テキストボックスがブラウザの上の方にあれば、検索ボックスになる。
そのようなパターンを一つの領域からほかの領域にいかせる。

ラベルつきのテキストボックスは効率に関しては下がってくる。
このパターンをあてはめようとすると、期待するほどの効率は無い。
Safari 風検索ボックス、ラベルが無くてもアイコンがあれば、検索できることが理解できる。
見つけやすさも高く、効率もいい。下がった効率を回復させることができる。

graph上のどの位置にするのか考える。
一年に１回しか使わないのか、一分に１回使うものなのか、
それによってパターンが決まってくる。

ちょうどいいもの。
iPod はさまざまないい要素がある。
MD player は旧来のパターンが活用されている。
MP3 player は数千曲が入っているので、旧来のパターンは使えない。
ドラムマシンでは、ジョグダイアルで音を探す。
さまざまなデータが入っている中から探せる。ハイエンドオーディオを参考にした。
効率が高いかというと、まだまだ。

wave の中ではどうやっているのか？
メッセージが３つあったとする。
メッセージ１から入ってくる。
ほかの人が wave に入ってくる。
E-mail できないことは、別のスレッドから続けることができる。
ブランチをつくることができる。
かなり長いリプライになってくる。
どのメッセージにどう答えればよいのか？
すべてのリプライにメッセージを返すのではうまくいかない。
実際にどのメッセージに返答しなければいけないのかわかりにくい。
すべてにたいしてリプライボタンがあるではうまくいかない。
こういった会話はかなり複雑になる。
実際にデザインする時に簡単に使わなければいけない。
　Continue というボタンをつくったが分かりにくい。
　Indicator をつくった。次のメッセージがどこなのか
その方が効率性は高いが、発見性は低い。
簡単に使うことができて、すぐに見つけることができるのか？

Discoverability vs. Efficiency

User Testing
このデザインができた。
革新的なデザインはかなりのテストが必要。
初めてのものをどうテストするのか？どうやって適切なものを見つけ出すのか。
最終的には、たくさんの人がこのデザインを好きになってもらえるのか？
E-mail でもメッセージングでもないものをどうテストするのか？

新しい Facebook のデザイン。
なんでデザイン変更するのか怒った人がいる。
何もしなければ、何も発展しない。

"Change is good, And change makes us angry" - Ben Parr, Machable

実際に変更かけることは最終的にはいい結果がまっている。
ヘンリフォードがいうには、
人はもっと速い馬が欲しいといった。
ユーザーテスト 18月かかった。

まだ製品としては立ち上げていない。
18月としては製品のテスト期間としてはまずまず。
実際に商品として出す前に 18月必要であった。
チームが 50人くらいいた。
何がうまくいかないのかを話し合った。
プロダクトにアクセスできるよう準備しなければいけない。
どのように活用できるのか、もう一度確認し、発見する。

まだユーザが難しいと思うことに対応しなければいけない。
当然編集する時間、ドキュメントクライアントはどうだろう？
チャットがある、ドキュメントがある、それがもともとのアイデア。
何かをしなければ、革新性はもてない。
疑問に思うことはあるかもしれない。
あまりにやり過ぎると、危ない目にあるかもしれない。
新しいものを出すと、慣れるための時間が必要になる。
気をつけなばいけないのは、重要なものを見逃さない。
古いものがなくなって、混乱を招くかもしれない。
ユーザーが気に入ってくれればいい。
基本がきちっとしていなければいけない。

ユーザーの体験。
「wave はがっかりだった。しばらくやってみたら、
まだ wide リリースになっていないので、がっかりした」cole camplese

wave は世界を広げたと思う。
我々にとって怖いプロジェクトでもある。
100% ユーザに問題がものにはできない。
製品を使ってもらって、体験してもらうしかない。

「最初から新しいものは難しい、
　最初は半分くらい、その後広げていけばいい」 - Richard Gabriel

どれぐらい人々が気に入るかは出してみないとわからない。
使わない人や、気に入らない人もいるかもしない。
60億の一部に気に入ってもらえればいい。
出る杭は打たれる。
我々は非常にすばらしいことをやれば、批判はついてくる。

Twitter, 始めはだれもついてこなかったが、
今は皆が受け入れている。
wave も twitter のようなもの。

wave クライアント、プロトコルとしてリアルタイムでメッセージを交換する、
オープンソースの wave プロトコルでリアルタイムにコミュニケーションする。
より良い wave クライアントを誰かが使うかもしれない。

wave クライアントがたくさんでてくるかもしれない。
たくさんの wave クライアントのための種をまくしかない。
すべてのコミュニティが wave を背景として成長して欲しい。

ぜひ皆さんも自分たちのアイデアをまいてほしい。
11/27 wave Hackason が開催される。

[&] THE OUTLINE

2009-10-06T21:55:00.002+09:00

青山ブックセンター：『THE OUTLINE　見えていない輪郭』発売記念トークショー&サイン会　深澤直人 x 藤井保

THE OUTLINE 見えていない輪郭

短い時間であったが、思いの丈が伝わってくる、素敵な対談でした。
何でも全部分かるように指し示すのではなく、
「よくわからなかったものが、ふわっと分かる瞬間が素晴らしい」
という想いに同意。
「どうやって輪郭を消すか、どうやって真実を見つけるかが大切なこと。」
なんだってこと。

-----------------------------------------
「THE OUTLINE 見えていない輪郭」出版記念
深澤直人 x 藤井保　対談＠青山ブックセンター
-----------------------------------------
モダンリビングの連載が発端。
2009/10/16 〜 2010/1/31
『THE OUTLINE　見えていない輪郭』展
http://www.2121designsight.jp/schedule/outline/index.html

深澤：
最初、モダンリビングから執筆の依頼があり、それは断った。
写真なら、藤井保さんの写真ならと言ったら、話が進んでしまった。

藤井：
人物ではなくプロダクトを撮影するので、スケジュールに自由があった。
まとまったら展覧会がしたいね。といっていた。うれしくて感謝している。

３ページ写真に使うのは異例のこと。
３つの場面で撮るというコンセプトが生きた。

表現全般に言えるのだが、一つで全て見せるのは
説明的なアングルやトーンになるのだが、
三つで表現するのであれば、抽象的な捉え方が三枚の写真でできる。
三枚トータルで世界を描ける。

深澤：
藤井さんのことはブライトの写真、JRの写真で知った。
そこに一番必要である視聴されるべきコンテンツが
小さかったり、暗かったりする。
マグライトの広告が印象的だった。

非常に奥行きの深い、記憶をたどるような写真。
無印の写真の時も水平線はるかも見えるのだが、手前の草もはっきりと見える。
初めは「スケルトン」（ウィスキーのハイライトの中に遠くの景色が映ったもの）
その後、どんな写真を観ても、あまりにも鮮明で強すぎる感動があった。
写っているものを超えた何かがあったと思った。
どういって撮るのだろうか？　撮影をゆだねてしまわないといけないと思った。
普段は写真を撮ってもらう時には、うるさく注文するが、
今回はお任せしてしまった。
僕の作ったものは語っていない、
どう考えて作ったのかを捉えてもらえなければいけなかった。
新鮮に思った。
自分でもびっくりするような視点、写真があった。
驚きの４年間（の連載）であった。
そういった視点、現前とリアルがあるのだけれど、みえなかったものを見てほしい。
この仕事は意義深いものとなった。

藤井：
プロダクトが事務所に届く。
僕の表現は二次元の表現。プロダクトは三次元。
これほど平面を意識したことは無かった。
深澤デザインであれば、上から見る、横から見ると平面性を得る。
図面の段階で見たものが立体としてここにあるということをイメージする。
そこでデザイナーが美しいと思ったものを写真でもう一回平面に戻す作業をしている。

深澤：
生活になじませようと思ってデザインしているのだが、
リアルに頭の中にある画像を物にしていることが良くわかった。
図面のような構築物をつくっている。
図面のように作るのは難しいこと。
むしろ生活になじむよりも、頭の中のもの。
感覚的に麻痺して、こういうものがあるんだというマジカルなこと。
そう思って考えている。。という図面のような写真を撮っている。
真上とか真横を探しだすのは難しいだろう。

藤井：
障子に映った影絵のようなもの。
バックミンスター・フラーのフラードームで撮影。
障子の前に置いたような、真横を撮る。最も椅子らしいという線が浮かび上がる
瞬間がある。この椅子でなければ、
こういう撮り方はしない。
作為があって作るのではなく、物が置かれて、
椅子がその空間にいる場所は、それしかない。

深澤：
視覚的にみると、良くみるとオレンジ色の表面みたいにみえる。
自然光で撮るという原則のもとで撮影している。
角が丸い椅子であることがわかる。
オレンジ色の表面なのに、角が丸いことがわかる。
十分に奥深く見える。
僕らが見ている世界なのだが。
確かにそうだと思う。
見えてくるまでに時間がかかる。
それはテカニカルなことだと言うが
びっくりしてしまう。

藤井：
表紙のアームチェア。
B＆Bイタリアの本社ビルのエレベーターホールの乳白色のアクリルの壁。
これもいわゆる障子越しの陰。
置くといろいろなものがやどる。
雪山に見えたり、砂山にみえたり。
そうするとカメラの位置が決まる。
ディテールにやどった風景を導かれるように撮っていくのかもしれない。

深澤：
導かれるということは、写真は虚像でしかない。
いくらでも脚色できる。誇張することもできる。
そういう道具として使われてきている。
その中でできるだけ自然な風景をそのまま撮るように徹しているのだが
こんなふうに撮れるのがすごい。
そのリアルが一番重要。作家の意図。
こういう風につくろうかということが匂えば、匂うほど嫌なものになる。
なるようになる、そこに存在したのかが、いかに見えにくいことなのか。
そういったことがアウトラインとして表現されている。

藤井：
自然光のはいるスタジオの様子。
上がガラスの屋根になっていて、白い布からディフューズされた明かりがはいってくる。
今回の 21_21 の展覧会でスタジオの原寸大を再現した。
そこの光を是非見てほしい。ファインダーを参加者が見ることができる。
大胆な提案。撮った写真とファインダーを同時に見ることができる展示。

深澤：
陰が無い。コマーシャルフォトの表紙。
記事の中の撮り方のレクチャーで驚いた。
陰が無い。ということ。輪郭が無いこと。
赤の色が外の空気にシミ出ているシャンプーのボトルの写真。
陰が無い写真を撮るのには、何かあるの？

藤井：
光は人をどういうふうにみるのか？
朝日から夕日まで。
谷崎潤一郎の『陰翳礼讃』、障子越しの光。庭の石に反射した光。
面光源で陰はなく、反射した光ではない、
内面に蓄えた光を発光している。
これだ！という想いはあった。
そういう物自体が発する何か、光やアングルは常に意識している。

深澤：
方位光、全部光りで囲まれているという表現。
藤井さんの撮っている写真の雰囲気。
陰を出すということ。
彫りの深い写真をかっこいい写真をとりがち。
陰を撮るのが常識的だと思っていた。

藤井：
深澤さんのプロダクトは直線、直角という表現が少ない。

深澤：
直線っぽく作っているけどそうではないんだろうか？

藤井：
すべてが R(曲線）で作られている感覚がある。
そうすれば、階調がでる。
立体物だからそういう物が宿っていく。

深澤：
エッジの処理、アウトラインの処理が０なら、手が切れてしまうほどのもの。
僕らが見ようとしているものは、まったくの「0」なのか「0.5」なのか。
1mm の半分をグラデーションで表現している。
人間は全部はっきり見てしまうが、実はぼけているもの。
面とか線が切れないようにつくる。

いちばん情報を得ようとしている「目」が見るということの他に
４つのセンサーが立ったときの方が豊かだ。
谷崎潤一郎の本、現代の部屋の中が明るくなってきたことを不満に感じる。
暗い部屋の中で黒いお椀で飲むと、
味、香り、でお椀の感覚を楽しんでいる。
明るくなると全部見えてしまい、それは楽しくない。

暗いところの線を見せないと面白くない。
見えなくなった距離に
闇の中に置いたことによって、あるはずの無いものが見えるようになった。
僕らには到達できないところが見えているんだろう。
意図的ではない？

藤井：
そうやって言ってくれるのはうれしいけど、
本当は見えていないのかもしれない（笑）

深澤：
こういう風には普通撮影しない。
ちょっとだけ曲がって映っている。
傾くことによって、世界がリアルになる。
無地の CD プレイヤーを撮ったときに、自然なんだな〜と思った。
自分の物が風景の中にはいっている。

藤井：
壁かけCD。スイッチの ON/OFFがコードでできている。
電化製品を撮るときはじゃまになるので、なんとか隠そうとする。
スイッチも含めて絵にしなければいけないとおもう。
そう見えてくると撮れる。

深澤：
構図が決まるまでは、早い？

藤井：
いつもスケッチというか、絵を書いている。
こういうふうに撮ろうとスケッチを書いているが、
だんだんやりながら変わっていく部分がある。
それが大事なことかもしれない。

深澤：
これもスッと撮っているように思える。

藤井：
大きいもので、あっちに持っていったり、こっちに持っていったりした。
煙突のある建物、後ろのアングル、バウハウス風の建築。
ドイツの家具メーカーが繋がったときに撮れたようなきがした。

深澤：
あたまの中でストーリーを考えてとっている。

藤井：
何か見えたときに撮ることができる。

深澤：
足が三本しか見えない椅子。

藤井：
ライトの写真。
光源が直接見えないように乳白のふたがしてある。
周囲にもともとグラデーションがある。
球形のカーブにグラデーションがある。
直射光や直角を排除している感じがある。

深澤：
そうかもしれないな（笑）
輪郭をぼかす。
人間と社会との接点を考える。
35歳前後でデザインが大きく変わった。
形を与えることには意味が無いと思って、変わった時代があった。
今はジオメトリックなものをやっているが、
生活の中にはとんがりすぎているので、ちょっと味付けしている。
頭の中で描いた形をピュアに作ろうとしている。
実はエッジがシャープにはできない。
人工的であることを消そうとしている。

一番単純な照明器具。
ものをみると単純。
たたんだ状態。フラットな状態から数ミリ持ち上がっても陰がつく。
数ミリ上がっても光りだす。
見た感じ同じだけれども違う重みを入れている。
世間に溶かそうと思いながら、マジカルな仕組み。不思議な感じがする。
写真集を見てもらうと良くわかるのじゃないだろうか？

■質問コーナー：個人情報以外は全部話します（深澤：笑）

Q：藤井さんが言われた、３枚の写真がどうしても必要だった。
　　１枚の写真だと説明的すぎる。３枚必要なのはなぜだったのか。

藤井：一枚で全てを表現するのは、説明的な要素を持ってしまう。
表現として豊かなのは、全てを説明せずに
物がもっている一番美しいところ、
ドラマチックなところ一点を見せて、
見る人が想像して感性する表現が豊かな表現。
全部わかるけど、つまらない表現がある。

深澤：
あえて見せないこと。
色校の時に何が写っているのか分からないもの。
モノが写っているのに、どこに焦点をあてたら分からないものがあった。

藤井：
白の中の白い表現、黒の時の黒い表現。
ギリギリのところが面白い。

深澤：
目をこらしても見えない表現がある。

Q：ピントの合わせ方について。
今回の趣旨が「輪郭をぼかす」でした。
写真は必ずどこかにピントがあっている。
イスの写真。後ろにピントがあっている。
なんで前ではなく後ろにピントがあっているのか？

藤井：
写真家がどこにピントを合わせるのかは、どこを見ているのかということ。
人を撮るときは目を見るので、目にピントがあう。
プロダクトも同じこと。
アラビア文字みたいな魅力が曲線にあった。
フォーカスが外れると白の中に色がにじんでいく。
「空気にとけ込んでいく」という表現。
椅子の場合、前に合わせるかということではなく、
フォルムをどう見せるか。
書道でいうところのにじんだ表現のようなもの。

見えてきたら写真が撮れる。
それまでは迷うことがある。
いろいろ試行錯誤する。
ポラロイドを撮影して本番にいくばあいもある。
見えたときは写真が撮れる。
そこに行き着かないときは撮れていない。
そういう時は撮りなおす。

写真は相手がいないと撮れない表現。
物の実在があってとれる。
いちばんいいところを撮る。

旭山動物園の素晴らしい「行動展示」。
動物の一番素晴らしい「動くところ」を展示していること。
いかに動物が「幸せ」かが分かる。

深澤デザインの「生態学」と同じだと思った。

サルが芸を覚えたり、訓練したわけではない。
進化の過程でえた能力をそのまま見せているのが素晴らしい。
芸でないものを見たい。

深澤：
ものが知覚しているのと同じかもしれない。

Q：藤井さんは何度も試行錯誤されているようだが、
深澤さんは頭に描かれたものをプロトタイプとして作るのか、
プロトタイプを作りながら完成に近づけているのか？

深澤：
後日デザイナーがどういうスケッチを書いているという展覧会をやる予定。
それを見ても人それぞれだということがわかる。
大きくわけて２つのやり方があって、
描きながら構築していく人とそうでない人がいる。

自分は九分九厘きまっていて、
頭の中にあるものを作っている。
あとは詰めていく作業。
そこにできるものはすでに頭の中に決まっている。
どちらのデザイン方法いいというものではない。
プロトタイプは現実のものを頭に近づける作業。
95% できているものの 5% へ近づける。

Q：技術的に思い描いた形に近づけられない場合は？

深澤：
思い描いたものに近づけるよう努力する。
ピュアな考えほど破綻が大きくなる。
戦いというか、アイデアを出してやりあう。
デザインができてから近づけるという作業を続ける。

Q：全てを見せるのではなくて、見えていない部分を想像できることが
全てを見せるよりも面白い写真になるという考え方とは？

藤井：
どちらの表現がえらいのかということではない。
世の中にあるコミュニケーションとして
どちらが大人でどちらが成熟した社会かということ。
そういう関係の方が見せる方も見る側も幸せ。
映画でも文学でも全てそうだと思う。
よくわからなかったものが、ふわっと分かる瞬間が素晴らしい。

Q：深澤さんの、neon など直線的なものが多いとおもい、
輪郭をはっきりさせたいのかと思っていた。
輪郭はっきり派と、輪郭みせない派なのか？
輪郭は日常にとけ込ませるものなのか？

深澤：
すばらしい質問です。
まったくの対局にあると思っていて、
両側から語っていこうというもの。
僕の輪郭は、僕のもっている輪郭ではなく、
人が生活の中からあみだした輪郭。
見ると「これ欲しかった」と思わせる輪郭。

僕の意思を消して、皆が描いている輪郭を見せようと思っている。

現実世界に表されている「輪郭」を撮るとき、
輪郭ははっきりと見えてしまうことは無いのが「風景」。
もう一つのリアルな視点から「輪郭」を描いている。
概念として共有している何かを描こうとしている。
使う身としてはとんがりすぎてはいけないので、
エッジをわずかに人間が痛くないように調整している。
見た目はアイコンとしてエッジが立っているが、触ると柔らかい。

■まとめ

藤井：
最後の言葉を（笑）
今日は皆さんから１０００円もらってますよね。
なので、深澤さんの面白い話を暴露します。
深澤さんの「スーパーノーマル」という言葉を聞いていて、
すごく好きな言葉。
その象徴的なことを紹介します。
普通でありながら、超えているということ。

藤井：
ヨーロッパで深澤さんデザインのソファを展示していたら、
おばさんがずっと座っていた。展示物だと思っていなかった。
深澤さんはがっかりしていた。
「それが本当のスーパーノーマル」だと。
深澤さんはどう考えている？
ミュージアムとかギャラリーとか、ディスプレイしているお店で
尖って目立つ表現と、
静かにそこに実在している表現と、
写真と同じ表現かもしれない。

深澤：
スーパーノーマルはデザインを感じないということ。
目的とは凄い。
目的とは達したけど、寂しさを感じる。
僕の中の矛盾でもある。

藤井：
森の中の公園のベンチ。
あまりにも通俗的で面白くないと思った。
坂本龍一の more trees プロジェクト。間伐材のベンチ。
木に戻すという意味で、一度はベンチを立てて撮影した。
けれどもそれは止めた。

ベンチに向こうを向いて座ろうという写真を撮った。
凛とした感じにとれた。
風景と共存して、風景を美しくすることができる。

深澤：
「ベンチは後ろ姿がいいんだ」と言っていましたよね。

僕も表現者として本を作っている。
仕事としてデザインを知ってほしいからつくった方ではない。
皆と共有したい。
仕事とは別の意味で作った。

どうやって輪郭を消すか、どうやって真実を見つけるかが大切なこと。