用圖片辨識打造搜尋

Michael.K

關於我

  • 遠時科技 - 主任工程師
  • 專注於程式架構、規範以及撰寫,早期則是遊戲開發
  • 擅長範圍
    • PHP
    • Node.js
    • Lua
    • Python
    • ...
  • 參與年會(CFP)
    • SITCON 2016
    • COSCUP 2016

這是一個很長的故事...

其實...

好像跟Google Cloud的關係沒太大重疊...

想必... 工作的過程中總會遇到...

「那個誰誰誰... 這個能不能做啊?」

What?

「我看✕✕✕都有這個功能,應該要研究一下」

突然的需求

  • 找出現成解答
  • 評估技術成本
  • 評估金錢成本
  • 瞭解老闆痛點

什麼是老闆的痛點

  • 新奇
  • 看起來很厲害

圖片搜尋

沒做過的東西...

只好參考別人的作法

某✕✕電商 - 場景1

某✕✕電商 - 場景2

別人怎麼實作的

  • 優先尋找相似圖片
  • 再尋找同樣類型的圖片

尋找相似圖片

  • 需要一台伺服器去解析
  • 簡單好用的介面

Pastec

  • 開源, GPL授權
  • API簡單易懂
    • [PUT] /index/images/<image id>
    • [POST] /index/searcher
<?php

function create_curl($url, $filename, $method)
{
    $fn = fopen($filename, 'r');
    $ch = curl_init($url);
    curl_setopt($ch, $method, true);
    curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);

    if ($method == CURLOPT_POST) {
        curl_setopt($ch, CURLOPT_POSTFIELDS, file_get_contents($filename));
    } else {
        curl_setopt($ch, CURLOPT_INFILE, $fn);
        curl_setopt($ch, CURLOPT_INFILESIZE, filesize($filename));
    }

    $response = curl_exec($ch);
    fclose($fn);
    return json_decode($response, true);
}
<?php

function upload_to_pastec($filename)
{
    $index = md5($filename);
    return create_curl(
        "http://localhost:4212/index/images/{$index}",
        $filename,
        CURLOPT_PUT
    );
}

function get_image($filename)
{
    resize(450, "{$filename}.bak", $filename);
    $response = create_curl(
        "http://localhost:4212/index/searcher",
        "{$filename}.bak.jpg",
        CURLOPT_POST
    );

    return $response["image_ids"];
}

實際操作

以為這樣就結束了?

遇到的難題

  • 限制很多
    • 圖片要長很像
    • 圖片要夠大夠清楚
      • 透過拉大圖片解決

Pastec失敗場景

使用別的作法

同類型圖片

  • 使用tensorflow訓練模型
  • 現成解法
    • Google Cloud Platform
    • Azure
    • AWS
    •  ...

同類型圖片

  • 使用tensorflow訓練模型
  • 現成解法
    • Google Cloud Platform
    • Azure
    • AWS
    •  ...

快速產生一個PoC

幾個考量目標

  • 建置成本
  • 產生效益

建置成本

產生效益

According to that data, in case of websites well-optimized for graphics, the number of visits resulting from image search may vary from 20 to even 60% of all visits from Google.

20%-60% 是什麼概念?

代表你網站的流量一半都是由圖片搜尋貢獻

圖形辨識比較

使用Google Vision

使用Google Vision

使用Google Vision

使用Google Vision

使用Google Vision

Google Vision API

發現了什麼

  • 他們都有Bag、Backpack、Product的標籤
  • 但是因為是不同的形狀,所以沒辦法被Pastec識別

解決了什麼

  • 需要一樣的圖片的問題
  • 補助Pastec不足的部份

其他需要解決的問題

  • 大量呼叫API造成的資源浪費

解決方式

  • 儘量減少呼叫外部API的行為
    • 中間以Pastec作為第一階段
  • 先建立商品的完整資料到搜尋引擎

工商時間

感謝各位

Q&A

問與答