links for 2008-10-05

October 6th, 2008

links for 2008-10-04

October 5th, 2008

?インタフェース

October 5th, 2008

macdonalds

先日リニューアルした日本マクドナルドのWebサイト
Welcome to McDonald’s Japan

ここだけじゃないけど、最近の流行か、メニューを選択する際に内側に枠が出たり、パターンがオーバーレイするものが増えている。

なんで、ユーザが見たいものをわざわざ見にくくするの?

わざわざ興味のあるメニューにマウスを持っていってるんだから、どう考えても強調するべきだろ。
しかもその方法は山ほどあるのに・・・

内側に枠がでるメニューも、わざわざ表示領域を狭めてどうするんだろうな。
領域を広げられないなら、他の要素の領域を狭めるとか考えれるのに・・・

デザインの基本は情報や意味の可視化であり、そこから外れるのはデザインの放棄に等しいはず。

と思ったので教訓としてメモ。

links for 2008-10-03

October 4th, 2008

links for 2008-10-03

October 3rd, 2008

Spark勉強会 #3に参加してきました

October 1st, 2008

Spark勉強会 #3に参加してきました
今回から100人規模になり、めっちゃ人が多かったです。

http://wiki.libspark.org/wiki/SparkStudy/03

■Adobe 西村さんからAdobeの最新動向の発表

・FlashPlayer10の紹介

■Spark Projectの状況

○今月のコミット紹介
 ⇒個人的に興味のあったコミット
 ・Thread Viewer
  yossyさんのThreadの動作状況をモニタリングするGUIツール
○SP1の報告

■発表

○「タイムラインで作るモーションタイポのコツとか」 by kagi55xさん
 ・アニメーションの全体像(雰囲気など)を把握
 ・タイポグラフィーを動きやすいように分解する
 ・時間がかかるがやり遂げることが大事です

○「JSplash swf to javascript converter」 by gyuqueさん
 ・高速化するブラウザのJavaScriptのパワーを無駄遣いしてみる!
  ⇒ということで、FlashのゲームをJavaScriptにコンバートしてみる。
 ・swifmillとflareを使い、swfを逆コンパイルしてコードをJavaScriptに変換することで、ブラウザ上で再生する。
 ・完成度は20%くらい
  ⇒ MCの枠線だけだがアニメーションされていた
 ・iPhone上で、swfのコンテンツを変換して動かせるかも

 サンプル(もともとswfだったものを変換したもの)
 http://www.libspark.org/svn/ruby/jsplash/trunk/client2/index.xml

○「MacBookの傾きをFlashで取得してなんかします」 by ll_koba_llさん
 ・AMSTrackerを使い、MacBookの傾きを取得
 ・Ruby経由でソケット接続することで、傾きの値をFlashに渡す
 ・スーパーマリ○ブラザーズのデモとか
 ・SMSasというライブラリとして公開中

○「dangoを使ったオンラインゲームの作り方」 by gawgawさん
 ・dangoというネットワーク連携用フレームワークを作成
 ・AS3とRuby on Railsで簡単に連携ができる。
 ・AS3だけで作成することもできるとか。
 ・yossyさんと共同でマルチネットワークゲームを作成

 参考サイト
 http://dango-net.org/

○「マルチプレイ Flash ゲームのつくりかた」 by yossyさん
 ・上記dangoと連携してマルチネットワークゲームを作成
 ・FlashにてUIと、クライアント処理部分を担当
 ・MVCを意識して製作してみた
 ・Threadライブラリを使用して、ゲームの進行管理や
  ネットワークとの接続を非同期で実現
 ・ネットワークゲームの作成の際は、演出のアニメーションと
  データ処理のタイミングの調整に手間がかかるが、
  このあたりをThreadにて管理することでスムーズに開発できた。 

 ・yossyさんの20歳の誕生日でした!! おめでとうございます!!

■感想
 ・発表の内容が、回を重ねるたびに非常にレベルアップしてるように思いました。
 ・JSplashの力業はすごすぎです。
 ⇒次の日(10/1)に、iPhone用FlashPlayerの開発ができたという噂が!
 ・MacBookのモーションセンサーをRuby経由でFlashで取得できるんですね!
 ⇒Macオンリーですが、面白いゲームとか作れそう

Spark勉強会 SP1に参加してきました

