プラットフォーム

顧客向け BigCommerce モバイル アプリ: 4 つのルートの比較

BigCommerce の顧客に iOS および Android アプリを提供する 4 つの方法、それぞれがログイン価格設定と B2B 再注文に与える影響、および携帯電話のテスト計画。

メガネをかけたカフェのオーナーが在庫室で携帯電話で備品を再注文しているガッシュのイラスト

顧客向けの BigCommerce モバイル アプリは、ストア名の下にある別個の iOS および Android アプリであり、買い物客は閲覧、サインイン、購入のためにインストールします。 BigCommerce はこれを提供していないため、BigCommerce App Marketplace のアプリ ビルダー、ライブ ストアフロントをロードするウェブサイトからアプリへのコンバータ、マネージド アプリ サービス、または BigCommerce API のカスタム ビルドの 4 つの方法のいずれかで入手します。適切なルートは主に、ストアの価値のどれだけが顧客のログインに依存するかによって決まります。

このガイドは、お金を使う前にルートを選択し、自分のストアでそれを証明するのに役立ちます。短いバージョンについては、を参照してください。 BigCommerce からアプリページへ.

BigCommerce モバイル アプリは顧客向けですか?

いいえ、App Store および Google Play にある BigCommerce というアプリは店舗管理アプリです。 BigCommerce 独自の モバイルアプリページ 見出しは「モバイル デバイスから BigCommerce を管理する」です。収益、注文、訪問者を確認し、注文ステータスを更新し、顧客を検索します。買い物客はそこでは何も買うことができず、あなたのブランドも掲載されていません。顧客アプリを備えたすべての BigCommerce ストアは、サードパーティからアプリを入手したか、独自に構築しました。

そもそも BigCommerce ストアにはアプリが必要なのでしょうか?

同じ人が繰り返し購入することで、アプリがその地位を獲得します。ルートを比較する前に、次の質問に照らして店舗を確認してください。

  • 購入者は再注文しますか? 部品、梱包材、管理用品、サロン在庫、サプリメント、ペットフードは定期的に購入されます。ホーム画面のアイコンと保存されたログインにより、すべてのリピート注文が短縮されます。
  • 購入者は取引を行うためにサインインしますか? 価格表のある取引アカウント、割引顧客グループのメンバー、支払い条件のある企業には、毎回ログインする理由があります。
  • モバイルストアフロントはすでに充実していますか? 携帯電話の購入者が苦労しているチェックアウトに基づいて構築されたアプリも、その苦労を引き継いでいます。

注文のほとんどが検索や広告からアクセスした初めての訪問者からのものである場合は、代わりにモバイル サイトに力を入れてください。

アプリを追加すると、BigCommerce は何が違うのでしょうか?

プラットフォームに関する 3 つのことが決定を左右します。

ストアの多くは、誰がサインインするかによって決まります。 それらを含むプランについては、 顧客グループ 顧客が表示できるカテゴリと適用される割引を制御します。 価格表、それらを含むプランでは、グループのバリアント レベルで価格を上書きします。に保管 B2B版 企業アカウントとユーザー ロールを備えたバイヤー ポータル、SKU または CSV を取得するクイック注文パッド、ショッピング リスト、見積書、請求書のポータルを追加します。貿易店や卸売店では、購入者が触れるほとんどの部分がログイン層です。

チェックアウトはBigCommerceのものです。 Stencil の店頭では、 最適化された 1 ページ チェックアウト はデフォルトであり、ストア ドメインで実行されます。

フロントエンドはヘッドレスであってもよい。 Catalyst またはカスタムのヘッドレス ストアフロントでは、通常、最後のステップで買い物客を BigCommerce のホスト型チェックアウトに引き渡すため、テストする行程が 1 つ増えます。

したがって、すべてのルートに課せられる質問は次のとおりです。 このアプリには、サインインした購入者がストアフロントに表示する内容が表示されますか、それとも公開カタログに含まれる内容のみが表示されますか?

BigCommerce 顧客アプリを入手する 4 つの方法は何ですか?

ルート 1: BigCommerce App Marketplace のアプリ ビルダー

