また新しい年がやってきた。年明け早々からすでにバタバタしているが、昨年を振り返ると、よくも悪くも目の前の壁にひたすら立ち向かうばかりの一年だった。ただ環境が変わり、少しキャパオーバー気味にいろんな事に取り組んだおかげで、痛い目もみながら少しは成長できたのかなと思う。

2011年は20代に別れ告げ、新しい年輪を刻むことになる。終わりと始まりを同時に迎えるこの年に、これからの10年をよりおもしろく、幸せに過ごす事が出来るようなしっかりした基盤をつくる。そういう年にしたい。それを踏まえて今年の目標を自戒の念も込めて残しておこうと思う。

1. スピード感と実行力を持つ
面白いアイデア、画期的な仕組みの開発、技術的な実験、なんでもそうだが誰でも思いつけるし、誰でも実行できる。思いつく・思いつかないの差よりも、やる・やらないの差の方が圧倒的に大きい。

2. 100冊読書
ひらめきの多さは引き出しの多さに比例すると思う。読書が全てではないけど、良質なインプットを得る為に、それなりの量を確保することは意識しておきたい。

3. ブログを50エントリ以上書く
昨年一番欠けていたのアウトプット。アウトプットがないと拡がりが出ない。知識にしても人にしても、現場で活きてくるものはスケール感をもっているような気がしている。

4. プライベートワークに取り組む
去年はずっと仕事に忙殺されていてほとんど出来なかったが、温めすぎたアイデアも含めてできる限り形にしていきたい。

5. できる限り早く帰宅する
家庭のある身としては、毎晩終電で帰宅することがそのまま妻や娘の負担になっている事を良く認識しないといけない。プライベートワークにしても本を読むにしても、とにかくいかに時間を確保できるかが重要になる。まずは自分のワークスタイルを見直してやるべき事をできる限り時間内におさめるクセをつけたい。それが成果物の質の向上にもつながるはず。時間は有限でとっても高価だ。

あまり多すぎると意識しきれないので、まずはこれをちゃんとやりたい。しっかりと身につけて無意識に出来るように習慣にしていきたい。

今冬は地元でも数年、もしかすると十数年ぶりに40センチオーバーの豪雪になった。娘も初めての雪景色に最初は固まっていたが、慣れてくると屋根から雪をとれとせがんでしっかり楽しんでいたようだ。そんな娘の姿をみて嬉しくなって、久々につくった小さな雪だるま。休息に終わりを告げる様に、丁度帰阪するころには跡形もなく溶けてしまった。
また今年も家族みんなでゆっくり新しい年を迎える事が出来るように、一日一日を大切に過ごしていきたい。
今年もどうかよろしくお願いします。

遅ればせながら、9月末で前職を退職し、11月から新しい職場にて再スタートをきりました。
WEB業界にはいってもう今年で5年目になりました。
思えばいろんな人にお世話になって、ご迷惑をおかけしたことも、色んな事に行き詰まったり、憤りを感じたりしながら、もうやめようかな、と思ったこともありました。それでもなんとかこうしてやっていけているのは、そうやって出会った人達のおかげです。まだまだ未熟者ですが、感謝と努力だけは忘れずに今後もなんとかやって行こうと思います。

そんなこともあって、10月末にぽっかりと時間ができたので、友人に会いに東京にいってきた。
写真いっぱいとってやろうと、意気込んでたけど全然とれなかった。
眠いので後日まとめよっと。

色々と一段落して、時間がつくれそうなので今週末は友人に会いに東京へ行く予定。
ついでに21_21いってコレみる。なんか他にも良さげなのがあれば見に行っときたいな。こっちにいると中々みれないしなー。何かよさげなのがあれば誰か教えて下さい。

せっかくブログ作ったし、読書もしてるんだから、読んだら何冊かは感想書こうと思っていたのだけど、それも停滞してるので、とりあえず書く。
直近で読んだ本はこれ。

発想する会社! — 世界最高のデザイン・ファームIDEOに学ぶイノベーションの技法

