apeescape2.com
  • メイン
  • Uiデザイン
  • 計画と予測
  • 財務プロセス
  • Webフロントエンド
Uxデザイン

購入への道を開く– eコマースUXのベストプラクティス

eコマースの売上は引き続き増加しています。モバイルデバイスはeコマーストラフィックの大部分を占めていますが、デスクトップサイトではカートの放棄率が低く、平均購入額が高くなっています。モバイルeコマースは未来ですが、デザイナーが現在の利益を最大化したい場合は、eコマースUXのベストプラクティスでデスクトップサイトを強化する必要があります。

可能性は驚異的です。 eコマースの収益は年々高くなっています。オフライン販売は依然として小売収益の大部分を占めていますが、eコマースの上昇傾向は否定できません。今年、米国のeコマース小売業者は 投影 売上高8400億ドルを達成するために、2022年まで到達するとは予想されていなかったレベルです。

eコマースは2020年の米国の全小売収益の21%を占めました。

ソース: デジタルコマース360



s corp vs. c corp

統計的な素晴らしさの中で渦巻いているのは、モバイルが支配的なeコマースの未来の宣言です。これには正当な理由があります。モバイルデバイスが最も多く生成します トラフィック および小売 収益 世界的に。 残念ながら、モバイルは2つの主要な指標を満たしていません。モバイルサイトは、デスクトップサイトよりもカートの放棄率が高く、平均購入額が低くなっています。

デスクトップeコマースサイトは、モバイルサイトよりもカートの放棄率が低くなっています。

ソース: 商人に精通している

eコマースの運命はモバイルですか?間違いなく。 eコマースUXのベストプラクティスを使用してデスクトップサイトを最適化することで、かなりのお金を稼ぐことができますか? 絶対に。

4ページのeコマースエクスペリエンス

デスクトップでは、ほぼすべてのeコマースサイトが同様のページシーケンスに依存して、買い物客を販売プロセスに集中させています。

  • 整頓された ホームページ 魅力的なバリュープロポジション
  • よく整理されている カテゴリページ ナビゲートしやすい
  • 洗練された 製品ページ 社会的証明と説得力のあるコンテンツを組み合わせたもの
  • 複雑ではない チェックアウトページ 進歩を示し、買い物客に安心感を与える

デスクトップeコマースUXのデザインパターンは、ホームページ、カテゴリページ、製品ページ、チェックアウトページの4つのメインページで構成されています。