October 1st, 2008

http://libspark.wordpress.com/2008/09/27/spark-study-sp1-report/

■発表者
Adobe エバンジェリスト

Mike Chambers
http://www.mikechambers.com/blog/

Ryan Stewart

御二方はAdobeの開発者とユーザの間に立って、
 ・ユーザーへ最新の技術情報を伝達する
 ・ユーザからのFBなどを開発者に伝える
というお仕事をされております。

■講演内容
Flash Player10での最新技術の紹介
http://labs.adobe.com/technologies/flashplayer10/demos/

○3D
 ・FP10から搭載される3D機能の紹介
 ・PV3Dみたいな完全な3D制御ではなくて、Z軸を考慮して作れますというレベル
  ⇒AfterEffectsの3次元レンダリングみたいな
 ・3Dライブラリの基礎機能をAPIで提供するということが目的らしい
 ・デモ
http://examples.adobe.com/flex3app/flex15/flexstore/flexstore.mxml?versionChecked=true

○サウンド
 ・周波数から音が作れます。
 ・レスポンスがよくなったので、リアルタイムでの音の作成ができるようになった。

○テキスト機能の充実
 ・目玉機能。
 ・これまで貧弱だった日本語を含めたテキスト機能が充実
 ・InDesignのような版組みソフトなみのレベルで文字組みを変更できる
  ⇒ベースラインや文字ごとのマージンの調整、縦書きなど
 ・文字組みの設定をxml形式で保存、読み込むことができる。
  ⇒独自形式のxmlで保存し、読み込んだ設定を反映できるみたいです。

○Vector型のサポート
 ・Arrayより高速なVector型(同じ型の要素のみの配列)をサポート
 ・同じ型しか入れられない代わりにアクセス速度が速い。

○draw API
 ・上の3D機能の根幹部分になるAPIの改良
 ・drawTriangleなど、図形を描く上での基礎機能が充実
 ・ドロー系APIの高速化
 ・参考サイト
http://www.senocular.com/flash/tutorials/flash10drawingapi/

○Pixel Bender
 ・AfterEffects、Photoshop、Flash間で利用可能なフィルタなどを作成、適用できる。
 ・Flash内では、MC、Videoなどに動的に適用可能
  ⇒従来のフィルタを自分で作れる感じです。
  ⇒Flashの場合はパラメータ調整なども可能
 ・Pixel Bender Toolkitを使って作成可能
  ⇒作成言語はActionScriptではなく、独自言語
 ・そういえば、FP10からはファイルダイアログを使って、ローカルファイルにアクセスできるみたいです。
 ・デモ
http://labs.adobe.com/technologies/flashplayer10/demos/pixelbender/

◇Spark Projectの紹介
 ・yossyさんから御二方へSparkProjectをご紹介
 ・デモを交えて、いくつかのライブラリ、プロジェクトを紹介
  ⇒FLARToolKitに非常に興味をもたれていました。
 http://www.trick7.com/blog/2008/05/17-005233.php

■質疑応答
講演後、御二方への質疑などがありました。
詳細はこちら。
http://libspark.wordpress.com/2008/09/27/spark-study-sp1-report/

気になった質問をいくつか紹介します。

Q. SWF に Player を内蔵出来ないか?
質問してみました。Playerが出るたびにアップグレードしないといけないという
現状を鑑み、アップグレードなしで機能が使えるようにならないかなという意図で
質問したところ、
「byteArrayで無理やり(新機能のAPIを)書きこめばできるかもね!」
との回答が。

Q. iPhone への搭載予定は?
質問に行く前に、「これは飛ばそう」とスルーされました。

後日談、
Spark勉強会 #3でgyuqueさんが、
swf→逆コンパイル→コード変換→JavaScript+SVG→iPhone
という力業でswfをiPhoneのSafariで再生するという発表を
されておりました。すげーーーー。
(完成度20%くらいですが、MCの枠線が見事にアニメーションしておりました)

http://wiki.libspark.org/wiki/SparkStudy/03

■感想
開発者に近い方から生のお話が聞けて面白かったです。

特に、テキスト機能の充実について、これまでほとんど垂れ流しだった日本語テキストに対し細かい設定ができるようになったのが非常にありがたいです。
また、Pixel Benderの登場で、これまでハードルの高かったフィルタ作成が簡単にできそうで、今後フィルタの数が非常に増えるんじゃないかと思います。SparkにもそのうちPixel Benderの項目ができるかもしれません。

