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

SPONSORED LINK

Pocket

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

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

tabenarabe.gif

↑ 新感覚(?)グルメ情報サイトを作りました。APIの勉強でw。

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

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

以下、詳しい使い方。

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

tabenarabe_input.gif

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

tabenarabe_cards.gif

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

tabenarabe_del.gif

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

tabenarabe_details.gif

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

tabenarabe_sort.gif

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

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

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

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

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

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

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

SPONSORED LINK

  1. 食べならべ.com: 食べログAPIマッシュアップサイト

    食べログAPIを使ったサイトを紹介。
    食べならべ.com – ならべて選ぶ、新感覚グルメ情報サイト!
    よく店を選ぶときに選択肢をたくさんタブブラウザで開い…

  2. 「たべならべ」おもしろかったです。
    結構便利そうだし。

    惜しむらくは、Opera(私のメインブラウザ)でちょっと表示が崩れることですかね。
    (詳しく見る)をクリックした後…

  3. 飲食店を並べて選ぶ「食べならべ.com」

    ならべて選べる、新感覚グルメ情報サイト『食べならべ.com』というエントリーより。 よく店を選ぶときに選択肢をたくさんタブブラウザで開いて、「これよりこれ…

  4. 食べログAPIを使った「食べならべ.com」

    なんとなくニュース回りをうろうろしていたら、「食べならべ.com」に行き当たりました。なんかオモシロそうと思って見てみたら、時々おじゃまするIDEA*ID…

    • mina
    • January 12th, 2007

    すごい!!

  5. 「たべならべ.com」面白いですね!

    ユーザビリティで、気になったことをいくつかあげさせていただきます。。
    ・「消去」をクリックして、やっぱりやめたーとマウスを動かして抜けようとすると、カードの移動。そして、マウスを放すとカードが移動されたあとに消えてしまいます。
    ・カードが消える時間が、半分くらいでもよいかも・・。

  6. 複数のマーカーを自由に動かして検索する「飲食店検索 – この辺とかこの辺とか」

    今回は、食べログ.com APIとGoogle Maps APIをマッシュアップした飲食店検索サイトです。 よくある飲食店検索が「ひとつの場所しか指定で…

    • たも
    • January 13th, 2007

    特に便利だとは思いませんでした。
    ユーザーが利用するメリットを感じられませんでした。

  7. 並べて選ぶ、新感覚のグルメ店検索?「食べならべ.com」

    「食べならべ.com」って、「食べログ」のマッシュアップサイトなんすけど、実に…

    • kim
    • January 16th, 2007

    お店のジャンル等が色分けされてたりすると、解り易いかも。
    価格帯なども視覚化して、100個位並べられれば、地域ごとの料理屋の傾向とかも把握できて、面白いかもですね。

  8. 街で見かけた笑える海賊版のロゴいろいろ

    自分に自信をもちたいです。
    何故かそんな風に考えます…

    • 通りすがり
    • December 7th, 2007

    operaだともっと詳しくwindowが閉じれなかった。

  1. No trackbacks yet.