No Pain, No Gain

プログラミングで日常をちょっとだけ楽にしよう。

色からWikipediaを検索できる『色から調べる図鑑シリーズ』を公開しました

f:id:hayeta:20190507154049p:plain

トップ画面

 

『色から探せる図鑑シリーズ』をリリースしました。

色から動植物をWikipediaで検索できるウェブアプリです。

www.irozukan.com

 

 

 

これは何?

動植物について色からWikipediaを検索できるウェブアプリです。野鳥の羽の差し色や、花びらの色からWikipediaを調べられることを目指しています。

Wikipedia自体は素晴らしいコンテンツです。なので、そのコンテンツへの入り口を増やせたらいいなというイメージです。(言葉の入り口以外に、色の色口を増やす)

なお、PWA対応していますので、スマホのホーム画面においてアプリのように使うことが出来ます。

  • iOSの場合:Safariの共有メニューから「ホーム画面に追加」を選択
  • Androidの場合:画面下部に出るバナーをタップすると、ホーム画面に追加できます。

※ トップページではなく、各図鑑ごとにアイコンを設置することが出来ます。Androidのポップアップは、図鑑ページを開いた際に出てきます。(トップページではバナーは出てきません)

なぜ作った?

野鳥を見ているときに素早く鳥の種類を調べられたらいいのにと思ったことがきっかけです。

動植物は言葉では調べにくい

動植物についてWikipedia等で調べるのは少し難しいんですよね。言葉で特徴を記述して、Googleで検索する。うまくいけばWikipediaにたどり着ける、、という手間がかかります。

そこで「もうちょっと簡単に見た目から調べられないかな?」と思い、色から検索できるようにしてみました。

好奇心は生ものですので、「知りたい!」と思ったときに調べられるのが一番脳の刺激になり、記憶に定着する気がします。そこでGoogleで調べて、、という手間が煩わしいので、出来るだけクイック動植物の詳細にたどり着ければいいなと思って作りました。

 

f:id:hayeta:20190507153732p:plain

野鳥を表示した例です。

 

  • 動植物の写真をタップ(もしくはWikipediaボタンをタップ)で該当するWikipediaが開きます。
  • Googleのアイコンをタップで、Google画像検索が開きます。もっと写真を見たいときに便利です。

そのほかにも

f:id:hayeta:20190507153957p:plain

日本の淡水魚の「目」一覧
  • 名称による検索
  • 分類上の「目」単位で表示して眺める

ということも出来ます。

身近に素晴らしい自然があることを知ってほしい

私は週一くらいでサイクリングをしているのですが、自然の景色って本当にいいんですよね。普段の生活圏でも注意して見ればこんなにたくさんの野鳥や植物、動物に出合えるんだという驚きが、個人的には、外出の楽しみの一つになっています。

キツネやイタチ、キジやタカ類など、日本に生息していることは知っていても目撃できるとは思ってなかったんですよね。そんな動物たちに出合うとついつい調べたくなってしまって、こんなアプリも作ってしまいました。

もちろん街には街の良さ、美しさがあります。でも普段何気なく見ている身近な自然にも好奇心を向けてみると、捨てがたい魅力があります。ぜひ月に何日かは身近な自然を眺めてみてはいかがでしょう?(その時にお供できるアプリになれれば嬉しい)

自然保護につながる小さな取り組み

アプリの紹介記事としては、少し話が大きくなって恐縮なんですけども。身近な自然に興味を持つことって、長い目で見れば自然保護につながると思うんですよ。

 

自然に興味を持つと調べたくなる

調べる習慣がつくと、さらに自然の細部に目が良く

細部に目が行くと、自然の美しさに気づく

自然の美しさ気が付くと、守りたくなる

自然を守りたくなると、もっと知りたくなる

 

 

というサイクルがあるんじゃないかと思っています。自然を守りたくなる人が増えると、実際に行動を起こす人も増えるということで、初動の「身近な自然に興味を持つ」という部分のトリガーは多い方がいいと思っています。

世の中にはもっと優れたアウトドア支援アプリが沢山あります。そういったアプリは自然保全の観点からも有意義だなぁと思います。このアプリもそのきっかけの一つになれればいいなぁ。

アプリの仕組みについて

一応、アプリの仕組みついても少しだけ。

Google Cloud Vision

画像の色識別については、Googleの『Cloud Vision API』の画像プロパティの検出機能を使っています。Dominant Colorプロパティを取得して、写真のRGBを取得してDBに格納しています。

色の距離を比較するアルゴリズムを参考にして、対象画像と色が近い上位36位(多い)を表示しています。

Cloud Visionの識別能力は非常に高くて驚きました。それでもやはり被写体以外の色もデータとして取れてしまって、色検索としては微妙なものもあります。なので、その辺は管理画面を別途作って、大きく外れている色は人力で(💦)省くようにしています。アナログですね。

さいごに

2019年5月7日現在では

を掲載中です。他の図鑑も追加していく予定ですのでお楽しみに!

ぜひ触ってみてもらえればと思います!

www.irozukan.com

 

お気づきの点がございましたら、以下のTwitterアカウントまでご連絡いただければ幸いです。

色から探せる図鑑シリーズ (@irozukan) | Twitter