Home > Dots & Lines > 土屋 泰洋

2. デザイナーズリパブリックからビジュアライジングデータまで。 あるいはコンピューターで絵を描くためのいくつかの方法について。

March 30, 2009
Yasuhiro Tsuchiya
ウェブプランナー、SLN土屋泰洋による連載第2回目

sln02_01.gif

みなさまこんにちは。DOTS&LINES第二回です。早速今回から、前回ざっとお話をさせていただいたような具合に、様々なコンテンツを様々なコンテクストで繋ぎながらご紹介していくことで、無数にまたたく情報の星の海に一本の線を描き始めてみる試みをはじめてみようと思います。さて、最初に何の話からはじめるか。色々と考えていたところに、個人的にも、デザイン業界にとっても非常に衝撃的なニュースが耳に入りました。The Designers Republic (以下DR)が倒産、というニュースです。

Forever DR

CBCNETの読者の方でしたらご存知の方も多いかと思います。DRといえば、90年代後半から、イギリスのレコードレーベルWARPのジャケットデザインや、ゲームWIPEOUTの画面デザインで一躍有名になった、イギリスのデザインスタジオです。

sln02_02.jpg

DR が活躍していた90年代後半といえば、PCを使用したデザインというものが世界的に注目されはじめた時期で、DRと同じくイギリスのTOMATOMe Companyといったデザインチームが注目されていました。次から次へ見たこともないような新鮮なビジュアルや試みが出てきた時期で、とにかく「デザイン」という言葉がとてもキラキラしていた時代だったように思います。日本でも、現在は残念ながら廃刊してしまったDesign Plexをはじめ、そうした「デザイン系」雑誌が多く創刊されましたし、現在様々なアーティストの作品集として定期的に刊行されているGASBOOKシリーズの原型となる「GASBOOK」も、そういった流れの中でできたものだったと記憶しています。(確か初期の号では、雑誌兼フリー素材集といった体裁だったというのも、当時こうしたコンテンツの受け手自身もクリエイターだったという時代性を象徴していると思います)

Grammy Winner / Funkstorung Dir.The Designers Republic

その頃ちょうど学生だった僕も、WARP周辺の音楽が好きだったこともあって、DRの大ファンでした。その頃は、なんとか手持ちの環境でDR風のグラフィックをつくろうと色々な方法を試していたのをよく覚えています。あの頃、稚拙ながらに楽しみながらやっていたスタイルを読み取り、噛み砕き、自分なりに試してみる、というプロセスは、数回にわたる記事の中でご紹介していく内容と共鳴する部分があるかもしれません。

sln02_03.gif

ここで思い出してみたいのは、どうやったらDR風になるのか、という試行錯誤をしているときに考えていたことです。僕は、当時のDRのある種独特なデザインは、以下の二つの要素で構成されていると考えていました。

1)極端に大きいサイズでレイアウトされた要素と、極端に小さい要素の共存によってもたらされる「スケール感の消失」。
2)もはや判読不可能なほどに断片化、重層化された「ノイズ感覚」。

今考えてみると、当時の分析は、案外はずれていなかったのかなあと思っています。というのは、俯瞰して見るとこの時期は、冒頭でも述べたように、PCを使った新しいビジュアルデザインというものが盛り上がりをみせていた時期で、コンピューターというメディアならではのポテンシャルに皆が注目していました。極端なスケール感覚というのは仮想的に無限に広がる二次元平面上にレイアウトしていくPC上のインターフェイスを想像すれば、こういった表現がでてくるのは自然な流れのように思えますし、ノイズ感覚については、エディトリアルの動きを見てみても、80年中頃から、DTPの導入によって写真やタイポグラフィのコラージュの自由度があがっており、情報の密度がどんどん高くなっていくという傾向がありました。(80sから90sにかけての「i-D」や「RAYGUN」といった雑誌のエディトリアルを見てみるととてもわかりやすいと思います。その辺りの流れはこちらの記事に分かりやすくまとまっています →ノイジーな多重構造からスイス系へタイポグラフィーの10年)ノイズ感覚というのは、こうした情報密度が限界に振り切った結果として考えれば必然のように考えられるでしょう。