links for 2008-09-29

September 30th, 2008

links for 2008-09-28

September 29th, 2008

links for 2008-09-27

September 28th, 2008

[javascript] offsetHeightの問題

September 25th, 2008

開発中メモ。

画面全体を覆うFlashを作成する際に、JavaScriptからページサイズなどを取得しようとした際にぶち当たった問題。

ページサイズやスクロール位置を取得する

こちらのページを参考にoffsetHeightを使用してみたのだが、IEでページサイズがとれずウインドウサイズが返ってきてしまう。
何回かテストした結果、xml宣言『< ?xml version="1.0" encoding="utf-8"?>』がある場合、正しいoffsetHeightが取得できず、ウインドウサイズが返されるらしい。

Spark 勉強会 #2 感想

August 31st, 2008

Spark勉強会の感想を。すごい発表がいっぱいでした。

『HIGEWheelでマウスホイールをエレガントに? 』 by nobuさん

Macでもマウスホイールが有効になる AS+JSライブラリ。
たぶん、今後のFlash案件で標準的に組み込んだ方がよさそうですね。
いや、むしろAdobeに標準サポートしていただきたい。
swf解析して、HIGEってでたらw

『AS1のススメ』 by munegonさん

なつかしのAS1でのスクリプティング方法とか。
実際、まだまだFlash Player6くらいまでを対象にした案件は多いし、こういうのは必要やろうなあと思う。
このころのスクリプトがデザイナーには一番使いやすかったなあ。

『iphoneas デモ』 by uranodaiさん

iPhoneとFlashをOSC経由で連携させるライブラリ。
最近よく使われるプロトコルだし、そろそろ研究の対象にしたほうがよさそう。
OSCを使えるデバイスならブリッジできるみたいなので、bytecodeと組み合わせたデータ通信いろいろ応用範囲はありそう。

『DBObject』 by kan

DBをECMA形式で利用できるラッパーライブラリ。
ぶっちゃけ、かなり便利そう。いままで、DBといえば当然のようにSQL文とか書いてたが、こういうASの形式で利用できるようになると非常に使いやすいと思う。
さらばSQL文。

また何か発表したいなあ。
というわけで予定ネタ

『アドオンAIRライブラリ』
SWFとAIRの両方を提供するときに、AIRの機能だけ切り離してクラス化するようなライブラリ。
開発時にもSWFとAIR機能を切り離して開発できるようにできれば、FlashDevelopとFlashCS3の分散開発がしやすそう。

『iPhoneUI』
iPhoneにFlashPlayerが載ることを夢見て、iPhone用Webみたいに、ネイティブアプリに近いUIで開発できるようにする、UIライブラリ。
とりあえず、SmoothDragはできたので、続きを作る。

『Box3D?』
PV3DのXYZ軸にそれぞれBox2Dのワールドを割り当てれば、3次元での物理シミュレーションできるんじゃ・・・重そうだけど。
まあ、かなり大規模になりそうなのでしばらく無理かなあ。

Spark 勉強会 #2 でしゃべらせていただきました。

August 29th, 2008

Spark 勉強会 #2にてStatisticsライブラリの紹介をさせていただきました。

こちらに発表資料をおいときます。
発表資料(pdf 1.3MB)

nobuさんのHIGE Wheelとか実用的なライブラリの紹介の後、裏方の地味なライブラリ紹介でしたが、

「MathMatrix、便利そうっすね!」
「よくわかんないけど、すごいっす」

など、ご感想いただき、非常にうれしいっす。

今後も拡張していって、実践的なもの作って紹介したいです。

懇親会では、yossyさんをはじめ、いろんな方とお話できてよかったっす。
(nobuさんともっと絡みたかった・・・)

帰りのnobuさんと雑談
「Y:参加倍率高いけどどうすればいいですかね~」
「nobu:毎回ネタつくって話す側に回る!」

ハードル高!

PS
yossyさんよりご質問いただいた、ライブラリ作成にあたっての参考書ですが、これが分かりやすいです。
パソコンで学ぶ多変量解析の考え方

ハッキリいって、多変量解析部分はそのまま移植してます。
どちらかというと、多変量解析を行うための固有値、固有ベクトルの計算などの処理作成の方が大変でした。