の BigCommerce アプリ マーケットプレイス 少数のモバイル アプリ ビルダーをリストします。 BigCommerce API を介してストアに接続し、製品、カテゴリ、顧客を取得し、それらを独自のネイティブ画面として描画します。ベンダーのダッシュボードでアプリを設計し、ほとんどの場合、月ごとに料金を支払います。

得意なこと: ネイティブの製品リストとページ、Web サイトとは異なるレイアウトが可能なホーム画面。

注意深く確認してください: 選択肢は少ないです。デモの前に、ログインに依存するストアフロントのすべてを書き留めて、顧客グループ カテゴリへのアクセス、価格表の価格、B2B Edition の企業アカウント、クイック オーダー、ショッピング リスト、見積書、請求書、発注書の支払いなど、各項目についてベンダーに名前で尋ねます。次に、チェックアウトがどのように機能するかを尋ねます。一部の API ベースのアプリでは、最終ステップで WebView に Web チェックアウトが表示されるためです。

ルート 2: Web サイトからアプリへのコンバーター

コンバーターは、ライブ Web サイトの周囲にネイティブ シェルを構築します。シェルは、アプリのアイコン、起動画面、ネイティブ ヘッダー、メニューと下部のタブ、およびオプションのプッシュ通知を提供します。ストアフロントは、Safari や Chrome が使用するものと同じブラウザ エンジンである WebView で内部に読み込まれます。

得意なこと: 忠実さ。 BigCommerce が携帯電話でサインインしている購入者に表示するものはすべて、同じストアの同じページであるため、アプリで表示されるものです。グループ価格設定、ゲート カテゴリ、バイヤー ポータルは統合作業なしで提供され、足並みを揃える 2 番目のカタログはありません。

注意深く確認してください: 製品画面がネイティブに再描画されることはありません。このアプリは、モバイル ストアフロントと同じくらい高速で使いやすいです。埋め込みブラウザではいくつかの動作が異なります。以下のテスト計画はそのためのものです。

SiteTo.App このルートをとります。ストアの URL を貼り付け、名前、アイコン、タブを設定し、自分の携帯電話でアプリを無料でプレビューします。ビルドの費用は、Android の場合は 29 ドル、iOS の場合は 79 ドル、または両方の場合は 99 ドルで、一度に支払われます。

ルート 3: マネージド アプリ サービス

MobiLoud などのマネージド サービスは通常、ページに対して同じ WebView アプローチを使用し、チームを追加します。彼らはアプリを構成し、カスタムのネイティブ画面を構築し、ストアに提出し、月額料金で維持します。

得意なこと: 机から打ち上げを取り除きます。ページは引き続きライブストアフロントから読み込まれるため、ログインした価格設定とバイヤーポータルはルート 2 と同様に動作します。

注意深く確認してください: 料金はアプリが公開されている限り継続するため、アプリが獲得できる可能性のある金額と比較してください。私たちの SiteTo.App と MobiLoud の比較 では、そのようなサービスの 1 つを詳しく見ていきます。

ルート 4: BigCommerce API 上のカスタム アプリ

代理店は、BigCommerce のストアフロント API と管理 API に基づいてアプリを構築し、すべての画面が購入者向けに設計されています。これは、完全にオフラインでカタログから注文するなど、Web サイトではできないことを実行できる唯一のルートです。価格はプロジェクトとして設定されており、B2B セットアップやチェックアウトが変更された場合の再作業を含むメンテナンスが必要になります。

ルートを比較するとどうなるでしょうか?

マーケットプレイスアプリビルダーウェブサイトからアプリへのコンバーターマネージドサービスカスタムアプリ
商品画面とカート画面ベンダーによって描画されたネイティブモバイルストアフロントモバイル ストアフロントとカスタム ネイティブ画面ネイティブ、あなたのために作られた
顧客グループと価格表販売者に尋ねる店頭と同じ店頭と同じAPI に基づいて構築
B2B 版バイヤーポータル機能ごとにベンダーに問い合わせる店頭と同じようにロードします店頭と同じようにロードします画面ごとに再構築される
チェックアウトWebView でのベンダーのフローまたは Web チェックアウトBigCommerce チェックアウトBigCommerce チェックアウト構築または埋め込み
価格モデル通常は毎月1回限りの構築料金月額料金プロジェクトとメンテナンス
ストアに提出する人ベンダーによって異なりますあなたサービスあなたまたはあなたの代理店