sln02_04.gif

ところで最近、あらためて、この「スケール感の消失」というキーワードが気になっています。上でも書きましたが、Illustratorなどを普段使用されている方はピンと来ると思うのですが、ベクターデータというものは、原理上どこまでも拡大できるしどこまでも縮小できるわけですから、たとえば表示を 200%の状態でレイアウトを組んでいても、作業としてはまったく同じ。最終的にキュッと縮小してしまうと、倍の密度で再現されます。これを何層にも繰り返していくと、ディテールからディテールへと、グラフィック自体が入れ子構造になっていき、自然とスケールの感覚が揺らいできます。普段デザインをされる方で、こういった感覚を味わった事がある人は少なく無いのではないでしょうか?ディテールから俯瞰までをパッパッと一瞬で行き来するクラクラとした感覚は、これは紙のデザインでは整理しえない、コンピューターを使った表現ならではの感覚のような気がしています。


スケール感の消失

このスケール感の消失というキーワードに注目して、いくつかの作品を紹介していきたいと思います。

Powers Of Ten

イームズ夫妻の傑作映像作品。Google Map的視点でミクロの世界から宇宙の果てまで、まさにスケールをめぐる映像としては、おそらく世界で最も有名な映像です。

sln02_05.jpg

"Salt Lake Temple" Letterpress Poster by Cameron Moll
これは、アメリカのデザイナーCameron Mollによる、活版印刷を使って地道に制作された超精細なタイポグラフィ作品です。地道にひと文字づつ手作業で100時間ほどかけて組みあげたそうです。PCベースでつくられたものではありませんが、その圧倒的な情報密度と解像度は、見ている側のスケール感を揺さぶる力があります。

sln02_06.jpg

Prezi Zooming Presentation Tool
パワーポイントのようなスライド形式ではなく、文字から文字へ、画面がズームインズームアウトしていきながら見せていくスタイルでプレゼンテーション資料を制作できるウェブサービスです。フォーカス=ズームインという発想は、紙ではなかなかでてこない、映像やウェブといった時間軸を持つメディアならではの表現という感じがします。

Kinetic Typography


ちょっと脱線かもしれませんが、海外では上にあげたPreziによって生成されるようなタイポグラフィアニメーションをKinetic Typographyであるとか、Dynamic Typographyと呼ぶようです。無限の空間の中をタイポグラフィーがスケールや方向を自由自在に変形しながらダイナミックに展開していく様子が見ることができ、音とのシンクロとも相まって生理的に非常に気持ちよいものになっています。Youtubeで検索すると同様の映像がたくさん見つかるので面白いです。

複雑に入れ子構造になったコラージュの中を縦横無尽に遷移しつづけるPVです。Powers Of Tenのような映像体験をさらに応用したものといえそうです。

sln02_07.jpg

zoomquilt
こちらは、どこまでもズームする入れ子構造に注目し、ズームしながら様々な作品を行き来することができる、まさにどこまでもズームしていく織物のような作品です。

フラクタル

こうした、どこまでも拡大していける図形のことを、数学の分野ではフラクタルと言ったりします。厳密には、例えば木の枝分かれのように、自然界によくみられるような繰り返し... これを自己相似性といいますが、これをアルゴリズムによってシミュレートしようというのがフラクタルのおおまかなコンセプトです。

この映像は、1986 年に放送されたTV番組「TV Evolution」の中での浅田彰によるフラクタルについての説明部分です。(ちなみにこの番組の最後ではYoutubeの出現を示唆するようなことも語られていて、今みると結構面白いです)80年代後半、こうしたフラクタルとか、セルオートマトンによる人工生命といったトピックがコンピューターサイエンスの世界で盛り上がりを見せます。

コンピューター上でのデザイン作業において、スケール感が消失する面白さと、コンピューターによる演算で生成されるフラクタルの面白さというのは、コンピュータの根本的な機能である演算という点を通じて、どうやら無縁ではない気がします。そこには共通の、コンピューターでしか表現しえない面白さ、つまり数学的な美しさともいえるものがが潜んでいるように思えるのです。