デスクトップeコマースサイトで最も一般的な4つのページは、ホームページ、カテゴリページ、製品ページ、およびチェックアウトページです。 (( ジュディ )

各ページのレイアウト、コンテンツ、ナビゲーションは、買い物客が探している情報を見つけやすくすると同時に、購入をさらに近づけるために存在します。シームレスなeコマースを作成するには、4つのページすべてが連携して機能する必要があります 経験 買い物客が望む。それはすべてホームページから始まります。

整頓されたホームページ

1.製品の価値を即座に明らかにする

ホームページは第一印象です。 買い物客は、商品の価値をすばやく確認できなければなりません。 ホームページを使用して、技術的な機能についてドローンを使用しないでください。買い物客が製品がどのように問題を解決し、生活を改善するかを想像するのを助けます( やるべき仕事 フレームワークは有用な出発点です)。

コピーライティングは短く、要領を得てください。製品の利点を説明する写真を使用してください。買い物客が価値を理解するために、たくさん読んだり、たくさんスクロールしたり、長々とした説明ビデオを見たりする必要がある場合、価値はすぐにはわかりません。

テキストと画像は、価値提案を明確にする必要があります。

eコマースのホームページでは、テキストと画像で価値提案をすぐに明らかにする必要があります。 (( マイロ )

2.どこからでも検索を有効にする

少数の商品しか販売していないeコマースサイトでは検索バーは必要ないかもしれませんが、商品が増えるにつれて、検索は顧客が自分の商品に応じて商品を見つけるための不可欠な方法になります。 メンタルモデル 。スティッキー検索バーは、検索がすべてのページのどこでも利用できることを保証しますが、 チェックアウトページから検索を削除することをお勧めします 改心のために。

複数の製品カテゴリを持つeコマースサイトにスティッキー検索バーを含めます。

複数の商品カテゴリを持つサイトには、買い物客が探しているものをすばやく見つけることができるように、粘着性のある検索バーを含めることをお勧めします。 (( ネイティブユニオン )

3.買い物客にわかりやすい名前を製品に付ける

内部的に意味のある製品名は、買い物客を困惑させる可能性があります。意思決定のコンテキストを提供します。 モデル番号または基盤となるテクノロジーに基づく名前は、素人を遠ざけるリスクがあります。 可愛すぎるタイトルやクリエイティブなタイトルについても同じことが言えます。買い物客の視点から実用性または価値を示す製品名を選択します。

買い物客にとって意味のあるeコマース商品名を書いてください。

バッカ ノートパソコンや楽器用の木製スタンドを作ります。その製品名はシンプルですが、その使用目的を示しています。

4.お得な情報とプロモーションを強調する

買い物客は特定の製品を念頭に置いてeコマースサイトにアクセスします。 取引やプロモーションがホームページに溶け込むと、見過ごされてしまいます。 明るい色、太字のテキスト、全ページの写真を扱っています。

販売が二次的に重要である場合、それは目立つはずですが、ホームページの主要な価値提案と競合してはなりません。プロモーションが買い物客が知っておく必要のある一番のことである場合は、それにスポットライトを当ててください。

売上と取引はeコマースのホームページで目立つはずです。

eコマースのホームページでは、販売、取引、プロモーションを目立たせる必要があります。 (( パッケージ無料 )

よく整理されたカテゴリページ

1.グリッドで製品を提示する

デスクトップ画面によって提供されるスペースは、製品グリッドに最適です。グリッドは Fパターン スキャンして、買い物客が複数の製品をすばやく比較できるようにします。写真で説明しやすいアイテムに特に効果的です。 グリッドのメリットを最大化するには、1行あたりのアイテム数を2〜4に保つようにしてください。 5つ以上の製品では、グリッドが大幅になります もっと強く スキャンします。

ボーナス: リストビューは機能しますが、より詳細な説明が必要な製品に最適です。

最高のeコマースユーザーエクスペリエンスを実現するには、デスクトップサイトのグリッドビューに製品を配置します。

デスクトップサイトでは、買い物客はリストではなくグリッドに配置された商品を閲覧することを好みます。 (( Wayfair )

2.簡単なナビゲーションを確保する

ナビゲーションは直感的である必要があります。 買い物客は、カテゴリページを切り替えたり、商品フィルタを有効にしたりするのに苦労しないでください。 1つのカテゴリに多数の商品があるサイトでは、左列のナビゲーションを使用して、買い物客がさまざまな属性に従って商品を並べ替えることができるようにする必要があります(ファセット検索)。

最適なeコマースエクスペリエンスを実現するには、カテゴリページのナビゲーションが直感的で整理されている必要があります。

カテゴリページのナビゲーションは、直感的で、整理され、使いやすいものでなければなりません。 (( 真のリンクウェア )

3.ベストセラーを紹介する

ベストセラーアイテムに固有のアイコンを付けるか、ベストセラーセクションに配置します。どうして?ベストセラーは社会的証明の一形態です。 人々が不確かなときは、他の人の行動に目を向けて自分自身を決定します。 これは特に新しい買い物客に当てはまります。

同様の原則が最近発売された製品にも当てはまります。新しく改良されたアイテムを紹介することは、単なる1回限りの販売戦術ではありません。これは、買い物客が将来の更新に戻るように誘う方法です。

eコマースの商品ページで買い物客のベストセラーと新着商品を表示します。

グレートジョーンズ ベストセラーにオーブンミットを付けることで、家庭的なブランドの個性を維持しています。

洗練された製品ページ

1.社会的証明で誘惑する

社会的証明は浸透します 信頼 買い物客に。評価とレビューは購入の決定に大きな影響を与えますが、デスクトップサイトは、他の形式の社会的証明も処理するのに十分な広さです。

  • お客様が撮影した商品写真
  • 有名人とインフルエンサーの推薦
  • 専門家からの引用
  • 独立したレビューサイトからの承認バッジ

社会的証明の目標は、買い物客が他の人の前向きな体験と一致する情報に基づいた意思決定を行っているように感じられるようにすることです。

社会的証明は説得力のあるeコマース販売戦術です。

評価、レビュー、顧客の写真は強力な動機です。 (( Etsy )

2.コピーと画像を使用して良い生活を示す

eコマースのコンテンツは有益である必要がありますが、事実や機能リストよりも説得力があります。 テキストと画像を使用して、買い物客がチェックアウト後に彼らを待っている良い生活を想像できるようにします。

UXの情報アーキテクチャとは

ここでも、デスクトップサイズが利点です。巨大な写真やビデオを使用したり、さまざまな角度から製品を表示したりしない理由はありません。同じことがコピーにも当てはまります。ヘッダーを巨大にし、テキストブロックを十分な量の空白で囲むことを躊躇しないでください。

eコマースUXのベストプラクティス:製品ページのコピーと画像が価値を明らかにする必要があります。

のテキストと画像 Allbirds ’ 商品ページは、買い物客が理想的な未来を想像するのに役立ちます。

3.アップセルと関連製品でより多くを稼ぐ

買い物客が商品ページに表示される内容に満足できない場合は、他のオプションを見つけるためにカテゴリページに戻る必要はありません。代わりに、同様の価格で代替製品を提示するか、より優れた機能、レビュー、またはブランド認知度を備えたより高価なオプションを提示します。

商品ページを補完する関連アイテムを提案することもできます。靴を買う?靴ひもとアーチサポートも手に入れてみませんか? 摩擦を減らすために、関連アイテムに「カートに追加」オプションがあることを確認してください。

アップセルとクロスセルを含めることで、eコマース製品ページでより多くの収益を獲得できます。

アマゾン のデスクトップインターフェースには、アップセル、クロスセル、衝動買いの機会がたくさんあります。

4.大きくて大胆な「カートに追加」ボタンをデザインする

商品ページに関しては、「カートに追加」ボタンを目立たせる必要があります。 それらを大きく、高コントラストで、クリックしやすいものにします。 機知に富み、行動を促すフレーズを明確で行動指向のテキストで書きたいという衝動に抵抗してください。

買い物客は、ショッピングカートに商品を追加するときに、視覚的なフィードバックを受け取る必要があります。多くのデスクトップサイトは、画面の横から瞬間的にスライドするカートサマリーオーバーレイを使用してこれを行います(買い物客がチェックアウトに移行したり、ブラウジングを続けたりできるようにする創造的な方法)。

ザ・

見つけてクリックしやすい「カートに追加」ボタンをデザインします。 (( キン陶酔 )

簡単なチェックアウトページ

1.買い物客のチェックアウトの進捗状況を表示する

eコマースの買い物客はオンラインで商品を探すのに多くの時間とエネルギーを費やしています。 購入する準備ができたら、プロセスの終わりが見えているという安心感が必要です。 プログレスバーは、チェックアウトの各段階で買い物客がどこにいるかを示す簡単な方法です。

最高のチェックアウトUXを実現するために、チェックアウトプログレスバーは買い物客にフィニッシュラインにどれだけ近いかを知らせます。

チェックアウトプログレスバーは、買い物客が販売ファネルの終わりに光を見るのに役立ちます。 (( 桑 )

2.複数の支払い方法を受け入れる

利便性とセキュリティは、買い物客が支払いゲートウェイに到達する際の主な懸念事項であり、カートを放棄する最大の理由の2つです。 幸いなことに、オンラインの数は増え続けています 支払いオプション セキュリティ上の懸念を軽減し、チェックアウトを促進します。 信頼できる会社(AmazonやAppleなど)が支援するサードパーティの支払いオプションは、クレジットカード情報を入力するよりも買い物客にとって魅力的かもしれません。

次のような「今すぐ購入、後で支払う」(BNPL)オプションも検討する価値があります。 ペイパルクレジット そして クラルナ 。 BNPLは、顧客が商品を受け取った後、時間をかけて商品の代金を支払うことを可能にするPOSクレジットの形式です。

動作するハッキングされたクレジットカード番号

eコマースのチェックアウトを簡単にするために複数の支払いフォームを受け入れます。

eコマースサイトは、クレジットカード以外の支払いフォームを受け入れることで、買い物を容易にし、知覚されるセキュリティレベルを高めます。 (( アステカサッカー )

3.ゲストチェックアウトを検討する

ゲストチェックアウトは、すべてのeコマース小売業者、特に顧客アカウントの生成を中心としたビジネス戦略を持つ小売業者にとって適切ではない場合があります。 ただし、チェックアウトを加速し、アカウント作成の疲労を防ぎ、 カートの放棄を減らす 。

別の方法は、注文確認のために電子メールを要求し、その後、配送および配送メッセージの取引をフォローアップすることです。

最高のチェックアウトUXを実現するには、ゲストチェックアウトを提供してカートの放棄を減らします。

2つのチンパンジー はコーヒーのサブスクリプションサービスですが、買い物客は1人でゲストを購入できます。

4.明確な注文概要を提供する

これは必須です。 買い物客に次のような簡潔な注文の概要を提供します。

  • 製品の詳細と数量
  • すべての料金の内訳
  • 配送および請求情報

商品の写真を表示するのも賢明ですが、属性が顧客の選択(色、サイズ、仕上げなど)と一致していることを確認してください。

優れたeコマースユーザーエクスペリエンスを確保するには、注文の概要が必須です。

注文の概要は、eコマースのチェックアウトプロセスの必須部分です。 (( Vipp )

5.セキュリティバッジとカスタマーサポートで信頼を高める

表示して買い物客に自信を与える セキュリティバッジ およびサードパーティの承認。 チェックアウトは、確認済みのランキングとレビューを買い物客に思い出させるのに最適な場所です。

近くには、チャットボット、返品ポリシー、FAQへのリンク、カスタマーサポートラインなどのサポート機能が含まれています。買い物客はチェックアウト時にこれらのリソースを使用することはできませんが、それらが存在することを知っているので安心できます。

セキュリティバッジと確認済みのレビューにより、買い物客の信頼が高まります。

セキュリティバッジの表示に加えて、 Physiqアパレル サイトには何千もの肯定的なレビューがあることを買い物客に思い出させることで、信頼を強化します。

eコマースUXのベストプラクティスを遵守する

ショッピングは触覚です。オブジェクトの重さ、角度とエッジ、フィット感と感触-これらは重要です。存在感がない場合は、親しみやすさとディスプレイサイズが非常に重要です。デスクトップは両方を提供します。 これは、画面が広く、ナビゲーションが簡単で、画像や動画がより現実に近い快適なパラダイムです。

その欠点にもかかわらず、モバイル小売は比較的新しい分野です。解きほぐすためのねじれがありますが、それはオンラインショッピングの未来のままです。それまで、 デザイナー eコマースUXのベストプラクティスを使用してデスクトップサイトを最適化することにより、現在から利益を得るのが賢明です。


ご意見をお聞かせください。以下にあなたの考え、コメント、フィードバックを残してください。

•••

ApeeScapeデザインブログの詳細:

  • eコマースUX–ベストプラクティスの概要(インフォグラフィック付き)
  • eコマースウェブサイトデザインの究極のガイド
  • eコマース101:ショッピングカートの放棄を理解する(インフォグラフィック付き)
  • eコマースUX–基本的な設計戦略と原則
  • 著名なeコマースのトレンドとそのデザインへの影響(インフォグラフィック付き)

基本を理解する

eコマースWebサイトはどのようにユーザーエクスペリエンスを向上させることができますか?

Webサイトは、ホーム、カテゴリ、製品、およびチェックアウトページを最適化することにより、eコマースUXを向上させることができます。 eコマースUXのベストプラクティスは信頼を築き、買い物客が情報に基づいた意思決定を行うのに役立ちます。たとえば、画像グリッドはカテゴリページのリストよりもうまく機能し、ほとんどの買い物客は注文の概要がないとチェックアウトを完了できません。

UXのベストプラクティスは何ですか?

UXデザインは、ユーザー中心のデザインアプローチに基づいています。ユーザー中心設計は、ユーザーが目標を達成するのに役立つ一連の設計方法とベストプラクティスに基づいています。最終的に、これらの方法により、設計者はユーザーの期待に沿った直感的なエクスペリエンスを作成できます。

eコマースのUXとは何ですか?

eコマースのユーザーエクスペリエンスは、製品をオンラインで販売するサイト向けに設計されています。成功したeコマースUXデザインは、直感的なショッピングエクスペリエンスを提供し、ベストプラクティスを採用し、競合他社よりもビジネスに優位性をもたらし、ブランドのリーチと魅力を拡大します。

何が良いeコマース体験を作るのですか?

高品質のeコマースエクスペリエンスには、直感的なレイアウト、説得力のあるコピーライティング、説明的なビジュアルなど、同様の属性があります。 eコマースページは、価値提案を明確にし、買い物客に楽な購入を行うために必要な情報とナビゲーションコンポーネントを提供する必要があります。

eコマースデザインとは何ですか?

eコマースの設計にはいくつかの側面があります。ブランド、ビジュアル、UI、コピーライティング、eコマースUXは連携して機能し、商品の価値を強調し、買い物客の購入意欲を高める必要があります。成功するeコマースサイトは反復的です。つまり、すべての設計要素が継続的に測定され、改善されます。

レスポンシブデザイン–ベストプラクティスと考慮事項

モバイルデザイン

レスポンシブデザイン–ベストプラクティスと考慮事項
著名なデザイン会議2020

著名なデザイン会議2020

Uiデザイン

人気の投稿
Javaでのリモートフレームバッファサーバーの実装
Javaでのリモートフレームバッファサーバーの実装
ApeeScapeの迅速で実用的なCSSチートシート
ApeeScapeの迅速で実用的なCSSチートシート
ソフトウェアデプロイメントの強化-DockerSwarmチュートリアル
ソフトウェアデプロイメントの強化-DockerSwarmチュートリアル
エクイティクラウドファンディングの次は?
エクイティクラウドファンディングの次は?
AngularJSからReactに切り替えた理由
AngularJSからReactに切り替えた理由
 
パーム油への投資家向けガイド
パーム油への投資家向けガイド
RADフレームワークのエンジニアリング内部... NookuのPHP開発者として
RADフレームワークのエンジニアリング内部... NookuのPHP開発者として
Ro-Luを見る:ユーザビリティのケーススタディ
Ro-Luを見る:ユーザビリティのケーススタディ
ブラウザからウェブサイトのデザインプロセスにアプローチする
ブラウザからウェブサイトのデザインプロセスにアプローチする
意味のあるデザインと楽しいUXの芸術
意味のあるデザインと楽しいUXの芸術
人気の投稿
  • c corp vs s corp vs llc
  • dotnet social cloudapp net redir
  • ドキュメントへのアジャイルアプローチは
  • クレジットカード情報を検索する
  • scorpとcorpの違い
  • クラス属性とインスタンス属性python
  • 初心者向けのネイティブチュートリアルに反応する
カテゴリー
投資家と資金調達 ライフスタイル アジャイル 財務プロセス プロセスとツール プロジェクト管理 デザイナーライフ 技術 人とチーム 収益と成長

© 2021 | 全著作権所有

apeescape2.com