Apple の開発者メンバーシップ (年間 99 ドル) と Google Play の登録 (1 回 25 ドル) はすべてのルートに適用されます。の ウェブサイトアプリの費用ガイド 予算全額をカバーします。

どのルートがどの BigCommerce ストアに適合しますか?

マーケットプレイス アプリ ビルダーを選択する シンプルなカタログを備えた消費者向けストアを運営している場合、ほとんどの購入者はゲストとしてチェックアウトするか、通常のアカウントでチェックアウトするため、低い固定費よりもネイティブの閲覧感覚の方が重要です。

コンバーターを選択してください モバイル ストアフロントがすでに機能しており、取引価格、顧客グループ、企業アカウント、迅速な再注文など、ログイン エクスペリエンスが重要な場合。

マネージド サービスを選択する チームが立ち上げと維持を所有したい場合、またはカスタムのネイティブ画面が必要で、月額料金がアプリの収益に見合ったものである場合。

カスタム ビルドを選択する アプリがブラウザではできないことを実行する必要があり、それを何年も維持する予算がある場合。

SiteTo.App の選択が間違っているのはどのような場合ですか?

  • モバイルストアフロントが問題です。 遅いテーマや、ピンチやズームが必要なアカウント領域は、アプリでも同様に扱いにくいものになります。まずサイトを修正してください。
  • ターゲットを絞ったプッシュが必要です。 SiteTo.App は、独自の Firebase プロジェクトを通じて、オプトインした全員にタイトル、テキスト、画像、リンクを送信します。 1 つの企業、1 つの顧客グループ、または 1 つの営業担当者のアカウントに通知することはできません。また、スケジュール、カート放棄、または注文状況のメッセージもまだありません。
  • バイヤーは信号なしで動作します。 アプリはライブストアフロントをロードするため、接続が必要です。補償範囲のない倉庫や現場では、実際のオフライン注文を行うカスタム アプリが必要です。
  • ハードウェア機能が必要です。 Bluetooth スキャナー、AR、およびバックグラウンド処理は、その機能の外にあります。
  • Apple と Google を他の人に担当してもらいたいと考えています。 自分の開発者アカウントから送信します。

BigCommerce ストアをアプリとしてテストするにはどうすればよいですか?

両方を出荷する予定がある場合は、本物の iPhone と本物の Android 携帯電話を使用し、何か問題が発生した場合はそのページの URL をメモしてください。

ステップ 1: アカウントと支払いの準備

重要な顧客グループごとに 1 つのテスト顧客を作成し、B2B Edition を実行している場合は企業ユーザーを作成します。支払いゲートウェイをテストモードにするか、返金できる低価格の製品を設定します。ストアフロントはパブリックにアクセスできる必要があるため、まだ発売前のプレビュー コードを使用していないストアが最初にオープンする必要があります。

ステップ 2: サインインして、各アカウントに表示される内容を確認する

各テスト顧客としてサインインし、Web サイト上の同じアカウントと比較します。グループから非表示になっているカテゴリは非表示のままにする必要があります。 BigCommerce はどちらの方法でもサーバー上で計算するため、グループ割引と価格表の価格はセントと一致する必要があります。サインアップまたはパスワード リセット フォームで reCAPTCHA が使用されている場合、BigCommerce では reCAPTCHA をオンにできます。 セキュリティとプライバシーの設定、チャレンジが表示され、電話で通過できることを確認します。

ステップ 3: 購入者と同じ方法で商品を見つける

SKU と名前で検索し、大きなカテゴリにフィルターを適用して、オプションを含む製品を開きます。カートに追加して、カートの数を確認します。

ステップ 4: B2B ジャーニーを実行する

B2B Edition を使用しない場合は、この手順をスキップしてください。それ以外の場合は、 バイヤーポータル そして、購入者が最もよく行うことを実行します。

  • クイック注文: 3 つまたは 4 つの SKU と数量を入力し、カートに追加します。以前購入した商品から選んでみてください。
  • CSV アップロード: 一括アップロードを試みます。それは電話に保存されているファイルの選択によって異なるため、それがアプリ内に属するか、デスクトップタスクのままであるかを決定します。
  • 買い物リスト: 保存されたリストを開いてカートに追加します。
  • Reorder: 過去の会社注文を開いて再注文します。
  • 見積書と請求書: 見積もりをリクエストしてから、1 つの請求書を開きます。

