業務アプリに検索機能を追加する方法|ノーコードでフリーワード検索を実装してみた

2026/02/20
  • #ノーコード
  • #フリーワード検索
  • #名刺管理アプリ
  • #業務効率化
  • #機能紹介
業務アプリに検索機能を追加する方法|ノーコードでフリーワード検索を実装してみた

本記事でわかること

  • フリーワード検索とは何か
  • 業務アプリでの活用シーン
  • ノーコードでの実装手順
  • 検索機能を入れるメリット

はじめに

みなさん、こんにちは。マーケティング部のタクミンです。

名刺管理や問い合わせ管理など、業務アプリを使い始めたときは便利でも、データが増えるにつれて「目的の情報が見つからない」「一覧をスクロールするだけで時間がかかる」と感じた経験はないでしょうか。入力はされているのに探しづらい状態が続くと、結局アプリ自体が使われなくなってしまいます。そこで重要になるのが、フリーワード検索 です。

フリーワード検索を用意しておくと、氏名や会社名、キーワードなどを入力するだけで、関連するデータをまとめて探せるようになります。実際に「生成AI(OCR)×ノーコードで「名刺管理アプリ」を作ってみた|活用・運用のポイント(前編)」でも活用した機能ですが、名刺管理に限らず多くの業務アプリで汎用的に使える便利な仕組みです。というわけで今回は、Platio Canvas(プラティオ キャンバス)でのフリーワード検索の開発手順とユースケースなどをあわせてご紹介していきます。

生成AI(OCR)×ノーコードで「名刺管理アプリ」を作ってみた|活用・運用のポイント(前編)
生成AI(OCR)×ノーコードで「名刺管理アプリ」を作ってみた|活用・運用のポイント(前編)
前編では、Platio Canvas(プラティオ キャンバス)で「名刺管理アプリ」の実際の作成方法やその過程での気づきを、初めて触る方にも分かりやすくご紹介しています。

フリーワード検索とは?業務アプリでの活用シーン

フリーワード検索とは

フリーワード検索とは、入力したキーワードをもとに、複数の項目を横断してデータを探せる機能です。たとえば名刺管理なら「会社名」だけでなく、「氏名」や「メールアドレス」などもまとめて検索対象にできるため、どの項目に情報を登録したか意識せずに探せるのが特長です。データ件数が増えるほど効果を発揮し、業務アプリの“使いやすさ”を大きく左右します。

例)

  • 氏名で検索
  • 商品名で検索
  • 部署名で検索
  • 備考欄のキーワード検索

活用シーン例

  • 名刺管理アプリ
    会社名・氏名・メールアドレスを横断検索
  • 在庫管理アプリ
    商品名・型番・倉庫名を横断検索
  • 社内問い合わせ管理
    問い合わせ内容・担当者名・カテゴリを検索

データ量が増えるほど、検索機能の有無が利用体験を左右します。
このように、幅広い業務アプリで汎用的に活用できる便利な機能です。

フリーワード検索の実装手順(ノーコードでの作り方)

ここからは、Platio Canvasでフリーワード検索を実装する手順を解説します。今回は名刺管理アプリに登録した名刺一覧から指定したキーワードを含む情報のみ検索できるようにします。アプリ構成により、実際の画面や設定項目は異なりますが、「何を準備して、どの順番で設定するか」の参考としてご覧ください。

Platio Canvasの無料トライアルで、ぜひ一緒に試してみてくださいね。

(1)画面パーツの配置

まず、検索キーワードを入力するUIを設置します。
名刺一覧を確認できるページの上部に「テキスト」「インプット」「アイコン」の3つを配置します。右パネルからテキストやプレイスホルダー、アイコンをそれぞれ編集します。今回のアイコンは「close-box」を利用しました。

画面パーツの配置

(2)フィルター条件の追加

次に、検索キーワードをもとに一覧を絞り込む設定を行います。
今回の検索対象は名刺一覧(カスタムリスト)内の「登録者」「名刺情報」の項目です。検索対象のカスタムリストを選択した状態で右パネルの「エレメント」内、「カスタム」>「フィルター」下にある「OR」の+ボタンを選択します。

フィルター条件の追加(1)

「カスタムフィルター」が表示されるので「列の選択」のプルダウンから検索対象の「登録者」を選択します。すると2つのプルダウンが追加で表示されます。2つ目のプルダウンは「含む」に変更します。

フィルター条件の追加(2)

これで、入力文字を含むデータのみを表示できます。

3つ目のプルダウンには検索窓(インプット3)を選択します。これで、検索窓(インプット3)に入力されたキーワードを含む登録者のみ表示されるよう設定が完了しました。

「名刺情報」の項目