深澤直人さんも所属しておられた、超有名なデザイン企業IDEOの仕事の流儀が書かれた本。
とにかくフィールドワークを大切にし、デザインする対象を観察して問題点を洗い出し、迅速なプロトタイピングを経て、課題を解決していく。何も突飛ではなく、合理的。
正直ここまでフィールドワークに力を入れる事の出来る会社ばかりではないだろうけど、学ぶべきは「対象を深く理解して、問題の本質を徹底的に洗い出そうとするその姿勢」だと感じた。
プロトタイピングに関してもそうだけど、とにかく迅速に行動して、早い段階で失敗して、さらに発展させていく行動力にも脱帽。最低限考えたら、うだうだしているより手を動かした方がはやい。
そして何より、普段から企業全体でアイデアの出しやすい風土を作っているところにも、神のおりてくるのを待つような受動的なひらめきではなく、積極的にいろんなものを取り入れてアイデアをつくりだそうとする姿勢が本当にすばらしいなー。
こんな会社で誰もが働いてみたいと思うんじゃないだろうか。

他にもAmazon.comの成り立ちのお話や、IDEO内部が写真で紹介されていたりと見てるだけでもおもしろい。結構なボリュームがあるので、時間のあるときに一気に読むか、章ごとに分けて読むかすると一気に頭に入る本だと思う。

digitalabstractsみてたらNOPATTERNのワークスアップデートの情報が。
相変わらずキレイな色彩だー。ほれぼれする。
昔LESS THAN JAKEのアルバムのカバーアートワークで初めてしって、一目惚れしたNOPATTERN -Chuck Anderson。Wndows7のdefault desktopも彼の仕事のよう。いいなあー。

CBCNETにある過去のインタビューも必見。
そんな事を思いながら僕の誕生日も過ぎていくのであった。

まずspark projectのリポジトリから必要なファイルをチェックアウト。
http://www.libspark.org/svn/as3/MultiProgressManager
同梱されてるサンプルもすごくためになる感じなので、見ておくと良いと思います。

んで、必要なファイルを適当な場所においてクラスパスを通せば準備完了。
サンプルを見る限り、本当はpreLoaderから本体swf読み込み、その後xmlやその他assetのローティングというように、つなげていくのがよさげみたいですが、今回はわかりやすいように、本体swf読み込み後のconfigからassetの読み込みまでをやってみました。

Progressionを使って、IndexSceneのonLoad内でローディング用のThreadを3本立ててやってます。
onLoad内は至ってシンプル。MultiProgressManagerインスタンスはThread内部でも利用したいので、データ保持用のsingletonオブジェクトに渡しておいてやります。
というかMultiProgressManagerはそれ自体singleton版があるようなのでそっちを使ってもよいかと。いや多分そっちのがいいです。ローディング終わったら使わないし。（SiMultiProgressManager）

protected override function _onLoad():void
{
	_data = DataRef.getInstance(); //データ保持用のsingletonオブジェクト
	_multiProgress = new MultiProgressManager(); //ここでMultiProgressManagerインスタンスをつくる
	_multiProgress.addEventListener(ProgressPercentEvent.PERCENT_PROGRESS, handlePercentProgress);
	_data.multiProgress = _multiProgress; //ローディング用Thread内から参照できる様に_data内部に保持
	_preLoader = new PreLoadView(); //ローディング状況を表示するためのView

	addCommand(
		new AddChild(_data.container, _preLoader, { child : { x: 20, y: 20 } }),
		new ThreadCommand(new XMLLoadThread(_data), { timeOut: 0 }),
		new ThreadCommand(new AssetLoadThread(_data), { timeOut: 0 }),
		new ThreadCommand(new BgLoadThread(_data), { timeOut: 0 }),
		new Listen(_multiProgress, ProgressPercentEvent.PERCENT_COMPLETE),
		new RemoveChild(_data.container, _preLoader)
	);
}

private function handlePercentProgress(e : ProgressPercentEvent):void
{
	_preLoader.update(e.percent);
}

ローディング用の各Thread内部の読み込み部分では、だいたい以下のようなことをやってます。

protected override function run():void
{
	_multiProgress = _data.multiProgress;
	_urls = //ここに読み込む画像のパスが入ったArray
	next(load);
}