機能性だけでなく快適性も判断してください。数量フィールドに到達するために横にスクロールする必要があるテーブルは使用されません。

ステップ 5: すべての支払い方法でチェックアウトする

このステップでは、起動できるかどうかを決定します。

  • カードフィールド BigCommerce のチェックアウトでは、ページ内でレンダリングされ、通常はモバイル Web 上で動作するのと同じように動作します。 3-D セキュアをトリガーするテスト カードを使用し、チャレンジが表示されて完了することを確認します。
  • PayPal および後払いプロバイダー 自分のウィンドウまたはページを開きます。パス全体をたどって、アプリ内の注文確認に到達したことを確認します。
  • 注文書または口座払い企業に提供する場合は、他の方法と同様に完了する必要があります。
  • Apple PayとGoogle Pay ボタンは、ゲートウェイのスクリプトが環境でボタンをサポートしていると判断した場合にのみ表示されます。アプリ内 WebView は Safari や Chrome ではないため、モバイル Web に表示されるボタンがアプリには存在しない可能性があります。 BigCommerce リスト Safari 以外のブラウザで Apple Pay をサポートするゲートウェイはどれですか、Google は次の要件を文書化しています。 Android WebView での Google Pay。両方の携帯電話をチェックし、ウォレット ボタンの横にカード支払いができるようにしておいてください。

その後、BigCommerce コントロール パネルで注文を確認します。正しい顧客、正しいグループ価格、正しいステータスを確認します。

ステップ 6: ヘッドレス ハンドオフをテストする

Stencil テーマではこの手順をスキップしてください。 Catalyst では、ストアフロントはセッション同期リダイレクトを通じて買い物客を BigCommerce のホスト型チェックアウトに送信します。ビッグコマースの セッション同期のドキュメント リダイレクトには、カートと顧客セッションを転送する 30 秒間有効なトークンが含まれると説明しています。店頭でサインインし、カートに追加して「チェックアウト」をタップし、同じカートにサインインして到着したことを確認します。を使用するカスタム ヘッドレス ビルド 埋め込みチェックアウト iframe では、両方の電話で同じテストが必要です。

ステップ 7: 閉じて再度開き、整理整頓する

アプリを完全に閉じて、再度開きます。カートはそのままの状態でサインインしているはずです。ソーシャル ログイン アプリを使用している場合は、各ボタンを試してください: Google 埋め込み WebView でサインイン画面をブロックするそのため、メールアドレスとパスワードは常に提供される必要があります。

次に、Cookie バナーとニュースレターのポップアップを閉じて、テーマの固定ヘッダーがネイティブのヘッダーやタブと重複していないことを確認します。 SiteTo.App は、アプリ内でサイト独自のヘッダーとポップアップを非表示にするスクリプトを実行できるため、削除したいものをリストします。

結果から何がわかるでしょうか?

結果何をするか
すべては過ぎ去るタブを選択してビルドし、公開に進みます
支払いウィンドウがアプリに戻らないページはめ込みオプションについてゲートウェイに問い合わせるか、アプリで別の方法を提供します
バイヤー ポータルのテーブルは電話機上では窮屈ですモバイル Web 購入者にもメリットがあるため、Web サイト上のポータル レイアウトを改善する
Catalyst ハンドオフによりログインまたはカートが失われるアプリを構築する前にストアフロントでセッション同期を修正する

アプリ自体では何を設定すればよいでしょうか?

