Movatterモバイル変換

2008.05.31

ParaFla で写真をパラパラ漫画のようにつなげて動画を作成

ツイートする

せっかくの週末なのに雨で外出できない、ってなときに、子供と一緒に創作活動をおこなってみてはいかがだろうか。

ParaFlaというFlash作成ツールを使い、写真を一枚一枚パラパラ漫画のようにつなげて動画を作ってみました。

やり方は

»ParaFlaを使ってみよう: 写真を使ってパラパラ漫画風FLASHを作成

を参考にしました。

上記記事の説明に沿って作っていけば難なく作れます。

三脚でカメラを固定し、次々写真を撮っていきます。ライトセーバーを持っているのが長男、僕がカメラ担当で、次男はアシスタント役です。

アシスタントは、僕が写真を一枚撮る度、横から出てきてライトセーバーにLEGOブロックを一個一個付け加えていきました。

そもそもこれを作ろうと思ったのは、携帯から写真を次々メールで送ってパラパラ漫画風に見られる

»OFINDER - お気楽定点観測

というサービスがきっかけ。Mashup Award 仲間のHappy Manさんが作ったお気楽なサービスです。

朝顔の成長、読了した本の表紙、街で見かけた猫、子供や自分の顔、建設中のマンション、毎日眺めている海辺や夕焼け、ランチ..etc.

のように、毎日少しずつ変化していくものを携帯で撮り続けて記録したいというときに。。。

このサービスが数年前にできていたら、たぶんこの経過を毎日記録していたと思います。

2008/05/31 23:59:43

2008.05.29

We Are The World

ツイートする

なんか、ふと聞きたくなって。。。ただそれだけです。

中学生のときに初めて聞いて、良い歌だなあ、と思ったものです。

もともとは、飢餓にあえぐアフリカを助けようというチャリティーソングですが、

We are the world

We are the children

We are the ones who make a brighter day

のところなど、今聞くと心に響きます。

「国や人種などの枠を越え、相手をいたわり、争いのない明るい未来を作って行けるよ」といったところでしょうか。

このメッセージをいつも信じ続け、子供達に伝えていきたいものです。

歌詞はこちら↓

Michael Jackson - We Are the World Lyrics

2008/05/29 23:34:15

2008.05.29

「あとで行く」にサイト内検索機能を追加しました

ツイートする

地味に機能追加のお知らせです。

»あとで行く - 行きたい場所を簡単登録、もう忘れない

に Google のサイト内検索機能を追加しました。

検索結果を表示するページを用意し、タグを埋め込むことによって、Google に飛ばすことなく、自分のサイト内に検索結果を表示するようにできるようになっていたのですね。（それって結構前から？）知らなかったです。

ikea と検索するつもりで ikia とタイプミスしても「もしかして」機能がちゃんと効いてくれます。

これを自前で実装するのはなかなか大変。

それなりにちゃんとした順位で検索結果を表示してくれますし、さすがです。

自分で検索機能を実装することも少し考えたのですが、ユーザビリティを考えたら Google の検索機能でいいや、ということになりました。（広告も表示されることですし。。。）

「あとで行く」内で探しものをするときにご利用ください。

2008/05/29 21:55:01

2008.05.26

「あとで行く」の携帯版「あとでGo!」の地図表示にGoogle Static Maps APIを使うようにしました

ツイートする

行きたい場所を忘れないように登録しておけるWebサービス「あとで行く」の更新情報です。

「あとで行く」の携帯版「あとでGo!」では、いままで Mapion の地図サービスのページに飛ばすことで地図を表示してきましたが、Google Static Maps APIを使うことで、サイト内のページ上に地図を表示できるようにしました。

PC 上で使える Google Maps API とは違い表示しているのは画像の地図なので、拡大・縮小や移動はできませんが、広域表示と詳細表示の２つを表示することでフォロー。

個人的にとてもうれしいのが、Mapion の地図サービスが僕の使っている W-ZERO3[es]をサポートしておらず地図を表示できなったのが、Google Static Maps なら以下の通り何の問題もなく表示できるようになったこと。

