ならべて選べる、新感覚グルメ情報サイト『食べならべ.com』

先日の開発合宿の成果をようやくリリース。

価格.comとYahoo! JAPANのAPIを使ったグルメ情報サイトです。

↑ 新感覚（？）グルメ情報サイトを作りました。APIの勉強でｗ。

よく店を選ぶときに選択肢をたくさんタブブラウザで開いて、「これよりこれの方がいいな・・・今のところこれがベスト。これはないな、消しちゃおう・・・」みたいなことをしますよね（しません？）。

そこでその作業をカード型のインターフェースでできるようにしました。Ajax使ってぐりぐりです。

以下、詳しい使い方。

まずは最寄り駅にて検索します。

するとずらずらとお店が並びます。tabelogで評価の高いものから最大20件並びます。結果は24時間キャッシュしていますが、最初はちょっと時間がかかるかもです。あとAPIのエラーもたまに起こります・・・。

見ていていらないものは消しちゃいましょう（「今日は中華って気分じゃないな」とか）。すーっと消えていきます（無駄にビジュアル効果使ってみた）。

気になるお店は詳細情報を調べることもできます。tabelogのページが開きますので口コミ情報や地図をチェックしましょう。詳細情報のウィンドウは別ウィンドウで開くこともできますよ。

こりゃいいな、と思えるものはどんどん上に持って行きましょう。マウスでドラッグ可能です。

・・・えーと、それだけです。ならべるだけのアプリです。

本当はならべたものにコメントつけて友達に転送とかできればいいかもしれませんが・・・ちょっと後日の課題とさせてください。

なお、技術的に工夫したところ他を羅列しておこうかな。

• キャッシュを使用。一度検索されたページは24時間有効。pearのcache_lite便利。
• カードの上にマウスを持っていくと「手のカタチ」になるようにして直感的に操作しやすいように（thanks to Funaki-kun）。
• カードの写真は「（お店の名前）（駅名）」で画像検索。トップに来た画像を縮小して表示しています。
• カードは店の名前が長くなりすぎて整列がずれてしまわないように半角カナに変換し、さらに一定文字数を超えたら「…」で省略するようにしています。
• PHP5を利用。simplexmlがちょー便利。DBは使っていません。Ajax系の処理はprototype.js + script.aculo.us。
• 構想60分。制作時間は正味12時間ぐらいですかね・・・もちょっとかかったかな。
• なお、たまにAPIがタイムアウトしますのでご了承ください・・・。
• 最後まで決まらなかったドメインはジュンヤさんの鶴の一声で決定！気に入っています。ありがとうございました！

自分がよく行くエリアをたまに検索したりしますが、意外に知らないお店があったりして結構使えますよ。よろしければどうぞ。

» 食べならべ.com – ならべて選ぶ、新感覚グルメ情報サイト

ツイッターもやっています！