支払いページとソリューション（または星へのとげを通して-そして多くの写真を通して）

せっかちな人のためのTLDR-原則として、あなたは記事を閉じることができます



そのため、ロシアでオンライン取得サービスを提供する多数の銀行および決済システムとの作成/管理/交渉に参加しました。 これは、完全に異なるプロバイダーを使用した多数のミニプロジェクトで発生しましたが、これはポイントではありません。



私はこの分野でもっと仕事をしていますが、オンライン支払いの3つの側面を共有したいと思います：i）2016-2017年のビジネスと市場の状況（マネージャーのガイド）ii）技術統合の詳細（CTO）iii）顧客の行動/設計/レイアウト支払いページ（デザイン、レイアウト、テスト）。



このすべての経験はすぐには得られませんでした-この分野での約1.5-2年のアクティブなピッキングで。 ビジネスエクスペリエンスに興味はないが、デザイン素材にのみ興味がある場合は、最初のネタバレをスキップしてください 。

主なセクションのリスト

買収者とマーケティング資料の「読み方」の違いは何ですか

支払いサービスの主なクラスター

支払いページを課すとき、まず人々のどの行動特性を考慮する必要がありますか？ 努力の記録

ほぼすべての人口がすでに（!!!）何も理解していない（!!!）内気で慎重な生き物である人（特にオンライン）（人はあなたにお金を預けるようになりました）。 したがって、彼の行動のメンタルモデルを構築する場合は、次の原則に従ってください。

1. 支払いページまたは注文フォームで一般的なユーザーに明確ではないことを考えてください。
2. あなたが初めてインターネットを使用し、あなたのサービスを使いたいと思っているセールスウーマンだと想像してください。
3. 各ボタンはそれほど論理的でも機能しているわけでもありません-変換の50％を引いたものです。
4. 何らかのタイプのデバイスとして機能しないフリーズまたはJSは、このタイプのデバイスでの変換のマイナス50％〜100％です。
5. 注文フォームから別のページへの非自動移行-コンバージョンの90％を差し引いたもの。
6. ユーザーは、HTTPSを使用せず、平均して全人口に対する信頼度が低いサイトでのカードデータの入力よりも、銀行のウェブサイトへの移行を信頼しています。 これは、あなたのビジネスが白くふわふわしているが、人口の1-5％未満がそれについて知っている場合、人々は（もちろん、統計的に）あなたの側にデータを入力したくないことを意味します。
7. すべてのデバイスの利便性、適応性、読みやすさを便利な形式で、あらゆるタイプのデバイスを埋める形で正しく入力しました（あまり面倒な場合は、これらの詳細を後ほどポイント5で説明します）。
8. サイト（アプリケーション）から支払いページへの正確で美しいフロー、ほぼ同様のデザイン、視覚的なゴミの欠如;
9. 「摩擦」を減らすという原則に従います-簡単に言えば-クライアントが受ける必要のあるhemoが少ないほど-より良い（詳細はセクション5にもあります）;
10. 秘密裏に、将来を見据えて、 支払いのためにカードの所有者のフィールドは必要ありません 。

これらの原則はかなりドライに聞こえますが、実際の支払いページの例から説明させてください。 必要な場合は、ここで：

1. モックアップとテストログ（ビデオ）を使用して、Googleディスク上のフォルダーにリンクします 。
2. 以下に説明するHTMLのすべての支払いページを使用して、Googleディスク上のアーカイブにリンクします（各アクワイアラーのスクリプトの設定には問題がありますが、すべてをブラウザーまたは最も単純なWebサーバーで開く必要があります）。

最初に、クライアントはそのような手紙を受け取りました。 文字を開いて配信する際の問題がコンバージョンに非常に悪影響を及ぼしたと推測するのは簡単です





手紙は噴水でもない形につながった。 それは巨大で、適応性がなく、iフレームなどに埋め込むことはできません。 ご理解のとおり、ストックフォームはAlpha Bankからのものです。 彼女はひどいです。





そして、次の買収者の次の標準形式のように見えます。 堅牢でシンプルですが、適応性がなく、モバイルデバイスではひどく見えます。