↑ W-ZERO3[es]でも表示できるようになった！

僕自身が「あとで行く」のヘビーユーザーなのだけれど、地図を表示できなかったので外出先から自分のリストを参照することがあまりなかった。

行きたいと思っていた場所を「あとで行く」リストに登録 -> 外出先から W-ZERO3[es]でリストを参照し地図で場所を確認

という、本来自分が望んでいた使い道がかなうようになったので、今まで以上にガシガシ使えそう。

いままで携帯機能を使っていなかった方も、あるいは初めての方も、よろしかったらどうぞ。

»あとで行く - 行きたい場所を簡単登録、もう忘れない

携帯版にアクセスする方法ですが、「あとで行く」にログインし、メニューから「携帯で見る」を選ぶことで URL を自分の携帯にメール送信できます。

New! の表示がかれこれ一年近く光りっぱなしですが、おすすめ機能ですし、今回の機能変更をうけて、もうしばらく表示したままにしておきます。

2008/05/26 00:06:46

2008.05.20

Facebook Developer Garage Tokyo に参加 & FB版 Kanji-Fandom をデモしてきました

ツイートする

Facebook Developer Garage Tokyo に参加してきました。

さっそくイベントの模様がITproに掲載されています。ITpro 初掲載ゲット！！

»「英語圏への普及を狙う」，Facebook Developer Garage Tokyoで日本人開発者がデモ

30-40人くらいの開発者が集まる濃いイベントを予想していたら、人、人、人で場内満員。参加者の人数と、それになんだか来ている人たちの雰囲気も僕の想定と大幅に違っていて正直面喰らってしまいました。「やべー、プレゼンの練習、もちょっとしっかりやっておくんだった」と。

幸い、最初に飲んだシャンパン一杯と、なにがなんだかわからないうちに始まってしまったというデモでは一番手だったという順番、それに「時間がないので手短かに」とお願いされさっさとすすめた進行のおかげで、緊張する間もなくデモを終えることができました。

緊張して実際に操作したら、絶対グダグダになってしまう、と思っていたので、あらかじめデモをスクリーンキャストにしておいたのもよかった。

以下、発表に使ったスクリーンキャスト2つと、時間の関係で発表できなかった未公開のスクリーンキャストへのリンクを載せておきます。こうして再利用できるという意味でも、デモをスクリーンキャストに録っておくのはおすすめ。キャプチャには使いやすくて僕一押しのJing というアプリケーションを使っています。

各画像をクリックするとデモが見られます。

↑ Kanji-Fandom のデモ

まず元というか本家サービスであるKanji-Fandomのデモをおこないました。

Michael Jordan を漢字に変換し、Ajax を使った UI で漢字の候補から好きな漢字を選んだあと、フォントの色や大きさ、背景色などを変更できることをデモしました。

次に、

↑ Facebook 版 Kanji-Fandom のデモ

です。

Facebook で Kanji-Fandom アプリケーションを追加、Facebook から名前を取得し漢字に変換した結果をランダムに表示しているところを見せています。

ほかに友達招待機能や、ディスカッションなどをおこなうことができる Help & Feedback 画面、表示された漢字をプロフィール画面に貼付ける機能を紹介しています。

続けて本家 Kanji-Fandom のサイトからでも、候補のなかから選んだ漢字の組み合わせを Facebook のプロフィール画面に貼付けることができることをデモしています。

さて、未公開デモですが、これから Facebook アプリを開発してみようかという開発者にはむしろこちらが一番興味ある部分だったかもしれません。

↑ Rails プラグイン Facebooker によるアプリ開発のデモ

Ruby on Rails + Facebooker(プラグイン) での開発の流れをデモしています。

最初に Mongrel をローカルで起動しています。

Facebook 上での動作を確認するためには、Facebook サーバーからアプリが動作しているホストに対してアクセスできないといけません。本番環境であれば問題ありませんが、開発環境は通常、僕のこのローカルマシンで動いている環境のように外部からアクセスできないマシンだと思います。そこで、ssh tunneling というテクニックを使い、外部のマシンの特定ポートに対するリクエストをローカルマシンに転送しています。これを具体的にやっているのが rake facebooker:tunnel:start というタスクです。