Design by Numbers

コンピュータを使用したデザインというのは、結局IllustratorやPhotoshopといったソフトウェアの裏側で処理されている複雑な演算によって生成されているものですが、我々がこうしたソフト使ってデザインをしている時にそれを意識することはほとんどありません。上記のようなスケール感が揺らぐような作品を見たときに感じる面白さというのは、作品の向こう側に、こういった普段意識することの無い数学的な演算の存在を改めて思い起こさせるからかもしれません。数学的美しさと、コンピューターを使用したデザイン。この二つの関係について非常に意識的だったアーティストにジョン前田がいます。

sln02_08.jpg

前田は、今日のコンピューターを使用したデザインが、演算というコンピューター本来の仕組みの理解を放棄し、ソフトウェア操作の組み合わせで終止してしまっていることを批判しました。そしてコンピューターを使ったデザインにおいては、計算やアルゴリズムによってもたらされるビジュアルの美しさこそが、デジタル・デザイナーの本当のスキルである、と主張します。つまり、コンピューターを単なるツールではなく素材と考えた時に、コンピューター本来の数学的な美に立ち戻るべきである、という考え方です。

デジタル・デザインのスキルは、大体のところ百科事典のようなソフトウェア・マニュアルや「ハウツー解説書」を読みあさることによって身に付ける。(中略)つまり、我々は知らず知らずのうちに、機械的暗記力をデジタル・デザイナーのスキルとして祭り上げてしまったのだ。(中略)だが、デジタルデザイナーの本当のスキルとは、すなわち「コンピューター計算」の技芸にある。 - Design by Numbers / ジョン前田

Design By Numbers―デジタル・メディアのデザイン技法
前田 ジョン
ソフトバンククリエイティブ
売り上げランキング: 240217

「コンピューターを使って良いデザインをするためには、創作に使うプログラムを自分でデザインするか、少なくとも理解していなければならない。」こうした独自の思想を元に、前田はMITメディアラボのAesthetics+Computation Groupにおいて、コンピューターでデザインをするための言語「Design By Numbers」を開発します。これは後に「Processing」と呼ばれる言語へと発展していくことになります。


デスクトップの向こう側へ

sln02_09.jpg

当時のこういった流れに共鳴する作品としては、Adrian Wardによる、グラフィック生成ソフトウェア「Autoshop」と「Auto-Illustrator」があげられます。これはPhotoshopや Illustratorのインターフェイスを模した、様々なアルゴリズムによって自動生成的にグラフィックが生成されるというソフトウェアですが、そこにはジョン前田が指摘したような、コンピューターを使用したデザインが、特定のソフトウェアのコマンドの組み合わせにすぎなくなってしまっているという状況に対する批判と同じメッセージを感じることができます。

sln02_10.jpg

また、Auto-Illustratorとよく似た思想のソフトウェアとして、ScriptographerというIllustratorのプラグインがあります。これは Illustrator上でJavascriptを使ってベクターデータを生成できるようにするもので、Illustratorを使って気軽に Design by Numbers的なグラフィックの実験を行うことができるツールです。ジョン前田が指摘したように、Illustratorのようなソフトがデザイナーのスキルを機械的 暗記力にしてしまったとすれば、ScriptographerはIllustratorをプラグインという形をとってHackすることによって、真のデザインツールへと解放しているという言い方ができるかもしれません。

sln02_11.jpg


Generative Design / Purists & Hybrid

Design by Numbersの開発チームを中心に、さらにパワフルにバージョンアップしたビジュアル生成言語「Processing」が開発されるなど、 Aesthetics+Computation Groupのメンバーを中心にして、「コンピューター計算によるデザイン」の研究がさらに進められました。そして、計算による美を追求していった結果、徐々に「美しい作品」そのものではなく、「美しい作品を生成するためのシステム」が注目されるようになっていきます。そうしたシステムに注目した作品群は Genarative DesignとかComputational Designと呼ばれることがあります。

