PHPのGDには残念ながらグラデーションを扱うメソッドがありません。
1pxずつ計算して塗りつぶしていくこともできますが、計算量が大きくなってしまいます。
そこで、グラデーションマスク画像を先に作っておいてそれと合成するという方法を取りました。

黄色からオレンジのグラデーションを作る場合の手順は以下のようになります。

続きを読む…

こんにちは。中川です。
携帯用のFlashLiteについて簡単にまとめました。
社内用に作った資料なので少々乱雑な文章ですが公開します。

対応しているバージョン

DoCoMo：1.0, 1.1, 3.0, 3.1
Ezweb : 1.0, 1.1, 2.0
SoftBank : 1.1, 2.0, 3.0

基本的に後方互換。(100%ではない)
Flash Lite 3.0搭載端末は DoCoMo の705i,905iシリーズから。

画面サイズ(解像度)

最近だと240×240推奨。
ただしこれはセーフティーなサイズなので、コンテンツによって変えるとよい。

容量

swf 1ファイル100KBまで。
動的に情報を追加ロードする場合、その分の容量も含めて100KBにおさめる。
(AUで追加ロードした場合、合計容量に100KB制限はない。)

フレームレート

フレームレート7～12fpsで制作するのがいい。
12fpsで問題ないが一部端末でつらい場合があるので安全策をとるなら7fps程度に抑える。

機種ごとの違い

基本的には搭載されているFlashPlayerのバージョンに依存。
大きく変わるのは以下。
・デバイスフォント
・処理速度
　　DoCoMoはだいたいどの端末も早い。
　　AUは遅い。早い端末でもDoCoMoの遅い端末と同じくらい。7～8fpsが妥当か。
・POSTできない機種あり
・送受信できるデータサイズ

続きを読む…

こんにちは。中川です。
携帯のキャリアや端末特有の制約などで、作ったものが思うように動かないことがよくあります。
そこで、今回は携帯サイトを開発する上で気をつけるべき点を思いつくまま書いていきたいと思います。
タイトルについている(1)は連載する意気込みをあらわしています。

1.プログレッシブJPEGを表示できない

一部の端末でプログレッシブJPEGが正しく表示できません。
また、プログレッシブJPEGを埋め込んだFlashLiteも正しく再生されない機種があります。
これらの問題は非プログレッシブJPEGにすることで解決します。

2.リダイレクトする際はURLの「#」が使えない

LocationヘッダーのURLの末尾に「#」を使用してもその位置に飛ばない機種があります。
header(’Location:http://example.com/index.html#login’);

ちなみに「#」とそれ以降に続く文字列は「フラグメント識別子」と呼ぶそうです。

参考)
Location時にフラグメント識別子を付けられるのか？
http://d.hatena.ne.jp/maru_cc/20080207/1202385497

LocationヘッダのURIにフラグメント識別子はNG
http://d.hatena.ne.jp/maru_cc/20080207/1202386973

auでLocatiuonヘッダにフラグメント識別子を入れた場合の挙動
http://d.hatena.ne.jp/maru_cc/20080208/1202436438

では今日はこの辺で。

こんにちは。中川です。
先日行われたカヤックさんとクックパッドさん主催の「技術者交流会 ～おいしいソースのつくり方～ 」のライトニングトークで発表させていただきました。
たくさんの技術者の方と交流でき、発表も聞けて料理もおいしく、非常に充実した時間を過ごせました。
関係者の皆様、このような機会を設けていただきありがとうございました。

さて、当日はHTML5のcanvasと、ドロネー三角形分割という技術を使って写真をポリゴンっぽくするデモを発表しました。
特徴点を手で打っておけば後は自動で面を生成します。

プレゼン資料：

　http://seeds.ville.jp/electriccafe/slides/

デモ：

※Firefox3.0.9、chrome2.0β でのみ動作を確認しています。
　 IEやSafari、chrome1.0では動きません。

　1)ドロネー分割
　http://seeds.ville.jp/electriccafe/demo/1/

　2)擬似ポリゴン
　http://seeds.ville.jp/electriccafe/demo/2/

補足説明

資料が簡素なので簡単に補足します。

デモの目標：
　実写の写真をポリゴンっぽくする。

方針：
　(1)特徴点は人間が打つが、あとはプログラムで頑張る。
　(2)三角ポリゴンへの分割はドロネー分割を使う。
　(3)全ての三角ポリゴンを重心の位置の色で塗りつぶす。

いろいろと改善の余地はありますが、書いたコードは300行程度の本当に小さなプログラムです。
ライセンスはNYSLで公開しますので好きなように使ってみてください。

先日、村式メンバー五人の共通の友人が鎌倉に遊びに来てくれました。
ことあるごとにお祝いを贈ってくれたり、いつも気にかけてくれる子なので何かお返しをしようということになりました。
一つは鎌倉らしいものということで鎌倉彫のグラスを、もう一つは彼女の好きな酒を、
それにひとりひとり和歌を詠んで添えました。

和歌を詠むのはほとんど皆初めての経験だったのですが、これがやってみるとなかなかおもしろいものでした。
気持ちを込めようとすると、とても31文字では足りません。それでもなんとか納めようとすると、余計な言葉は削ぎ落とされ、本心から湧き出る純粋な想いだけが浮き出てくるのを感じ、清々しい気持ちになりました。汚い心や嘘の気持ちで和歌は詠めないという話を聞いたことがありますが、まさにその通りだと思います。

