セルフサービス Kiosk アプリケーションの作成
デバイスの前向きのカメラと BarcodeScanner を併用すると、無人のセルフサービス kiosk として使用するのに適したアプリケーションを作成できます。
コンベンション会場で、参加者がバッジをスキャンして入場することを想像してください。コンベンションの主催者は、タブレット端末を並べた入場口を設置しており、各タブレット端末の画面には受付用アプリケーションが表示され、スキャナビューとバッジのスキャンを求める指示が示されています。参加者はバッジをスキャナにかざすだけで、確認メッセージ (入場できることを表す) または警告メッセージ (バッジに問題があるため、インフォメーションブースに行って確認する必要があることを表す) が表示されます。
同じ展示会で、コンベンション会場の各ブースの出展者は、リードを集客して、自社の製品やサービスに興味を示した展示会の参加者とのつながりを維持する方法が必要です。各ブースには、展示会場に入ったときと同じように、タブレットが設置されスキャナ画面が表示されます。ただし、このスキャナは、参加者のバッジをスキャンして情報を収集し、ブースの出展者と共有することを目的としています。このため、展示会終了後も、出展者と参加者のつながりを維持することができ、購入の最終的な打ち合わせなどを行うことができます。
これらのセルフサービスのスキャニングステーションを導入するために、展示会の主催者とブースの出展者は、アプリケーションに BarcodeScanner を使用して、受付とリード集客プロセスを Salesforce とシームレスに統合しました。スキャンすると、受付アプリケーションがバーコードを処理し、関連する登録レコードを見つけて、バーコードをスキャンした人が登録済みの展示会参加者であることを確認します。また、ブーススキャナでバーコードを読み取り、記録されている参加者のデータを抽出して、Salesforce のリード創出に利用することができます。
BarcodeScanner のセルフサービス機能を使用できるように既存の LWC コンポーネントを更新する場合でも、まったく新しいコンポーネントを作成する場合でも、いくつかの点に注意するだけで始めることができます。
すべてのモバイル機能と同様に、セルフサービスの「キオスク」アプリケーションを作成するためのユーザインターフェースやその他の実装の詳細は、LWC 開発者が自由に作成して管理できます。しかし、どのような実装でも共通する要素があります。
ユーザが手動で操作しなくても、バーコードデータを継続的にスキャンして処理するスキャナを作成するには、プログラミングロジックで resumeCapture() 関数を使用して、継続的なスキャンのライフサイクルを作成します。
resumeCapture() の詳細と、スキャンのライフサイクルの仕組みについては、「複数のバーコードのスキャン」を参照してください。
前面カメラを使用する BarcodeScanner 機能により、キオスク端末のアプリケーションを作成する際に、より優れたユーザエクスペリエンスを提供できます。キオスク端末の画面を鏡のように機能させます。これにより、ユーザがスキャナで読み取るコード (バッジやカードなどに表示されたコード) を簡単にスキャナのビュー内に配置できます。コンポーネントで前面カメラを使用するには、BarcodeScannerOptions オブジェクトの cameraFacing プロパティの値を FRONT に設定します。
このプロパティの詳細や BarcodeScanner の設定などのその他の詳細については、「BarcodeScanner データ型」を参照してください。
最後に、独自のカスタム UI を BarcodeScanner に追加して、標準の最小限の UI と置き換えます。そのためには、まずユーザインターフェースをカスタムの静的な HTML ページとして作成します。次に、このカスタム UI 用の HTML を、BarcodeScannerOptions オブジェクトの backgroundViewHTML プロパティの値として文字列で指定します。
カスタム UI は、標準の BarcodeScanner UI と完全に置き換わります。標準の UI にはスキャナを終了するための [キャンセル] ボタンなども含まれています。カスタム UI には、この重要な要素を必ず含めてください。また、カスタムグラフィックや手順説明など、コンポーネントに必要な他のユーザインターフェースの詳細な要素も含めてください。
UI のカスタマイズの詳細は、「BarcodeScanner ユーザインターフェースのカスタマイズ」を参照してください。
これらの要素がすべて揃えば、キオスクとして機能する LWC ができあがります。これはバーコードを継続的にスキャンするため (さらに、コンポーネントが可能な方法でデータを処理するため)、物理的なデバイスを操作する必要がありません。
次に、BarcodeScanner の標準 UI と、キオスクモードの実装に適したカスタム UI の両方の例を示します。
標準 UI
カスタム UI
関連トピック