[連携の流れ]ECサイトの画面遷移について(コマースクリエイター利用)
コマースクリエイター未利用の場合の画面遷移[連携の流れ]ECサイトの画面遷移について(コマースクリエイター未利用))をご覧ください。
ECサイト上での必要な設定画面と、画面遷移についてご説明します。
<目次>
- 必要な設定について
 運用フローにより、必要な設定が異なります。
- 画面遷移について
- ECサイト新規会員登録
- ECサイト会員登録済み
- [D]実店舗会員情報&ポイントを連携(統合)する際の画面遷移
 すでにEC 会員である場合、 マイページから「ポイントおまとめ」を行う ことで、実店舗会員情報とポイントを連携(統合)できます。
- [E]ECサイト上の会員カード(バーコード)を表示する際の画面遷移
 店頭にて、スマートフォンなどでマイページ上の「会員カード」を表示できます。
 ポイント付与などの特典をうけることができます。
- [F]複数枚の実店舗会員カードをまとめる際の画面遷移
 会員カードを複数保持されている場合でも、すべてのポイントを一つの会員に統合できます。
 
- [D]実店舗会員情報&ポイントを連携(統合)する際の画面遷移
 
必要な設定について
まず、それぞれの運用の際に必要となる基本的な設定をご説明します。
店頭で実店舗会員カードを配布する場合
ご案内フローについては、実店舗でのご案内フロー・ECサイトでのフローをご覧ください。

必ずチェックONとする項目 必須
以下の項目を必ず設定(チェックON) してください。
実店舗会員カードの番号を利用してECサイト会員情報とポイントを連携(統合)する画面が表示されます。
本設定がもれますと、実店舗会員情報とECサイトの会員情報を連携できません。
- commerce creator>テーマ設定>omni-channel設定
- 設定>会員設定-マイページ設定-futureshop omni-channel設定-ポイントおまとめ表示/【コマースクリエイター移行中(切替前)】構築>入力項目設定> 会員機能に関する設定-アカウントサービスの設定-futureshop omni channel の設定「アカウントサービスから「ポイントおまとめ」へのリンクを表示する」
任意で設定する項目
以下は任意で設定してください。
ECサイト上に実店舗で利用できる会員カード(バーコード)が表示されます。お渡しする実店舗会員カードと併用可能です。
実店舗会員カードを忘れた場合などでも、スマートフォンで画面を提示すれば、ポイント付与や利用が可能となります。
- 設定>会員設定-マイページ設定-futureshop omni-channel設定-会員カード表示/【コマースクリエイター移行中(切替前)】構築>入力項目設定> 会員機能に関する設定-アカウントサービスの設定-futureshop omni channel の設定「アカウントサービスから「会員カード」へのリンクを表示する」
店頭で実店舗会員カードを配布しない場合
ご案内フローについては、実店舗でのご案内フロー・ECサイトでのフローをご覧ください。