さらにおもしろかったのは、後から村式5人の詠んだ歌を並べるとどれを誰が詠んだかが一発でわかるということでした。それは皆がそれぞれの思いを心から搾り出して綴ったということの証だと思います。
受け取った友人は涙を流して喜んでくれました。

歴史を辿ると、和歌は貴族や文人だけのものではありません。勇ましい武人や貧しい農民の詠んだ歌も数え切れないほど残っています。
詠んだことのない方は一度挑戦してみてはいかがでしょうか。

DoCoMoのCSS、XHTMLにはクセがあります。注意すべき点をまとめてみました。
これに関してはいろいろなサイトで論じられていますが、既出のネタや仕様書の内容も含めなるべく広範囲に渡って情報を集めました。
他のキャリアについてはまた書くと思います。

特に気をつけるべき点を先にまとめると、こんな感じです。
・CSSはインラインでしか記述できない。
・XHTMLが必須でかつ適切なContent-Typeヘッダを吐く必要がある。
・istyle属性は使えない。
・MARQUEEタグは使えない。
・object要素によるFlashの埋め込みはiモード対応XHTML1.1から。
・TABLEタグはiモード対応XHTML2.0以降でないと使えない。
・GPS用の属性lcsはiモード対応XHTML2.1以降でないと使えない。

(DoCoMoに限った話ではない内容も含まれています)

続きを読む…

先月末のITMediaにこんな記事がありました。

「明治神宮2.0」を目指して

明治神宮ではWebを通じた情報発信に力を入れており、サイトをリニューアルしてから実際の参拝客も増えているそうです。さらに明治神宮ではパソコン用のWebサイトだけでなく若い世代にも知ってもらおうと、モバイルサイトもオープンしています。

単純に考えると、古くからある伝統や文化と最新のITのテクノロジーという組み合わせはミスマッチに思えるかもしれません。しかし、日本の伝統や文化を伝えたい、知ってもらいたいという願いをかなえるための一つの手段としてテクノロジーを活用することは、私は決して間違ったことではないと思っています。技術者として、その願いをかなえる一助となれるのであればそれは本当にうれしくありがたいことです。

ただ、日本の伝統や文化とテクノロジーを協調させるのは難しい場合が多いです。前者の良さを保ちつつテクノロジーの良さも最大限に発揮させられる、そんな技術者を目指して精進したいと思います。

中川です。
今回は携帯用マルチメディアコンテンツの著作権保護について調べました。

著作権保護に関して

対象ファイルの転送禁止や再生回数制限などについて、キャリアごとの設定方法を調べました。

続きを読む…

中川です。
携帯向けに動画を配信する時の仕様などを調べました。
長くなるので2回か3回に分けて発表しようと思います。

はじめに

主に3G端末をターゲットにした内容になっています。3G以前の端末もケアしたい場合はこれでは足りません。
より多くの端末で再生できるような条件を探す、というコンセプトで調査した結果です。
端末ごとに特化すればより高品質の動画を提供できますが、本記事では動画の品質より端末互換性を重視しています。

続きを読む…

GoogleToolbarなどにページランク表示がありますが、これをサーバサイドで取得することができます。
あまりフレッシュな話題ではないですが、使ってみたのでメモしておきます。

CPANにあるライブラリを使います。
WWW::Google::PageRank
(見つからない場合はこちらから検索できます)

使い方

newしてget()するだけでした。

#!/usr/bin/perl
use strict;
use warnings;
use WWW::Google::PageRank;

my $url = 'http://www.yahoo.co.jp';
my $pr = WWW::Google::PageRank->new;
$pageRank = $pr->get($url);

print "Content-type:text/html;nn";
print "$url : " . $pageRank;
exit;

あまりにも簡単で拍子抜けしてしまいました:D
ただし、以下の2点が問題?なので使うには注意が必要です。

• 内部でUserAgentをGoogleToolbarに偽装してGoogleにリクエストを投げている
• リクエストを投げる時に必要なチェックサムの計算方法はGoogleが公式に公開しているものではない

こんにちは。中川です。

最近Javascriptが流行っているようで、関連する記事やコードを見かける機会が増えました。
最近になって興味を持ち始めた方、急に仕事でやるハメになった方、結構多いのではないでしょうか。
Javascriptは書式こそC言語やJavaに似ていて馴染みやすいように見えますが、中身はかなり違ってます。
はじめてJavascript特有の書き方に触れたときに戸惑ったことがある方も多いと思います。

私が他人のコードを見ていて一番最初に「なんだこれは？」と思ったのは、あるブックマークレットのコードを見たときでした。
どんなコードだったかは忘れましたが、書式はこうでした。

javascript:(function(){/* statements */})();    ...[1]

最後の()はなんだろうか？
関数は

function f(x){/* statements */};    ...[2]

と定義するのではなかったか？
定義した後に

f(2);    ...[3]

のように書いてコールするのではないのか？
関数の中身は分かっても、なぜこれで動くのかが理解できませんでした。
そしてなぜこんな分かりにくい書き方をするのか。

この奇怪？な書き方には理由があります。
謎を紐解いていきましょう。

続きを読む…