たまたま近所で「迷子猫を探しています！」ってゆーチラシを見て、それからいろいろ考えたり調べたりした結果、作っちゃいました。

思いの丈は以下「その生い立ち」に任せるとして、まずは僭越ながらご紹介します☆

迷子猫と保護情報の専用掲示板、その名も「ネコサーチ」！

日常的に使うものではないだろうし、使う人自体も限られているとは思いますが、いざ飼い猫が迷子になってしまったり、猫を保護したってゆー時に安心して使える掲示板サービスを心がけました。

んでは、さっそく詳細をば♪

迷子猫と保護情報の専用掲示板「ネコサーチ」

まずはざっくり概要

サービス的にはシンプルな、記事とコメントで情報のやり取りをするサービスです。

投稿された迷子・保護の情報は、すぐにネコサーチのtwitterアカウントやネコサーチのfacebookページにも反映され、広く多くの目に触れられるようにしました。

また、スマホでの閲覧や投稿にも対応させて、どっか出先で迷子っぽい猫を見かけた時などでは、「現在地から検索」ボタン一発でその近所の情報を見られるようにもしています。

それと検索のトコにはちょっと工夫がしてあって、例えば県境や市区境の情報を探す場合、いちいち両方の情報を別々に検索するってのはどーなの？と思ったので、住所の検索ワードを一回緯度経度に直して、そこから半径1kmくらいも検索結果に含めて表示させるようにしてます。

その生い立ち

ある日、近所のスーパーに行ったんですね。牛乳とフルグラかなんか買いに。

そしたら袋詰スペースの壁に「迷子の猫を探しています！」ってゆー張り紙があったんです。

猫好きの私としては、そりゃもー猫好き極まりない私としては、この張り紙を貼った飼い主さんの気持ちが痛いほど分かりました。

ウチの猫も今でこそ18歳、メシ食うよりも寝かせてよ！って感じですが、以前のやんちゃ盛りでは玄関開けた途端に外に飛び出して行ったり、鍵をかけ忘れた窓を自力で開けてこっそり脱走したり。

そのたびに名前を呼びながら近所を探しまわり、「大丈夫」と「もしかしたら」が何時間も交錯する中、結局は隣の家の屋根で怯えてたりして、近づいて騙し騙しでひっ捕まえたり。

そんなコトを思い出しつつ、「早く見つかりますように」と帰路に着き、その数日後、そのスーパーには変わらず張り紙が。

その数日後も、さらにその数日後も、張り紙は変わらず貼られたままで。

どうにもいたたまれなくなって、家に帰ってネットで「猫 迷子」とかで検索してみたら、そこにはweb1.0な掲示板。

個人情報はフルオープンだし、投稿する入り口は分かりづらいし、もちろんスマホ対応なんてされてない。

きっと当時はコレで良かった。これらの掲示板によって再会出来たってコトもたくさんあっただろう。でも今は、今ならもっと良いアプローチができるんじゃないだろうか。

例えばメアドは非公開にして、投稿記事ごとにコメント欄を用意して、そこでやりとりできれば。

例えば「迷子」と「保護」の情報は分けて、もっと見やすく整理して表示すれば。

例えばスマホのGPS使って、現在地付近で探されているor保護されている猫を検索できたら。

浮かぶアイディアをメモにして、それをいつも使ってる「ウェブサービス制作用の思考フレームワーク」に落とし込んで、必要な技術や情報をブクマして、、、ってやってたら、気付けばモノを作り出してました。

制作過程と技術詳細

まずはアイディア出しと類似サービスの調査を行い、必要なコンテンツとあったら嬉しいコンテンツを洗い出して、ざっくり仕様書を作りました。

このサービスのコンセプトは「現代的なウェブクリエイション技術を用いて、迷い猫と飼い主が再会できる可能性を高める」ってゆー１点。

そこを紐解くと「個人情報を安全に保ちながら情報をやりとりできる仕組み」 + 「スマホでも使える」 + 「SNSインフラに相乗りする」ってトコに行き着き、それらをうまいこと実装していこうと。

個人情報をウンヌンってんのは、いわゆるフツーの掲示板型ってとこで対応するとして、ここでちょい工夫したのは「コメント欄でのやりとり」。

コメントをくれた方がメアドを残してくれた際には、一般ユーザーには表示されずに記事投稿者だけが見えるようにしました。

じゃないと結局ここで個人情報の掲載をしてもらうことになっちゃうので。

んで次に「スマホでも使える」ってトコは、いわゆるスマホ対応は必殺エセ・レスポンシブでまかないました。

通常のレスポンシブデザインは「HTMLは一緒でCSSやJSで表示を整える」って方法ですが、ネコサーチでは「デバイスによってHTMLの一部を変えつつ、ユーザーエージェントでCSSを切り替える」ってゆー手段で対応しました。

メディアクエリ使うとなるとIE系がネックになるし、そもそも中身をイジるのは自分だけなので、厳密にワンソースである必要もない。むしろスマホで要らないコンテンツをPHPで切り分ければ負荷も少ないし。

あとスマホってことでGPSから現在地を取得して「現在地の近所で探されているor保護されている猫」の情報をすぐに調べられるようにしました。

ここはちょっとポイントがあって、前述のとおりIE系にも対応すべくXHTMLで作ってるので、そのままだとGPSが使えない！なので、GPSを取得するトコだけHTML5にするっつー強攻策に出てますｗ

それと前述しましたが、県境や市区境の場合でもその付近一帯を調べられるようにも工夫しました。

ってゆーのも正にウチが調布市と世田谷区の市区境で、例えばウチの可愛いアイツが迷子になった時、調布と世田谷とあるいは狛江まで別々に検索するってのは無駄だよなー面倒だよなーでもやっちゃうんだろうなーと思ったので。

んでもって最後の「SNSインフラに相乗り」っつーのは、最近では結構当たり前になってきた「本サイトの投稿と同時に各種SNSでも情報を掲載する」ってヤツ。

この辺はもーちょっとうまい連動策がありそうなので、様子を見つついずれ導入できればと。

おまけ

もしネコサーチ本体だけじゃなく、いろんなサイトやブログでも情報を伝えられればなーと思い、まずはブログパーツを作りました。

当ブログでも右サイドバーに貼ってあるので、デモ代わりにご確認ください。

iframeで簡単に設置できるので、愛猫家の方は是非！導入方法がわからなければお教えしますよー！

迷子猫と保護情報の専用掲示板「ネコサーチ」