hydrotik | flash development | actionscript | creative » GO

August 25th, 2008

hydrotik | flash development | actionscript | creative » GO

CUPPYさんのTweenMaxが速いぽいで紹介されていた
Tweenライブラリ。

サンプルを見る限り、フィルターなども早そう。

[統計解析ライブラリ for AS3] matrixパッケージ

August 13th, 2008

行列関連のクラスのパッケージ

MathMatrixクラス: 行列計算クラス
2元配列(2階層の入れ子の配列)をベースとした、行列計算、行列操作を行うクラス。
多変量解析を行うために、行列の計算が必要になるため作成。

利用方法

var matrix1:Array = new Array([1, 2, 3], [4, 5, 6], [7, 8, 9]);
var matrix2:Array = new Array([11, 12, 13], [14, 15, 16], [17, 18, 19]);
var resultMatrix:Array = MathMatrix.add(matrix1, matrix2);

静的メソッドとして、以下の機能が利用可能。

行列計算メソッド

add(matrix1:Array, matrix2:Array):Array
行列同士の足し算。元の行列と掛ける行列の行列数が等しい必要がある。
sub(matrix1:Array, matrix2:Array):Array
行行列同士の引き算。元の行列と掛ける行列の行列数が等しい必要がある。
muliple(matrix1:Array, matrix2:Array):Array
行行列同士の掛け算。元の行列の列数と、掛ける行列の行数が等しい必要がある。
times(matrix:Array, n:Number):Array
行要素への掛け算。

行列操作メソッド

getTransposeMatrix(matrix:Array):Array
転置行列の取得。行と列を入れ替えた新しい行列を取得。
getInverseMatrix(matrix:Array):Array
正方行列の逆行列の計算。n×nの正方行列(正則行列)の逆行列を取得。
getUnitMatrix(matrix:Array):Array
単位行列の生成。n×nの要素が1、それ以外が0となる正方行列を取得。
getZeroMatrix(matrix:Array):Array
0行列の生成。要素がすべて0である、m×nの行列を取得。
getVarianceCovarianceMatrix(matrix:Array):Array
分散共分散行列の計算。要素間の共分散の行列を取得。
clone(matrix:Array):Array
行列の複製。 行列を複製した新しい行列を取得。

逆行列計算メソッド(privateでもよかったが、一応publicにしてみた)
(一部、nutsuさんのソースを参考にさせていただきました。)

getDeterminant(matrix:Array):Number
正方行列の行列式の計算。
getCofactor(matrix:Array):Number
余因子の計算。
getCofactorMatrix(matrix:Array):Array
余因子行列の計算。

行列判定メソッド

validateMatrix(matrix:Array):Boolean
行列の整合性の判定。2元配列の行数、列数がそれぞれ等しく、m×nの配列になっているかを判定。
isSquare(matrix:Array):Boolean
正方行列の判定。行列が正方行列であるかを判定。

その他

getMaxValue(matrix:Array, abs:Boolean):Number
要素の最大値:の取得。行列の中での最大値を取得。オプションで、絶対値による判定が可能。
getMinValue(matrix:Array, abs:Boolean):Number
要素の最小値の取得。行列の中での最小値を取得。オプションで、絶対値による判定が可能。
toCSV(matrix:Array):String
CSVデータの出力: 行を改行、列を「,(カンマ)」区切りの文字列として出力

MathObjectクラス: 行列オブジェクトクラス
MathMatrixクラスをベースに、データの保持機能を加えたクラス。
基本的なgetterはMathMatrixでの計算結果を出力するが、オブジェクトとしての独自のメソッドも作成。

計算処理の重複を防ぐため、コンストラクタでの計算結果を保持する。
標準のMatrixクラスが、アフィン変換用の2×2行列しか利用できないため、独自に作成。

使い方のサンプル

//コンストラクタに2元配列を指定してオブジェクトを生成
var matrix:MatrixObject = new MatrixObject(new Array([1, 2, 3], [4, 5, 6], [7, 8, 9]));
var transposeMatrix:Array = m.transpose;

//要素がすべてnullの10×10行列を作成
var emptyMatrix:MatrixObject = new MatrixObject();
emptyMatrix.create(10,10);
emptyMatrix.value = new Array([1, 2, 3], [4, 5, 6], [7, 8, 9]);