ssh tunneling を確立し、開発環境にアクセスできるようにしたら、canvas と呼ばれる Facebook アプリから自由に使える表示部分に this is test と表示しています。

エディタには Rails アプリの開発模様を映したスクリーンキャストでは定番の TextMate を使っており、「サクサク開発できるよ」感を出してみました。

最後に友達招待機能も、「Rails を使えば、ほらこんなに簡単にできるよ」ということを主張してみました。

なお、これらの知識は

»英語の名前を漢字に変換する Kanji-Fandom Facebook 版をリリースしました : 僕は発展途上技術者

でも書きましたが、すべて

»The Pragmatic Bookshelf | Developing Facebook Platform Applications with Rails

で手に入ります。

まだ本として出版されておらず、現在ベータということで PDF でしか購入できないのですが、Rails で Facebook アプリケーションを開発するための知識をてっとり早く入手するにはおすすめです。

外国人にお友達がいる方、ぜひ

»Kanji-Fandom on Facebook

をすすめてみてください。

2008/05/20 03:19:06

2008.05.15

せっかちな人のための git 入門 - git をインストールし、共同で開発できる環境を整えるまで

ツイートする

subversion に代わる新しいソース管理システムということで git が注目されているようだ。

»Git - Fast Version Control System

subversion と大きく違うところは、分散されたレポジトリがローカルマシンに置かれている点。これは、ネットにつながっていなくてもソースをコミットできるということで、最近は電車のなかでもコードを書いたりする僕にはうってつけ。

マニュアルやチュートリアルは充実しているのだが、僕はとりあえず最初にツールを触ってみて、ざっと全体像をつかみ、それから細部を調べたい質なので、もっとてっとり早く体験できるガイドを探したところ、あまり適切なものが見つからなかった。

そこで、レポジトリを作り、それをリモートにあるサーバーに置いたあと、subversion で言えば svn commit や svn update などにあたるコマンドを叩いて、2人以上の開発者でソースを共有するというシナリオで git を試してみた模様を自分でまとめてみた。

1. 構成

実際に試した構成は以下の通り。

Windows 環境の Bill さんと Mac の Steve さんでソースを共有する。おおもとのレポジトリは契約している VPS の Ubuntu サーバーに置く。

2. git をインストール

まず、それぞれの環境に git をインストールする。git のソースはIndex of /pub/software/scm/git より最新のものを取得する。

[Ubuntu]

ubuntu% cd /tmp

ubuntu% wget http://www.kernel.org/pub/software/scm/git/git-1.6.0.tar.gz

ubuntu% tar zxvf git-1.6.0.tar.gz

ubuntu% cd git-1.6.0

ubuntu% ./configure

ubuntu% make

ubuntu% sudo make install

[Mac]

mac% cd /tmp

mac% wget http://www.kernel.org/pub/software/scm/git/git-1.6.0.tar.gz

mac% tar zxvf git-1.6.0.tar.gz

mac% cd git-1.6.0

mac% ./configure

mac% make prefix=/usr/local all

mac% sudo make prefix=/usr/local install

[Windows]

Windows 環境の場合は、cygwin でインストールするのがてっとり早い。

cygwin の setup.exe を起動し、ダウンロードサイトは http://mirrors.kernel.org を選択したら、Devel カテゴリの下に git が見つかった。

チェックボックスを選択してインストールするだけ。

3. レポジトリを作成し、最初のコミットをおこなう

最初に Mac の Steve さんが開発に着手、最初のコードを書いてレポジトリにコミットすることにする。

まずレポジトリ（ローカルの）を作成します。

mac% cd ~

mac% mkdir myapp

mac% cd myapp

mac% git init

次に適当に firstfile というファイルを作成し、レポジトリに追加、コミットします。

mac% touch firstfile

mac% git add firstfile

mac% git commit -m 'first commit'

4. サーバーにリモートレポジトリを作成

次に Ubuntu サーバーにログインし、リモートレポジトリを作成します。