一連の努力の後、フォームは次のようになり始めました。 もちろん、アクワイアラーをフォームで遊ぶことができるものに変更しました。 フォームにはたくさんのゴミがあり、それに加えて、コールセンターと呼ばれる数人の顧客がいます。Sberbankは私たちではなく支払いを受け入れていると考えています。 さて、あなたはポイントを得る。





過去のフォームのわずかに悲惨なバリエーション。 ここでこれを伝えることはできませんが、フィールドを入力しやすくするために多くの作業が行われ、「カーソルが再びスキップしない」ようになり、フィールドがすべてのタイプのデバイスで正しく便利に表示されるようになりました。 そのため、すべてのタイプのデバイスで入力フォームがネイティブに表示されます。





過去のフォームの適応表示。 まだ大量の視覚的なゴミがあることに注意してください。





フォームの次の繰り返し-「視覚的なゴミ」、不要な単語、会社のスタイルのパレットはもうないことに注意してください。 少ないほど多い。





当然、この反復もモバイルで適応性があります。 また、フォームに関する多くの作業。





これが、フォームの最終バージョンの外観です。





当然、完全にモバイルで適応性があります。





同じフォームですが、別のアクワイアラー（どれだけの痛みがかかるか）およびマップを保存するオプションがあります。





モバイルアプリケーションの予算があまりない人のための重要な情報

• 支払いフォームがアダプティブでフレームベースの場合、モバイルアプリケーションのWebビューで開くことができます。
• これにより、3DSでお金を節約でき、電話からアプリケーションからブラウザへのリンクをたどる必要がないように見えます。

技術的統合、長所と短所、私たちの経験と豊富なバンプの特徴

PCI-DSS認定を取得しない場合（これには多額の費用がかかる可能性があります）、支払い方法が銀行または支払いサービス （そのドメイン） の側で開かれる可能性が高くなります。 適用された観点からこれは何を意味しますか？

• 非常に悲しいケースでは、サイトのフロントエンドの動作に影響を与える技術的な能力がないか、単一の製品を販売している場合、支払いフォームはメールのリンクの形になります。 リンクをクリックすると、銀行/支払いサービスのページに移動します。 メールのオープン性/損失に顧客の不注意（クライアントが2つのリンクを受け取った場合）と「不正な手」、および移行が常に機能しないという事実に関連する瞬間を掛けると、そのようなソリューションの支払い変換は50％になります。 本当に何かを購入したい人はもう一度やり直すことは明らかですが、これは間違っています。
• より高度なケースでは、支払いはウェブ上のリダイレクトとして機能し、支払いページの横にカウンター、Cookie、またはJSスクリプトを置くことができません。
• 銀行側では、高度なJSスクリプトとメディアリクエストをどのように正しく禁止できます。 すべてをHTMLとCSSでのみ解決する必要があります。
• カスタム支払いページを作成し、それを支払いサービスと調整しようとすると、次のようになります。
• ほとんどの場合、クライアントの検証スクリプトに制限があります（ Formula Moon ）。
• HTML入力の視覚コンポーネントの制限。
• 携帯電話でフィールドをきれいに表示するために必要な新しいHTMLタグが本当に必要であることを銀行に証明する必要があります。
• 銀行側でのクライアントの行動について取得できる唯一の情報は、支払いサービス/銀行APIの応答です。
• Sberbankは定期的にカードの発行を停止し、オンラインおよびオフラインでの支払いが停止します。 これは平均して月に1回発生します。
• モバイルのフロントでは、主要な種類のデバイス（iPhone、Android）でのページの動作と表示方法に細心の注意を払う必要があります。
• 少なくとも、会社の顧客に人気のあるすべての種類のデバイスでページを1回テストする必要があります。
• i-frameまたはweb-viewでページを開くのに十分進んでいる場合、変換を厳密に監視すると、iframeの導入から成長が伸びない場合があります。
• 取得サービスが必要とするフィールドのリストを注意深く読んでください。カード支払いのみを行う必要があります（他のすべてまたはレガシー、または顧客に関する情報を収集する）。
• 本当に必要-カード番号（執筆時点では、記事はすでに変更されている可能性がありますが、新しいカードの導入により、フィールドは4 + 4 + 4 + 4-7文字でした-銀行はそのような変更をあまりよく通知しません）;
• 本当に必要-有効期限（ドキュメントを注意深く参照してください。クライアントにとってできるだけシンプルに構成する必要があります）;
• 本当に必要-セキュリティコード（CVV / CVC 3〜5文字）;
• 有効になっている場合、支払いサービス自体がフレームを開き、3DSのページにリダイレクトします。