メソッド

create(m:uint, n:uint):Array
要素がnullのm×n行列を作成。
append(m:uint, n:uint)
元の行列valueにm行、n列を付加。

[統計解析ライブラリ for AS3] statisticsパッケージ

August 12th, 2008

統計解析ライブラリ for ActionScript3.0を更新&構成が固まってきたので簡単なマニュアルを作成

基礎統計クラスのパッケージから。

BasicStatisticsクラス:基礎統計クラス
平均や分散などの単純統計計算を行うクラス。

利用方法

var numberArray:Array = new Array(1, 2, 3, 4, 5, 6, 7, 8, 9);
var ave:Number = BasicStatistics.getAverage(numberArray);

静的メソッドとして、以下の機能が利用可能。

getAverage(numberArray:Array):Numbe
平均値の取得。全データの合計を個数で割ったもの。最もスタンダードな統計手法。でも、計算過程が簡単なのでだまされやすい。
getSD(numberArray:Array):Number
標準偏差の取得。データの散らばり具合。分散の平方根によって求める。学生を悩ます偏差値の基準となる値。
getVariance(numberArray:Array):Number
分散の取得。データの散らばり具合。平均値と各データとの差を元に求めるため、平均よりもデータの特性が出やすい。
getCovariance(numberArray1:Array, numberArray2:Array):Number
共分散の取得。2つのデータを比較した際の散らばり具合。
getCorrelationCoefficient(numberArray1:Array, numberArray2:Array):Number
相関係数の取得。 2つのデータを比較した際の、データの近似具合。全く同じデータの場合1となり、逆のデータだと-1となる。
getSquaredDeviation(matrixArray:Array):Number
偏差平方和の取得。平均値との差の2乗の合計。偏差平方和の平方根は分散となる。

統計解析ライブラリをSpark Projectにコミット

August 8th, 2008

してみました。

http://www.libspark.org/wiki/yoshihiko/Statistics

新しいデータを作り出す、統計解析をAS3用に作成。
エラー処理などを考えてないので、ちょっとずつバージョンアップするか。

Pwnage Tool 2.0を後悔

August 6th, 2008

PwngeTool 2.0

PwnageTool 2.0が公開されました。

いよいよFW2.0でもJailbreakができるということで、試してみました。

結果、後悔しました。

  1. iTunesを7.7にアップグレードし、FW2.0を購入
  2. iPod touch(1.1.4JB JanuarySoftwareUpgrade済)をFW2.0にアップグレード
  3. PwngeTool 2.0でJB

ここまではよかった。むしろスムーズすぎて怖い。

が、この後が最悪

これまでiPod touchで見れていた動画が、「このムービー形式には対応していません」と表示され再生不可に。
http://homepage.mac.com/nojiri/tellus/iphone01.html#ipodmov02
・・・終了

仕方ないのでダウングレードの作業を始める。

  1. iTunes7.7→7.5ダウングレード(7.7ではFW1.1.4の復元ができない)
  2. iPod touch FW2.0 → FW1.1.4にダウングレード
  3. PwngeTool 1.1でJB

何度かやり直す羽目になったが、一応うまくいく。

が、この後が絶望

iPod touchのJanuarySoftwareUpgrade が再ダウンロード不可
http://macforest.typepad.jp/mac/2008/06/january-softw-1.html
・・・ありえん。並び替えとかできなくなったし。

結果、

iPod touch(1.1.4JB JanuarySoftwareUpgrade済)

iPod touch(1.1.4JB) + FW 2.0の出費

損しただけでした。


iPhone 2.0 脱獄ツール、「Pwnage Tool 2.0」ついにリリース!!

FONT PARK 2.0

August 6th, 2008

fontpark2

文字を使って、自由にアートが作成できるモリサワのコンテンツサイト。
文字をドラッグしたときの微妙な揺れなど、細部まで作りこまれたインタラクションが非常に面白いです。

ほっとくと作品の制作過程が流れます。この恵比寿(?)のイメージは秀逸w

FONTPARK 2.0 | MORISAWA

AS3でレーシングゲームとかやっちゃってます

August 4th, 2008

PV3Dを使って、レーシングゲームとか作られてます。

Papervision3Dでレースゲーム制作

・・・すげえ、としか言いようがない。