こうしたGenerativeな手法によってコンスタントに作品を発表しているアーティストとしては、Joshua Davisが有名です。


OFFFestival'08 - Joshua Davis from we-make-egos-grow-not-art on Vimeo.


上の映像は、Joshua DavisのOFFFestival'08でのプレゼンテーションの様子のビデオです。彼はプレゼンテーションの中で、Computational DesignをPuristのグループと、Hybridのグループに分けて紹介していて、面白かったので引用します。
According to Davis, computational design is divided in two clans: the purists and the hybrids. The purists are Ben Fry, Casey Reas, John Maeda, Golan Levin, etc. They only use code. The hybrid, like himself, Niko Stumpo, Geoff Lillemon and others blend the code with art works.
- http://www.we-make-money-not-art.com/archives/2008/05/joshua-davis-at-offf-lisbon.php

ジョン前田のようなPurists(純粋主義)派のアーティストたちがコードで絵を完成させるという側面が強いのに対し、Hybrid派は、初期値のパラメーターとしてペン先の動きを導入したり、コードによって生成したものを素材として使用するのみにとどめるなど、最終的に手作業が入ったり、あくまで身体性を伴った表現であるということのようです。

Joshua Davis自身が影響をうけたアーティストとしてしばしばJackson Pollockの名前がでてくるのは非常に示唆的です。Jackson Pollockのアクションペインティングシリーズに代表される「ドリッピング」などのスタイルは、キャンバスに直接筆先をつけず、インクの飛び方を物理現象というプログラムにまかせるという点においてComputational Design的なアプローチといえますし、さらに身体全体を動かしながらブラシを振り回し続けるという身体のダイナミズムが介在していたという点において Computational Design - Hybrid派の考え方との共鳴を感じます。

ビジュアライゼーション

一方Purists方向の動向としては、Processingなどを用いて膨大なデータを可視化する(ビジュライゼーション)というアプローチの作品が多く生み出されています。

Flight404によるオーディオのビジュアライゼーション

Solar, with lyrics. from flight404 on Vimeo.

Aaron Koblinによるアメリカに離着陸する飛行機のビジュアライゼーション

Flight Patterns

Jonathan Harrisによるブロゴスフェアのビジュライゼーション
sln02_12.jpg
UNIVERSE by Jonathan Harris

Processingの開発者の一人であるBen Fryによる著作

ビジュアライジング・データ ―Processingによる情報視覚化手法
Ben Fry
オライリージャパン
売り上げランキング: 5088


信用ベータ

sln02_13.gif

そして、Generative Designについて語る時、忘れてはいけないのが日本人デザイナー立花ハジメによって1995年に開発された「信用ベータ」です。これはある意味 Generative Designの先駆けともいえる試みで、立花ハジメ自身の作品の制作プロセスを分析、解体し、Illustratorのプラグインとして再構築。そしてそれをそのままパッケージ化して販売する、というものでした。つまり、このプラグインを使えば、誰でも立花ハジメの作品を自動的につくれてしまうわけです。これは次回紹介する、音楽のGenerative Design的アプローチとも言える「アルゴリズミックコンポジション」の話と非常に近い話でもあります。

(ちなみに、ffffoundのテキスト版とも言える、ウェブサービス引用βの名前は、この「信用ベータ」からの引用ではないかと読んでいますが、実のところ、どうなんでしょう?)


The Designers Republicの思い出話から始まり、スケール感の話、フラクタルの話を経て、コンピューターによるデザイン論へと移行してきたところで、唐突ではありますが、第二回を閉じたいと思います。次回は、偶然にも音楽のフィールドから、ジョン前田と同様の問題定義をしたMarkus Poppというアーティストをご紹介するところからはじめたいと思います。あわせて、音楽を自動生成するというコンセプトやiPhoneの話などにつないでいければと考えています。DOTS&LINESの徳井さんの連載との、ちょっとしたトピックの交差点になるかもしれませんね。それでは次回もお楽しみに!

CBCNET:WORK

CBCNET WORK



PAGETOP