ubuntu% mkdir /var/git/myapp.git
ubuntu% cd /var/git/myapp.git
ubuntu% git --bare init

Mac に戻り、ローカルのリポジトリ(master)をリモートのリポジトリ(origin)にプッシュ、つまり反映させます。example.com はサーバーのドメイン名です。

mac% cd ~/myapp

mac% git remote add origin ssh://steve@example.com/var/git/myapp.git

mac% git push origin master (master を origin にプッシュするという意味)

5. Windows でチェックアウト

Windows の Bill さんがソースをチェックアウトします。

cygwin から

win% cd

win% git clone ssh://bill@example.com/var/git/myapp.git

すると、myapp というフォルダが作成され、その下に firstfile というファイルがあります。

steve さんと bill さんで共同開発できる準備が整いました。

6. コミットとアップデート作業の実際

では、ためしに bill さんがファイルを追加しコミットしたあと、steve さんのローカルの開発環境にその変更を反映させてみます。

Windows 上で新しいファイル secondfile を追加し、コミットします。

win% cd ~/myapp

win% touch secondfile

win% git add secondfile

win% git commit -m 'second commit'

ここでコミットしたのはローカルのレポジトリ(master)に対してであって、まだ変更はリモートのレポジトリ(origin)に対しては反映されていません。

つまりここまでは Windows の bill さんはネットにつながっていなくてもできるわけです。

次にローカルのレポジトリの変更をリモートのレポジトリに反映させます。

win% git push origin master

この部分が subversion でいえば svn commit にあたるわけです。

mac では steve さんがリモートレポジトリにあった変更をローカルの開発環境に反映させます。

mac% cd ~/myapp

mac% git pull origin master

これが subversion でいえば、svn update にあたります。

bill さんがおこなった変更が反映され、myapp 以下に secondfile という新しいファイルができているはずです。

つまり、bill さんのおこなった変更は、順に

bill さんの開発環境

bill さんのローカルレポジトリ(master)

ubuntu 上のリモートレポジトリ(origin)

steve さんのローカルレポジトリ(master)

steve さんの開発環境

という経路をたどって steve さんの環境に反映されたことになります。

7. まとめ

git を使って分散レポジトリを体験してみると、開発環境の変更を(ローカルの)レポジトリに反映させる部分が高速でおこなえるのが気持ちいいことがわかりました。

subversion だと、常にリモートのレポジトリに対しておこなわれるため、コミットに数秒〜十数秒かかります。わずかな時間ではあるのですが、開発が中断され、リズムが損なわれてしまいます。git だとこの中断時間が一瞬なのでほとんど気にならないように思えます。（まだ本格的に git を使って開発を始めたわけではないのであくまでもそういう印象を持ったということですが。。）

あと、各フォルダの下に .svn フォルダが作られないというのもわずらわしくなくていいかも、です。

git をこれから積極的に使っていきたいという気になりました。

以下、参考にしたサイトです。

»Git - SVN Crash Course

»Compiling Git for Mac OS X Leopard (10.5)

»はじめてのgit | IDEA*IDEA

»Setting up a new remote git repository

2008/05/15 02:52:31

2008.05.13

プログラマーでない人が知っておいて損はないプログラマーの常識技(テクニック)

ツイートする

最近、僕が最初に就職した会社の人と会う機会が急に増えた。

僕が最初に選んだ会社は通信キャリアだ。会って話をする彼らは人事畑、営業畑だったり、転職した人もいれば、そのまま頑張っていたりと様々な境遇でそれぞれ色々な世界で生きている。その彼らと話をすれば、僕が普段どっぷりつかっているネットの世界がいかに狭くてかなり特殊なのかということを思い知らされる。

彼らとたまに会って話をすれば、普通の感覚をなんとか呼び起こし、あるいは想像できる。そんな彼らに使ってもらえるようなサービスを作ることが多くの人に喜んで使ってもらえるサービスにつながると思っていて、そういう意味で非常に貴重な存在なのだ。

さて、前置きが少し長くなってしまった。