必ずチェックOFFとする項目 必須
以下をチェックOFFにします。
実店舗会員カードを配布しないので、カード番号(PINコード)を利用した会員連携用の画面を表示しない設定にします。
- commerce creator>テーマ設定>omni-channel設定
- 設定>会員設定-マイページ設定-futureshop omni-channel設定-ポイントおまとめ表示/【コマースクリエイター移行中(切替前)】構築>入力項目設定> 会員機能に関する設定-アカウントサービスの設定-futureshop omni channel の設定「アカウントサービスから「ポイントおまとめ」へのリンクを表示する」
必ずチェックONとする項目 必須
以下の項目を必ず設定(チェックON) してください。
会員カード(バーコード)表示画面を表示します。
実店舗でお買い物をする際に、スマートフォン画面などで提示し、ポイント付与や利用をしていただくために必須となります。
- 設定>会員設定-マイページ設定-futureshop omni-channel設定-会員カード表示/【コマースクリエイター移行中(切替前)】構築>入力項目設定> 会員機能に関する設定-アカウントサービスの設定-futureshop omni channel の設定「アカウントサービスから「会員カード」へのリンクを表示する」
omni-channel運用を開始する際に必要な設定 必須
設定>omni-channel>omni-channel設定-利用設定/【コマースクリエイター移行中(切替前)】運用>ポイント管理> omni channel 設定-基本設定「公開ステータス」をチェックしてください。
※本チェックをOFFにすると、運用は開始されません。デザイン確認などの際にOFFにしてご利用ください。
[A][会員登録]画面から新規会員登録時の画面遷移
ログイン画面/その他[会員登録]リンク
![[A]ログイン画面/その他[会員登録]リンク](/img/omni/omni-SCFLOW-login.png)
[会員登録]ボタン
「ログイン」画面やその他ヘッダーなどの[会員登録]画面へのリンクを押下します。
会員カード認証
![[A]会員カード認証](/img/omni/omni-SCFLOW-card-auth.png)
本画面は、commerce creator>テーマ設定>omni-channel設定にチェックした場合のみ表示されます。 チェックOFFの場合は、表示されず会員登録(初期値なし)画面へ遷移します。
実店舗会員カードを持っている場合
お手持ちの実店舗会員カードの情報を元に、「会員カード番号」と「パスワード」を入力し、[カード認証]ボタンを押下します。
認証に成功すると、会員登録(初期値あり)に遷移します。
実店舗会員カードを持っていない場合
[認証しない]ボタンを押下します。
会員登録(初期値なし)に遷移します。
項目ラベルなどは変更できます。
[A]「会員カード認証フォーム」画面をご覧ください。
会員登録
会員登録(初期値なし)
![[A]会員登録(初期値なし)](/img/omni/omni-SCFLOW-regist-SC.png)
「会員カード番号について」
新しい会員カード番号が発番されます。
その他登録項目について
通常の会員登録と同様の項目が表示されます。
会員登録が完了すると、自動的に実店舗会員となります。
店頭では、スマートフォンなどで会員マイページの会員カード(バーコード)を表示することで、ポイント付与などの特典をうけることができます。
会員登録(初期値あり)
![[A]会員登録(初期値あり)](/img/omni/omni-SCFLOW-regist-SC-initial.png)
実店舗会員カードに登録された情報が初期値として表示されます。
会員登録が完了すると、ECサイトと実店舗の会員情報が統合されます。 ポイントがあれば、ECサイト・実店舗の両方で使用できます。
[B]購入時に新規会員登録時の画面遷移
ショッピングカート
![[B]ショッピングカート](/img/omni/omni-SCFLOW-shoppingcart.png)
ショッピングカート画面から[ご注文手続きへ進む]を押下します。
お客様情報入力
![[B]お客様情報入力](/img/omni/omni-SCFLOW-customerInfo-regist.png)
[会員カード認証する]ボタンは、commerce creator>テーマ設定>omni-channel設定にチェックした場合のみ表示されます。
実店舗会員カードを持っている場合
[会員カード認証する]ボタンを押下します。
会員カード認証に遷移します。
実店舗会員カードを持っていない場合
通常の購入フローと同様に、お客様情報を入力します。
入力後の操作についてはお客様情報入力(初期値なし)をご覧ください。
メッセージやボタンラベルなどは変更できます。
「お客様情報入力」画面-futureshop omni-channel利用の場合をご覧ください。
会員カード認証
![[B]会員カード認証](/img/omni/omni-SCFLOW-card-auth.png)
本画面は、commerce creator>テーマ設定>omni-channel設定にチェックした場合のみ表示されます。
実店舗会員カードを持っている場合
お手持ちの実店舗会員カードの情報を元に、「会員カード番号」と「パスワード」を入力し、[カード認証]ボタンを押下します。
認証に成功すると、お客様情報入力(初期値あり)に遷移します。
実店舗会員カードを持っていない場合
[認証しない]ボタンを押下します。
お客様情報入力(初期値なし)に遷移します。
項目ラベルなどは変更できます。
「会員カード認証フォーム」画面をご覧ください。
お客様情報入力
お客様情報入力(初期値なし)
![[B]お客様情報入力(初期値なし)](/img/omni/omni-SCFLOW-customerInfo-regist-noinitial.png)
「会員カード番号について」
新しい会員カード番号が発番されます。
その他登録項目について
通常の会員登録と同様の項目が表示されます。
フォーム下部に表示される、「会員規約に同意し、注文者情報を会員として登録する」にチェックして登録すると、ECサイト会員・実店舗会員、双方の会員登録が完了となります。
店頭では、スマートフォンなどで会員マイページの会員カード(バーコード)を表示することで、ポイント付与などの特典をうけることができます。
お客様情報入力(初期値あり)
![[B]お客様情報入力(初期値あり)](/img/omni/omni-SCFLOW-customerInfo-regist-initial.png)
「会員カード番号」について
実店舗会員カードに記載された会員カード番号が表示されます。
その他登録項目について
実店舗の会員情報は初期値として表示されます。不足している個人情報があれば入力します。
実店舗会員カードに登録された情報が初期値として表示されます。
入力が完了すると、ECサイトと実店舗の会員情報が統合されます。 ポイントがあれば、ECサイト・実店舗の両方で使用できます。
ご注文手続き
通常のご注文手続き画面が表示され、手続きが完了すると注文完了画面へと遷移します。
[C]購入時に新規会員登録(Amazon Pay利用)時の画面遷移
ショッピングカート
![[C]ショッピングカート](/img/omni/omni-SCFLOW-shoppingcartAmazon.png)
ショッピングカート画面から[amazon pay]ボタンを押下します。
Amazon Pay画面
Amazonログインし、Amazonアカウントに登録しているお支払い方法やお届け先住所を読み込みます。
ご注文手続き(Amazon Pay)
![[C]ご注文手続き(Amazon Pay)](/img/omni/omni-SCFLOW-orderSCAmazon.png)
[会員カード認証する]ボタンは、commerce creator>テーマ設定>omni-channel設定にチェックした場合のみ表示されます。チェックOFFの場合は、「Amazon Pay画面」よりご注文手続き(会員登録チェックつき)へ遷移します。
実店舗会員カードを持っている場合
[会員カード認証する]ボタンを押下します。
会員カード認証に遷移します。
実店舗会員カードを持っていない場合
通常の購入フローと同様に、お客様情報を入力します。
入力後の操作についてはご注文手続き(会員登録チェックつき)をご覧ください。
メッセージやボタンラベルなどは変更できます。
「ご注文手続き(Amazon Pay)」画面-futureshop omni-channel利用の場合をご覧ください。
会員カード認証
![[C]会員カード認証](/img/omni/omni-SCFLOW-card-auth.png)
本画面は、commerce creator>テーマ設定>omni-channel設定にチェックした場合のみ表示されます。
実店舗会員カードを持っている場合
お手持ちの実店舗会員カードの情報を元に、「会員カード番号」と「パスワード」を入力し、[カード認証]ボタンを押下します。
認証に成功すると、お客様情報入力(初期値あり)に遷移します。
実店舗会員カードを持っていない場合
[認証しない]ボタンを押下します。
ご注文手続き(会員登録チェックつき)に遷移します。
項目ラベルなどは変更できます。
「会員カード認証フォーム」画面をご覧ください。
お客様情報入力(初期値あり)
![[C]お客様情報入力(初期値あり)](/img/omni/omni-SCFLOW-customerInfo-regist-initial.png)
通常のAmazon Payを利用したご注文手続きと異なり、[お客様情報入力]画面を経由しての会員登録&購入となります。
「会員カード番号」について
実店舗会員カードに記載された会員カード番号が表示されます。
その他登録項目について
実店舗の会員情報は初期値として表示されます。
実店舗会員情報に登録がなく、Amazonアカウントに情報がある場合は、初期値として補完され、表示されます。
不足している個人情報があれば入力します。
「会員登録して次へ」を押下すると、ご注文手続き(会員登録チェックなし)に遷移します。
入力が完了すると、ECサイトと実店舗の会員情報が統合されます。(Amazonアカウントとも連携します。)
ご注文手続き
ご注文手続き(会員登録チェックつき)
![[C]ご注文手続き(会員登録チェックつき)](/img/omni/omni-SCFLOW-orderSCAmazon02-registForm.png)
通常のAmazon Pay利用の注文手続きと同様です。
フォーム下部に表示される、「会員規約に同意し、注文者情報を会員として登録する」にチェックして登録すると、ECサイト会員・実店舗会員、双方の会員登録が完了となります。(Amazonアカウントとも連携します。)
店頭では、スマートフォンなどで会員マイページの会員カード(バーコード)を表示することで、ポイント付与などの特典をうけることができます。
ご注文手続き(会員登録チェックなし)
![[C]ご注文手続き(会員登録チェックなし)](/img/omni/omni-SCFLOW-orderSCAmazon02-noregistForm.png)
通常のAmazon Pay利用の注文手続きと同様です。
ECサイトと実店舗の会員情報が統合されていますので、ポイントがあれば、ECサイト・実店舗の両方で使用できます。
[D]実店舗会員情報&ポイントを連携(統合)する際の画面遷移/[F]複数枚の実店舗会員カードをまとめる際の画面遷移
マイページを開く
![[D][F]マイページを開く](/img/omni/omni-SCFLOW-myaccountSC.png)
[ポイントおまとめ]ボタン
設定>購入者・会員情報>会員設定>-マイページ設定-futureshop omni-channel設定/【コマースクリエイター移行中(切替前)】構築>入力項目設定>会員機能に関する設定-アカウントサービスの設定「onmi channelの設定」の「マイページトップにポイントおまとめへのリンクを表示する」「ポイントおまとめ」へのリンクを表示する」にチェックすると表示されます。
押下すると、「ポイントおまとめ」画面に遷移します。
ポイントおまとめ
![[D][F]ポイントおまとめ](/img/sysparts/systemparts-my-membership-merge-SC.png)
お手持ちの実店舗会員カードの情報を元に、「会員カード番号」と「パスワード」を入力し、[ポイントをまとめる]ボタンを押下します。 認証に成功すると、「ポイントおまとめ確認モーダル」が開きます。
項目ラベルなどは変更できます。
「ポイントおまとめ」画面をご覧ください。
ポイントおまとめ確認モーダル
![[D][F]ポイントおまとめ確認モーダル](/img/sysparts/membership-merge_page.MyMembershipMerge.confirm.png)
おまとめ先
「ポイントおまとめ」画面で入力した実店舗会員カード番号が表示されます。
廃止予定
既に登録済みの実店舗会員カードがある場合に表示されます。
新しく登録した番号に統合されますので、それまでのカード番号は無効となります。
[ポイントをまとめる]ボタンを押下すると、「ポイントおまとめ完了」画面に遷移します。
項目ラベルなどは変更できます。
「ポイントおまとめ」画面をご覧ください。
ポイントおまとめ完了
![[D][F]ポイントおまとめ完了](/img/sysparts/membership-merge-success_page.MyMembershipMergeSuccess.comment.png)
ポイントおまとめが完了すると、ECサイトと実店舗会員情報が連携(統合)されます。
実店舗会員カードを複数枚お持ちの場合は、最後に「おまとめ」した会員カード番号が有効となります。
複数枚カードに付与されていたポイントも1つに統合されます。
メッセージなどは変更できます。
「ポイントおまとめ完了」画面をご覧ください。
[E]ECサイト上の会員カード(バーコード)を表示する際の画面遷移
マイページを開く
![[E]マイページを開く](/img/omni/omni-SCFLOW-myaccountSC.png)
[会員カードの表示]ボタン
設定>購入者・会員情報>会員設定>-マイページ設定-futureshop omni-channel設定/【コマースクリエイター移行中(切替前)】構築>入力項目設定>会員機能に関する設定-アカウントサービスの設定「onmi channelの設定」の「会員カード」へのリンクを表示する」にチェックすると表示されます。
押下すると、「会員カード表示」画面に遷移します。
会員カード表示
![[E]会員カード表示](/img/sysparts/membership-card_page.MyMembershipCard.membershipCardInfo.png)
実店舗会員カードのかわりとなり、店頭POSで読み取れるバーコードを表示します。
店頭にてスマートフォンなどで表示させ、実店舗会員カードとして使用できます。
会員情報の表示内容をカスタマイズできます。
「会員カード表示」画面-会員情報表示カスタマイズをご覧ください。