アプリのネイティブ部分を使用して、リピート注文を短縮します。

  • 下部のタブ: 消費者向けストアは、最も強力なカテゴリである「ホーム」と「カート」および「アカウント」で好調です。取引ストアは、クイック注文または検索を最初に行い、次に注文、カート、およびアカウントを行う必要があります。カートが存在する Stencil テーマでは /cart.php での注文履歴 /account.php?action=order_status.
  • カートバッジ: 開発者の助けを借りて、 SiteTo.App JS SDK ストアフロントにある URL を読み取ることで、[カート] タブにカウントを表示できます。 BigCommerce の Stencil について 店頭カートAPI 現在のカートを JSON として返します。
  • Push: を使用して Firebase を接続します。 Firebase ガイド。オプトインしたすべてのユーザーがすべてのメッセージを受信するため、すべてのユーザーに関連するニュースに留めてください。
  • ストアフロントごとに 1 つのアプリ: アプリは 1 つの URL で開始されます。走れば マルチストアフロント 別々のブランドまたは地域に別々のドメインを使用すると、各ストアフロントは独自のアプリと独自のビルドになります。それを保存します 訪問者の位置に基づいて通貨を表示する 正しいものが表示されることを確認してください。

製品、価格、在庫の変更は、新しいビルドをしなくてもアプリに表示されます。アイコン、アプリ名、その他のネイティブ設定を変更するには再構築が必要ですが、それ以降の再構築は別途お見積りとなります。

BigCommerce ストアが公開する前に知っておくべきことは何ですか?

自分の Apple アカウントと Google アカウントから送信します。 SiteTo.App は iOS ビルドに署名し、Apple アカウントの TestFlight にアップロードするため、Mac や Xcode は必要なく、Google Play 用の AAB が提供されます。の ガイドを作成して公開する 各ステップを順を追って説明します。何を承認するかを決めるのは Apple と Google であり、その結果を約束する人は誰もいません。

査読者に道を与えてください。 価格またはカタログ全体がログインの背後にある場合は、現実的なカタログを表示する顧客グループ内のレビューメモに、動作するテスト アカウントを指定します。ログインの壁を乗り越えることができないレビュー担当者は、アプリを承認できません。

アプリが誰のためのものかを考えてください。 承認された取引顧客のみが使用できるアプリは、一般向けではありません。アップルが提供するもの 非公開アプリの配布 限定されたユーザー向けのアプリで、直接リンクでアクセスでき、検索からは非表示にされます。ホールセール専用アプリを送信する前に読む価値があります。

物理的な商品の場合は、独自のチェックアウトを使用します。 アップルの アプリレビューガイドライン アプリ外で消費される商品やサービスは、アプリ内購入以外の方法で支払われるとします (セクション 3.1.3(e))。アプリ内で使用されるデジタル コンテンツには別のルールが適用されるため、販売する場合はセクション 3.1 をお読みください。

アカウントの削除を提案します。 Apple は、アカウント作成をサポートするアプリであれば、ユーザーがアプリ内でアカウントの削除を開始できるようにすることを期待しています。アカウント ページでそれが提供されていない場合は、明確にラベル付けされたリクエスト フォームを追加してください。

ウェブサイト以上のものを表示します。 Apple のガイドライン 4.2 では、アプリに対して、再パッケージ化されたサイト以上のものを提供するよう求めており、ネイティブ タブ、ネイティブ ヘッダー、およびプッシュ通知が役立ちます。の ガイドライン 4.2 ガイド 準備方法と、 出版ガイド リスト、スクリーンショット、プライバシーに関する回答について説明します。

よくある質問

営業担当者はアプリで顧客に代わって注文できるようになりますか?

B2B Edition では、営業担当者にスーパー管理者の役割を付与できます 会社を装う ストアフロントのバイヤーポータルで注文してください。今日、担当者が Web サイトでこれを実行すると、同じページがアプリに読み込まれます。プレビューで担当者アカウントを使用してテストします。

BigCommerce がチェックアウトを更新したり、テーマを変更したりするとどうなりますか?

次回アプリを開くと、新しいビルドはなく、更新されたストアフロントが表示されます。テーマを変更してモバイル アカウント領域を破壊すると、同時にアプリ内も破壊されるため、大幅な変更を行った後は、携帯電話でサインインしたテスト注文を行ってください。

次のステップ

携帯電話でストアフロントを開き、取引顧客としてサインインして、再注文します。それがうまくいけば、 BigCommerce ストアをアプリとしてプレビューする 無料で、上記の 7 つのステップを実行して確認してください 価格設定 それが機能することがわかったら。

Web サイトをアプリとして見る

プラットフォームを選択する前に、エクスペリエンスをカスタマイズしてプレビューします。

プレビューを構築する

読み続けてください

すべてのガイド