【TECH BLOG】ZOZOTOWNの検索サジェスト機能改善の取り組み紹介

こんにちは。検索基盤部の倉澤です。

ZOZOTOWNには、ユーザーが検索クエリを入力した際に、入力の続きを補完したキーワードを提示するサジェスト機能があります。この機能は一般に「Query Auto Completion」と呼ばれ、素早くユーザーの検索を完了させることを目的としています。

検索基盤部では、ZOZOTOWNの商品検索だけではなくサジェスト機能の改善にも取り組んでいます。今回は近年実施したサジェスト機能の改善事例を紹介します。2年程前にまとめたサジェスト改善事例の記事も併せてご覧ください。

目次

• 目次
• システム概要
• • インデキシングフェーズ
  • 検索フェーズ
• 改善事例
• • ユーザーインタフェース
  • サジェスト候補のハイライト
  • サジェスト機能の視覚的な奥行き
  • サジェスト候補のキーワードブランド名やショップ名の表記揺れ
  • 検索クエリの読み仮名と異なるサジェスト候補のキーワード
• 今後の展望
• • スペル修正
  • ドキュメントの生成ロジック
• おわりに

改善事例を紹介する前にサジェスト機能のシステム概要を紹介します。

システム概要

システム概要をインデキシングフェーズと検索フェーズに分けて簡単に説明します。

インデキシングフェーズ

インデキシングフェーズでは、サジェスト候補のキーワード生成、Elasticsearchへのインデックス生成、エイリアスの更新をするバッチジョブを定期的に実行しています。実行基盤にはGoogle Kubernetes Engineを採用し、CronJobによりバッチジョブをスケジューリングしています。

サジェスト候補となるキーワードは、ユーザーの検索クエリのログから生成しています。検索クエリのログはGoogle BigQueryに日々格納しており、インデキシングフェーズではGoogle BigQueryから過去数日分の検索ログを取得しサジェスト候補のキーワードを生成しています。

また、Google BigQueryから取得する検索クエリのログには、1つも商品が表示されなかった検索クエリ（0件ヒットクエリ）も含まれています。ユーザーに0件ヒットクエリを提示することは再検索の手間を発生させ、ユーザーの離脱に繋がってしまう可能性があります。そのため、サジェスト候補を生成する際には0件ヒットクエリを除外しています。

Elasticsearchでのクエリとドキュメントのマッチングに用いられるスコアはデフォルトでBM25をベースに計算されます。私たちはデフォルトのスコアを利用せず、過去のサジェスト候補へのクリック率やクリック後の商品購入率などを利用しスコア計算しています。

検索フェーズ

検索フェーズでは、ユーザーから入力されたクエリを受け取り、ZOZOTOWNの検索機能を提供するAPIにてElasticsearchのクエリを生成します。Elasticsearchの検索クエリでは、入力されたクエリと表示されるサジェスト候補の対応をわかりやすくするためprefix matchを用いています。Elasticsearchにリクエストを送信するとサジェスト候補のキーワードが返されます。

また、サジェスト候補クリック後の商品検索ロジックについてはZOZOTOWN検索の精度改善の取り組み紹介の記事で説明しています。

改善事例

ユーザーインタフェースやサジェスト候補のキーワードに対する改善例をいくつか紹介します。各事例に対する課題やアプローチ方法を簡単にまとめた表が以下になります。

ユーザーインタフェース

検索基盤部では、Baymard Institute社が提供する検索体験のガイドラインレポートを改善方針として活用していました。

Baymard Institute社のガイドラインレポートは有償ですが、オートコンプリート機能にまつわるレポート「9 UX Best Practice Design Patterns for Autocomplete Suggestions(Only 19% Get Everything Right)」は無償で公開されているので、こちらを交えて改善例を紹介します。

サジェスト候補のハイライト

ガイドラインレポートによると、ユーザーが入力したクエリとサジェスト候補のキーワードの差分を強調することで各候補との比較が容易になり、ユーザーの視覚的な負担を低減できるとされています。

良い例と悪い例のイメージ図は以下の通りです。

サジェスト機能の視覚的な奥行き

ガイドラインレポートによると、ウェブサイト・アプリ内に配置されている数多くのコンテンツはユーザーがサジェスト機能へ集中する妨げになる可能性があるとされています。

そのため私たちは、他のコンテンツとの間に境界線を設けるだけではなく、ユーザーが検索窓に入力している間はページの背景を暗くし視覚的な奥行きを付けることでサジェスト機能を強調しました。

良い例と悪い例のイメージ図は以下の通りです。

ZOZOTOWNのサジェスト機能では、以下のようにサジェスト候補のハイライトや視覚的な奥行きを持たせたユーザーインタフェースが実現されています。

サジェスト候補のキーワード

インデキシングするドキュメントやElasticsearchの検索クエリに対する改善例を紹介します。

ブランド名やショップ名の表記揺れ

ユーザーが入力したクエリに含まれる語とサジェスト候補のキーワードに含まれる語との間に発生する表記揺れにより、適切なサジェスト候補が取得できないという問題がありました。例えば、ユーザーが検索窓に「ゾゾタウン」と入力した場合、「ZOZOTOWN」から始まるサジェスト候補がヒットしませんでした。

この事象は特にブランドやショップに関するキーワードにおいて多く発生していたため、私たちはブランドやショップの読み仮名のデータを利用して対処しました。

サジェスト候補のキーワードの読み仮名をドキュメントの"furigana"フィールドとして追加しました。検索クエリにブランド名やショップ名の読み仮名が入力された場合、"furigana"フィールドによりドキュメントをヒットさせます。

インデキシング時にブランド名やショップ名に対する読み仮名を管理している辞書データを参照し、"furigana"フィールドへブランド名やショップ名の読み仮名を追加しています。

以下が改善後のドキュメントの一例です。"suggest_candidate"フィールドがサジェスト候補のキーワードです。

{
  "suggest_candidate": "ZOZOTOWN限定",
  "furigana": "ゾゾタウンゲンテイ" ,
  ...
}

以下が"furigana"フィールドを用いたElasticsearchの検索クエリの一部です。検索クエリ「ゾゾタウン」が上記のドキュメントへヒットするようになりました。

{
  "query": {
    "bool": {
      "should": [
        {
          "prefix": {
            "suggest_candidate": "ゾゾタウン"
          }
        },
        {
          "prefix": {
            "furigana": "ゾゾタウン"
          }
        }
      ]
    }
  }
}

検索クエリ「ゾゾタウン」を入力し「ZOZOTOWN」を含むサジェスト候補が表示されていることがわかります。

冒頭で述べたようにユーザーの検索クエリのログを用いてサジェスト候補を生成しています。そのため、サジェスト候補のキーワード生成時にブランド名やショップ名の表記が揺れている問題がありました。

例えば、正式なブランド表記は「ZOZOTOWN」だがサジェスト候補のキーワードとして「zozotown」が定義されてしまうことです。

この事象はブランド名やショップ名に対する別称や読み仮名を管理している辞書によって解決しました。サジェスト候補のキーワード生成時に行っている大まかな処理内容は以下の通りです。

続きはこちら