private function load():void
{
	_bgLoader = new ParallelExecutor();
	for(var i:int = 0; i < _urls.length; i++)
	{
		var req : URLRequest = new URLRequest(_urls[i]);
		var ld : LoaderThread = new LoaderThread(req);
		var md : AbstractProgressModel = new ProgressEventModel(ld.loader.contentLoaderInfo, 0.3 / _urls.length); //第二引数でこの読み込み自体が全体の読み込みの内、どの程度のウェイトをしめるかという設定が出来る
		_multiProgress.addProgress(md); //ここでロード状況をマージ

		_bgLoader.addThread(ld);
	}

	_bgLoader.start();
	_bgLoader.join();

	next(handleBgLoadComplete);
}

なんかわかりにくい説明になってしまいましたが、とにかく便利です。というか使い方これでいいのかなという不安もあるくらいなので、同梱のサンプルに目を通してもらった方がわかりやすいですね。。

とにかく、Progressionを使用する時は大体IndexSceneのonLoadとかで必要な読み込みなどはほとんどやってしまうと思うのですが、その際に読み込む種類毎にThreadを立てて、それらの監視状況をMultiProgressManagerに一元化すると、ローディング周りのコードの見通しがよくなるし、すごくシンプルにかけるじゃないか！ということが言いたかったわけです。
しかも進捗状況にスムージングまでつけてくれるので、view側で丸め込んだりしなくて良いのもうれしい。

多分まだちょっとしか使ってないので、おかしな使い方をしているのかもしれないけど、個人的にはすごく重宝しそうです。
感謝感謝！

ここからまずダウンロード。
ダウンロードしてきたzipを展開すると、中に色々はいってるけど必要なのはscriptディレクトリとswfディレクトリだけ。その中からscript/soundmanager2.js（debug機能の無い圧縮版もあるのでどっちでもいけます。僕は中身をおっかけたかったのでuncompress版をここでは使用してます。）をページに読み込み、swfディレクトリを任意の場所におきます。

次にユーザー定義のjsを作成し、以下のように設定します。

//settings
soundManager.url = "swf/"; //swfディレクトリをおいた場所
soundManager.debugMode = false; //デバッグするかどうか。これはfalseにしとかないとブラウザ上にデバッグの内容が表示される
soundManager.flashVersion = 9; //使用するflashplayerのバージョン。8か9が指定できる。

前述したように内部的にはswfを抱えているので使用するflashPlayerのバージョンを記述できます。デフォルトでは8になっていますが、9に変更するとビデオの再生が出来たり、波形がとれたりflashPlayer9から使えるようになったAPIとのやりとりが出来ます。普通に音の再生用に使うには8で全く問題ないので、この記述はしなくてよいかも。

で、soundManagerの初期化待ちをします。こちらが事実上のエントリポイントになります。
soundManagerの初期化が終わるとonloadイベントが呼ばれるので、この中で実際の曲オブジェクトを作っていきます。

var sound; //サウンドオブジェクト(SMSoundインスタンスが格納される)
soundManager.onload = function()
{
	sound = soundManager.createSound({
		id : 'sound1', //ユニークなID
		url : 'path/to/song.mp3' //mp3ファイルへのパス
	});
}

createSoundするときに必要最低限idとurlを渡しておけば機能しますが、他の細かな設定も一緒にわたせます。
とくに曲の終了のタイミングをとりたい場合なんかは多いと思うのですが、そういう場合はonfinishという名前でfunctionを設定するとコールバックとして再生終了後に呼ばれるし、再生中をとりたければwhileplayingとか設定できます。とにかく色々設定できるのであとはこのへんを参考にしてみると良いです。

あとは作ったサウンドオブジェクト（ここではsound）に対してsound.play()なりsound.stop()なりしてあげれば曲が再生されます。らくちん。
実際にページ内でクリック時に再生する場合はjQueryと併用して書いてあげるとさらにらくちん。

var target = "#sound a.song";
soundManager.onload = function()
{
	//もろもろ初期化
	$(target).trigger("SMInit");
}

$(function(){
	$(target)
		.hide();
		.bind('SMInit', function(){
			$(this).show();
		})
		.click(function(){
			//ここで再生、停止処理
			return false;
		})
});

やや冗長だけど、soundmanagerの初期化のタイミングとの整合性をつけるために、最初は再生ボタン自体を隠しておいて、初期化完了のタイミングでカスタムイベントを発行して、ボタンを表示という形にしました。より汎用的にプレーヤーを作って使い回したい場合は、このページのinlineplayer.jsが参考になります。