ここまでの流れと同様に、「名刺情報」の項目に対してもカスタムフィルターを追加します。このとき、「OR」の+ボタンを選択してカスタムフィルターの設定をします。

「OR」の+ボタンを選択

最終的なカスタムフィルターの設定は以下の図のようになります。これで、検索窓(インプット3)に入力されたキーワードを含むカスタムリスト(名刺一覧)のみ表示されるようになりました。

最終的なカスタムフィルターの設定

今回実装した名刺管理アプリでのフリーワード検索の動きは「生成AI(OCR)×ノーコードで作った「名刺管理アプリ」を実際に使ってみた|操作手順と業務メリット(後編)」にデモ動画を掲載していますので、そちらもぜひご覧くださいね。

生成AI(OCR)×ノーコードで作った「名刺管理アプリ」を実際に使ってみた|操作手順と業務メリット(後編)
生成AI(OCR)×ノーコードで作った「名刺管理アプリ」を実際に使ってみた|操作手順と業務メリット(後編)
後編では、作成した名刺管理アプリを実際に使う際の操作手順や、Platio Canvasならではのメリットをご紹介しています。

検索窓のアイコン設定

検索窓に配置したアイコンの設定方法を紹介します。今回のアイコンの役割は「close-box」を押下したときに、検索窓に入力していた文字を削除することです。

検索窓のアイコン設定(1)

「close-box」のアイコンを選択した状態で右パネルの「アクション」タブから「その他」>「エレメント値の変更」を追加します。

検索窓のアイコン設定(2)

「エレメント値の変更」の詳細を開き、インプットは「インプット3(検索窓)」、「値」にはなにも入力せず(空欄のまま)設定します。

これで、アイコンをタップすると、検索窓に入力していた文字が削除されるようになります。

ユースケースと応用例

今回は、名刺管理アプリの名刺一覧にフリーワード検索の仕組みを実装しましたが、検索機能はさまざまな業務アプリで汎用的に活用できます。データが増えても「探せる」状態を作れるため、アプリの利用定着にもつながります。

ユースケース・応用例

  • 問い合わせ管理:件名や本文のキーワードで検索
  • 案件管理:案件名・顧客名から素早く参照
  • 備品管理:型番や設置場所で備品を検索
  • 日報・報告:作業内容や担当者名で検索
  • 申請管理:申請名やコメントから該当データを検索

このように、「一覧から探すのが大変になりそうなアプリ」ほど検索機能が効果を発揮します。まずは身近な業務アプリに取り入れてみるのがおすすめです。

まとめ|検索機能を入れるとアプリの“使われ方”が変わる

フリーワード検索を用意しておくと、データが増えても「必要な情報にすぐたどり着ける」状態を保てます。業務アプリは入力だけでは定着しにくく、探せる・見つかる体験があることで、使われ方が大きく変わります。

検索機能を入れるメリット

  • 一覧から探す時間を削減できる
  • どこに登録した情報か分からなくても見つけられる
  • 情報の属人化を防ぎ、共有・活用が進む
  • データが増えても使いやすさを維持できる

Platio Canvasなら、ノーコードで柔軟に検索機能を実装できます。アプリの構成や運用に合わせて検索対象や画面を調整しながら改善を続けられるので、まずは、名刺管理や問い合わせ管理などデータが蓄積されやすいアプリから、フリーワード検索を取り入れてみるのがおすすめです。アプリの使いやすさを一段引き上げる第一歩として、ぜひ活用してみてください。

Platio Canvasでは、1ヶ月たっぷりお試しいただける無料トライアルもありますので、実際の操作感をぜひ体験してみてくださいね。

Platio Canvas(プラティオ キャンバス)無料トライアル

よくある質問(FAQ)

フリーワード検索とフィルター検索の違いは?
フリーワード検索は複数項目を横断的に検索できます。
フィルター検索は特定項目を指定して絞り込みます。
複数条件で検索することはできますか?
はい、可能です。
部署・ステータス・日付など複数の項目を組み合わせた検索を設定できます。
条件は画面上で追加するだけで設定できるため、コードを書く必要はありません。
検索対象の項目は自由に設定できますか?
はい、任意の項目を検索対象に設定できます。
テキスト項目だけでなく、選択項目や日付項目も組み合わせ可能です。
業務内容に合わせて検索軸を柔軟に設計できます。

“使いたくなるUI”を、ノーコードで。

自由なUI/UXで、デザイン性の高いアプリを
スピーディーに作成。
まずは1ヶ月の無料トライアルで、デザイン性と
ビジネス価値を体感してください。

この記事の著者:工 実香

mtakumi のアバター
アステリアの製品に関するコンテンツ制作を行っています。新卒で入社し、日々奮闘中です。新しいことを学ぶのは楽しいです!