一応美大のグラフィックデザイン学科の出身なので、TDCやギンザグラフィックギャラリーにはいつかはあそこで…的な憧れを抱いてたのでとても嬉しい。

授賞式では学生の頃から作品を見てたような大先輩や巨匠に挨拶させてもらう機会があり、いろいろお褒めの言葉をもらえたのはとても光栄だった。

以前このブログでも書いた「のめりこませる技術」の中でディズニーランドを取り上げる節があって、それを読んだ時に自分がウォルト・ディズニーについてほとんど知らない事に気づいたので、この際できるだけ詳細に書かれた本を読んで勉強しとこうと思い、探してみたところこの本を見つけた。

この本はウォルト・ディズニーが生まれてから幼少期を経てアニメーターを志し、ディズニースタジオを立ち上げ、ミッキーマウスを生み、白雪姫をヒットさせ、ディズニーランドを成功させ、次のプロジェクトを進めるさなかに亡くなるまでの生涯が600ページにわたって書かれてる。

ウォルト・ディズニーに関する出版物は発売前にディズニー社の検閲があるそうなんだけど、この本はディズニー社の協力を得ながらも検閲を受けず出版されたらしい。そのせいか、ネガティブな話も結構書かれているので、一般的な偉人のイメージではなく、一人間としてのウォルト・ディズニーのイメージが掴めた気がする。

現代に色濃く影響を残す巨人の伝記を読むのは学びが多いのでぜひ。

のらもじ発見プロジェクトというサイトを公開しました。このプロジェクトは学生の頃にネットで知り合ったりんたろうさんと、そのお友達若岡さんという謎の繋がりの3人で今年の2月ごろからひっそり進めていたプロジェクトです。

ざっくりいうと、街で見かけたデザインされてないけど味のあるイケてる文字（のらもじ）をデジタルフォント化してドネーションウェアとして配布し、その利益を文字の持ち主に還元しようというプロジェクトです。（詳細はこのページを参照のこと）個人的にはトップのタイプテスターがいい塩梅に仕上がったので試してもらえればと。

先週末に公開したところ公開数時間でホッテントリ入り、3日で500ブクマ、1200ツイート、7000いいね！と想像していたよりも反響が大きく、時間をかけてやってよかったなぁと思ったりしてます。色々とお手伝いしていただいた方々本当にありがとうございました。
プロジェクトとしては始まったばかりで気が抜けないですが、まずは無事公開できてよかったぁー。

そんな感じ。

あ、そういういうと公開直後にアクセス過多で2回ぐらいサーバー（heteml）が落ちてその後も不安定だったんだけど、CloudFlare入れたらピタッと安定した。CloudFlareすごい。

以前やったPOOL inc.のトップページ、例のごとく最初にビデオをある程度プリロードしてから再生してるんですが、本数が40本程あって全部の読み込みを待つのさすがにダルいよねってことで2, 3本読み込んだら再生をはじめて、残りのビデオは裏で読みってやってみたんですが、この読み込みの処理がなかなかヘビーでして、再生してるビデオがコマ落ちしてまともに再生されないんです。

どうしよう、どうしようということで読み込み処理をビデオの再生とは別のスレッドにしてみたんです。HTML5のAPI、Web Workerで。すると狙いどおりビデオがコマ落ちすることなくバックグラウンドで読み込みができるようになりました。40本同時に並列でダウンロードしても処理落ちせず爆速です！（Workerが使えない環境の場合は同一スレッドで、しかもビデオの再生を邪魔しないように全部のビデオを読み込むのを待つようにしてるので段違いに遅い）

大量の画像をプリロードしてからはじまるサイトとかでもWorkerを使って分散すればずいぶん高速化できるんじゃないでしょうか。

ソースはこんな感じです。簡略化してるけど。main.coffeeから呼び出したPreload.coffeeまでが最初のスレッドで、Preload.coffeeがload.coffeeを別スレッドで実行してつつ読み込みが終わるのを待ってるという流れ。

※コード内のdefineはrequire.jsを使ってる想定

関連：
POOL inc. | blog.bouze.me

最近移動中に読んでた「のめりこませる技術」が面白かった。

この本はいろいろなメディアやコンテンツが作られた背景を追いながら、人がなぜ物語にのめりこむのかを考察していくという内容。

映画が主流なメディアだった時代の名作から、ソーシャルメディアが台頭し始めた現代の名作を例にあげつつ、どのようにして人がその物語に没入していくのか、そして時代とともにその仕掛けがどのように変化してきているのかを解説している。

400ページを越える本書の中で取り上げられる事例は、スターウォーズやトロン、マトリックス、アバター、ダークナイト、トロン・レガシー、ディズニー、ロスト、スタートレックなどの映画やドラマから、Subservient Chickenやオールドスパイス、AXE、Nike+などの広告、そしてPongやシムピープル、メタルギア・ソリッド、グランド・セフト・オートなどのゲーム、さらにはBloggerやYouTube、Twitterなどのネットメディアまで様々。

マスメディアからソーシャルメディアに主戦場が移った近現代のメディアの変遷を、普段自分の持っている視点とは異なる「物語を作る」という少し大局的な視点から読めておもしろかった。

Amazon.co.jp: のめりこませる技術 ─誰が物語を操るのか: フランク・ローズ, 島内哲朗: 本

「ない世界」展にて展示された「色のない世界」という作品を制作しました。ウェブをゆっくりと白黒化させながら巡回する作品です。自動巡回機能をなくしたChromeの拡張機能版はこちらからダウンロードすることができます。

Planning + Art Direction: 阿部洋介
Design + Program: 西村斉輝

お仕事でPOOL inc.のポートフォリオサイトを制作しました。トップページではお馴染み岡崎さんのPOOLのLOOP映像が流れます。クレジット等、詳細はこちらで。

僕パートで言うと制作期間の6, 7割を文字がもじゃもじゃ動くエフェクトを作ってたわけですが、このへんの実装について。

当初は今どきっぽくcanvasで実装しようと思っていたのですが、文字を塗りつぶすほどの量の線をまともなフレームレートでアニメーションさせることができず、リアルタイムに描画することを諦めプリレンダリング路線に切り替えました。

アニメーションをプリレンダリングするために、モノクロの画像をほりこむとアニメーションが1コマづつ縦に並んだスプライト画像（こういうやつ）と、このスプライト画像のアニメーション兼配置用のsassが書きだされるジェネレーターをこしらえました。そしてサイト上ではこのスプライト画像のbackground-positionをjsで操作してアニメーションさせたりマウスオーバーに反応させたりしています。

↓もじゃもじゃジェネレーター

そんな感じです。

関連：
WebWorkerで爆速プリロード | blog.bouze.me

写真作家 阿部夏澄さんのポートフォリオサイトを制作しました。
URL: http://kazumiabe.com/