3DSシャットダウン



一般的に推奨されない理由：





フォームの「フェード」時間の追跡に関連する、もう1つの非常に微妙で重要なポイントがあります。





tinkoff bankのほぼ完璧なUXの例。 ここでCVVコードの「ドラム」が必要な理由（それが激怒する）を完全には理解していません-おそらくそのような詐欺から保護するためです。









念のため、リンクを再度提供します。

1. モックアップとテストログ（ビデオ）を使用して、Googleディスク上のフォルダーにリンクします 。
2. 以下に説明するHTMLのすべての支払いページを使用して、Googleディスク上のアーカイブにリンクします（各アクワイアラーのスクリプトの設定には問題がありますが、すべてをブラウザーまたは最も単純なWebサーバーで開く必要があります）。

この間ずっとコンバージョンを増やし、入札単価を下げることに成功し、真の関心を示しました

コンバージョンファネル全体を実際に追跡するのは非常に難しいため、数字は指標です。 ただし、支払いの請求書の割合が支払われているかどうかは簡単にわかります。



この表を読むときは、パーセンテージとパーセンテージポイントの違いに注意してください。 コンバージョンが50％で、55％になった場合、5パーセントポイント変化しました。

使用済みの支払いページ	観測された支払いゲートウェイ変換の推定値
1.メール+アルファバンクウェブサイトへのリンク	〜50％+私たちの側には多くの問題がありました
2. RBS Webサイト（Sberbankからのホワイトラベル）およびセキュリティのためのメールへのリダイレクト	〜60％-65％（10-15パーセントポイント増加）
3.新しい支払いページを使用して、RBS Webサイト（Sberbankのホワイトラベル）にリダイレクトします	〜65％-70％（さらに5パーセントポイント上昇）
4.支払いページの最終バージョンを使用して、RBS Webサイト（Sberbankのホワイトラベル）にリダイレクトします	〜75％（さらに5〜10 pp上昇）
5.支払いページの最終バージョンを使用して、Uniteller Webサイト（Sberbankのホワイトラベル）にリダイレクトします	〜70％-コンバージョンはSberbank + RBSよりも低い
6.ポイント5 + HTTPSなしでiframeを開く	〜70％（ポイント5に対してマイナス5 pp）
7.ポイント5 + HTTPSでiframeを開く	テストする時間がない
8.モバイルプラットフォームのWebビューで開く	デスクトップとほぼ同じ

ABテストの結果として特定した主な影響要因（条件付き）：

1. 少ないフィールドとノイズ-より良い。 各フィールドからコンバージョンまで5ppを差し引いたものを考えます。
2. クライアントの注意を引く各ブロックは、マイナス5pp変換です。
3. ビジネスと論理的に関連していない各ロゴ、画像、または碑文は、コンバージョンに対してマイナス5〜10 ppです。
4. 技術の進歩は必要かつ重要ですが、 クライアントがそのような技術またはあなたのブランドを信頼する場合のみです。

理論的には、まだバッジ、錠、その他の道具があります-しかし、最初に技術的な問題を解決する必要があるため、テストする時間がありませんでした。

銀行および決済ソリューションとの交渉の特徴、およびチャージバックに打ち勝つ方法

この分野での詐欺師についての一言

国が不況になった今、私は詐欺サイト、広告、お誘いの認識のファイアウォールにもかかわらず、私は彼らに遭遇し始めたようなレベルに詐欺師が激化していることに気づき始めました。