彼らと会うと、こっちが当たり前と思っていることでも彼らにとっては全然当たり前じゃなかったり、その逆もしかりだったりする。そんななかで、これはプログラマーでなくても絶対知っておいたほうがいい、と思ったコンピューター周りのことを挙げておく。

パソコン教室に一時期通っていた母から聞いたのだが、入るとまず Word や Excel の使い方を習うのだそうだ。年賀状の書き方とか。そんなことより僕だったらまず以下のことを教えると思う。もう少し大きくなってコンピューターを使いこなすことになるだろう息子たちにも。。。

1. (プログラマーならほとんどが使っているはずの)RSS リーダーを使おう

お気に入りやブックマークの代わりに RSS リーダーを使うべし。使うサービスはGoogle リーダーあるいはlivedoor Readerあたりを勧める。僕は使っていないのだけれど、使っている人は多いし、使いやすいという声を多く聞くので。

RSS リーダーを使う前後で、僕のなかに流れ込んでくる情報の量がまったく変わってしまい、驚愕したことを今でもよく覚えている。「なんでもっと早くから使ってなかんだろう」と思ったものだ。2003年 RSS リーダーの先駆けだったbloglines がでて間もない頃だ。

RSS リーダーがまだ普通の人の間ではまったく浸透していないのは非常にもったいないことだ。みんなが RSS リーダーを使うようになったら、みんながいままでよりも少しだけ賢くなり、世界の知的レベルが少しだけ底上げされるような気がするのに。

2. (プログラマーがいつでも思っているように)できるだけ楽をしよう、怠けよう

プログラマーって細かくて、几帳面で、勤勉で、というイメージがあるようだ。細かくて几帳面というのは確かに必要な素質だとは思う。（僕はどっちかというとそうではないのだけど。。）でも勤勉というのはちょっと違う。あえて言えば、多くのプログラマーは楽をすること、怠けるために勤勉なのだと思う。

たとえば、ワープロで作成された文書に100ヶ所登場するキーワードを別のキーワードに変更しなくてはいけなくなったら、100個のキーワードをひとつひとつ修正するなんてことはしない。どんなワープロソフトやテキストエディタにもあるはずの一括置換機能を使って置換する。

それと同じ考え方をすべてのタスクに適用しようとするのがプログラマーだ。どんな仕事でも自動で、つまりコンピューターにおしつけてしまい、自分は楽をしようと思っている。一括置換機能を使うだけには飽き足らず、仕事の定型化されている部分を自動でやってくれる専用のプログラムを自分で書いてしまうところまで行けば立派なプログラマーの仲間入り。

そこまで行かなくても、常に「どうしたら楽にできるか」ということを考えるといい。あるいは周りのプログラマーの人に聞いてみれば、たいていのことなら楽する方法を知っているはずだ。

3. (プログラマーが良く使っている)ショートカットキーを覚えよう

2. の楽をしよう、と同義といえば同義だ。

アプリケーションや最近だと Web サービスでも、各機能を呼び出すショートカットキーが用意されているものだ。これを知っていると知っていないのとでは効率がものすごく違ってくる可能性がある。それぞれの操作で、ショートカットキーを使うのと使わないのではわずか数秒の違いかもしれないが、良く使うアプリケーションならそれが積もり積もって結構な差になるはず。

ショートカットを集めた Cheat Sheet というものがあって、たとえば Gmail なら

»Gmail Shortcuts (printable cheatsheet)

のようなものが検索すれば見つかるので、こうしたシートを印刷しておくでもよし、とにかく何度か同じ操作をやってるなあ、と思ったらそれをショートカットキーを使うことでサクッとできないかを考えるようにするといいと思う。

プログラマーが何か作業をしていたら、背中の後ろから見てみるといいかもしれない。マウスを動かしていないのに、次々、アプリケーションの機能が呼び出されていたら、それはその人がショートカットキーを使っているからかもしれないので教えてもらうか、技を盗んでしまおう。

まとめ

なんか文体が偉そうになってしまった。途中で没にしようかとも思ったのだが、せっかく書いたので公開してしまう。

僕としては、