【事例解説】ECサイトのギフト対応でUI・UXを最適化させるポイント

ECサイトにおけるギフト対応は、シーズンイベントでのギフト需要を取り込めるだけでなく、顧客単価向上やリピーター獲得など売上を上げていくための重要な施策です。

ギフトの購入者は、自分のためではなく大事な相手のために商品を購入するため、

☑︎ マナーに合ったのしやラッピングやメッセージカードを付けたい
☑︎ 商品選びの早い段階で希望の日に間に合うか知りたい
☑︎ 正確に配送日時を指定したい
☑︎ 相手の住所が分からないけど贈りたい
☑︎ 複数の送り先をスムーズに指定したい

などギフト特有の要望が多く、それらに応じたUIを用意する必要があります。

しかし多くのECサイトではギフト対応のUI・UXを最適化できていないため、様々な要因でユーザーの購買意欲を下げてしまっています。

本記事ではギフト専用ECカート「 aiship 」において、2000社以上のECサイトを構築支援してきた知見から、ECサイトでギフト対応のUI・UXを最適化するためのポイントを詳しく解説します。

ギフトUXを改善し、売上向上につなげるための参考にしていただければと思います。

目次

1. ギフト対応のUI・UXで課題となるポイントと解決策
2. ギフトオプションの表示
3. 贈られる状態がイメージできる商品画像
4. 配送可能日時の算出精度と明示
5. 相手の住所を知らない場合でも贈れる仕組み
6. 複数配送の注文フロー
7. まとめ

ギフト購入は、通常のEC購入とは異なるプロセスを伴います。そのため、ECサイトの設計がギフト向けに最適化されていないと、購入者がストレスや不安を感じ、離脱してしまう可能性が高くなります。

ここでは、ECサイトをギフト対応する際に直面しやすいUI・UXの課題と解決策をご紹介します。

ギフトオプションの表示

ギフト購入者の多くは、贈る相手により喜んでもらえるよう、のしやラッピング、メッセージカードの追加を希望しています。

しかし、ギフトオプションの表示が分かりづらいECサイトでは、オプションがあることを見逃し、離脱してしまうことになります。

▼ 具体的なUI・UXの課題と解決策

課題1
商品詳細ページでギフト向きの商品か判断がつきづらく、離脱されてしまう

ギフト目的の購入者は、商品詳細ページでギフト向きの商品だと認識できないと、気に入った商品があったとしても、ギフトとして贈ることができないと判断して検討から外されてしまいます。

＜こんな対応になっていませんか？＞
・商品詳細ページでギフト対応ができることを記載していない
・フッターなどページの後半に記載している

上記では、商品ページの上部にはギフトオプションに関する記載はないため、多くのギフト購入者はカートに入れるのを躊躇ってしまうと考えられます。


ページ下部のフッターに「送料・ギフト対応」という項目がありますが、最下部までスクロールしないと辿り着けないため認識しづらく、詳細を確認するためにはさらにそこから「ご利用ガイド」に遷移しないといけないため一定割合は離脱されてしまっていると考えられます。

課題1の解決策
商品詳細ページの段階で「ギフトオプション」の存在を明示する

安心してカートインしてもらうためには、商品詳細ページの段階で「ギフトオプション」についてある程度詳しく記載しておく必要があります。

※ただしギフトオプションの選択まで商品詳細ページで行うようにすると、ユーザーに追加で複数の操作が発生しカートイン率が下がる傾向があるため、選択自体はカートページで行えるようにしておくことをおすすめします。

＜参考にしたい事例＞

お米のギフトECサイト「 八代目儀兵衛 」では、商品情報として「ギフトオプション」について詳しく記載があるため安心してカートインすることができます。

課題2
意図しない贈り方にならないか不安で離脱されてしまう

特にミスをしたくないギフト注文において、オプション選択のUIが煩雑だと、購入者は贈る状態をイメージしづらいだけでなく、意図しない贈り方にならないかや、マナーに沿った贈り方ができるかが不安になり購入をやめてしまう傾向があります。

＜こんな対応になっていませんか？＞
・のしやラッピングを「なし」or「あり」の2択のみの提示
・要望を備考欄に記載してもらう

上記では、のしや手提げ袋はカートページの備考欄に記入して注文する形をとっています。

表書きや水引の色、名入れの詳細を自らテキストで入力する必要があるため、贈る状態をイメージしづらいだけでなく、入力した内容が適切に伝わるかや、間違った贈り方になっていないか不安になるユーザーも多いと推測されます。

課題3
梱包含め最終的にどんな状態で届くのかわからず、離脱されてしまう

サイト内でのしやラッピング、メッセージを含めどんな状態で届くのかをイメージしづらいと購入を躊躇ってしまう傾向があります。

また購入者がギフトマナーに詳しくない場合、大事な贈り物で選択ミスを招いてしまう可能性もあります。

＜こんな対応になっていませんか？＞
・テキストの選択肢からプルダウンで選択してもらう
・例文等の提示もなくテキストボックスにメッセージを入力してもらう

以前の「八代目儀兵衛」のサイトでは、商品詳細ページでのし（ギフトオプション）を選択できるようになっていました。テキストのみの選択肢から選ぶ必要があるため、贈られる状態をイメージしづらいと言えます。
（2022年にサイトリニューアルを実施されて現在は改善されています）


上記のように別のエリアにデザイン例を表示して、選択肢に割り振ったアルファベットや番号でデザインを選択させるUIもよく見られますが、画面を行ったり来たりする必要があり、特にスマホユーザーにとっては負担が大きく離脱の要因になります。

課題2,3の解決策
ギフトオプションの内容を視覚的に伝えるUIを設計

「のし/ラッピングの選択肢」や「メッセージカードのプレビュー」を画像付きで表示し、そのまま選択できるようにしておくことで視覚的かつ別のエリアを参照する必要もなくなるため離脱を最小限に抑えることができます。

＜参考にしたい事例＞

リニューアル後の「 八代目儀兵衛 」のサイトでは、のしやメッセージカード、箱などの「ギフトオプション」についてイメージ付きでプレビューして選択することができます。

また目的に応じてギフトオプションを出し分けることもできるため、購入者はギフトマナーに詳しくなくてもマナーに沿って適切に選択できます。

課題2,3の解決策
オリジナルのメッセージカードを作成できるUIを設計

「のし/ECで注文する際に、贈り物にオリジナルのメッセージカードを付属して注文できるようになり、よりユーザー満足度の高いサイトを実現できます。

＜参考にしたい事例＞

お米のギフトECサイト「 八代目儀兵衛 」のサイトでは、デザイン・テキストの自由な選択、入力に加えて、任意の写真をアップロードすることで思い出になるようなカードをECサイト上で作成することができます。

このように、商品ページの段階でギフト対応の有無が分かるようにして、カートではギフトオプションを視覚的にイメージしやすいUIを採用することで、ユーザーは迷いなく購入を進められるため、満足度を高めることができます。

贈られる状態がイメージできる商品画像

ギフト購入を意図した商品の場合は渡す瞬間、開封した瞬間の体験を画像でイメージしてもらうことが重要です。

▼ 具体的なUI・UXの課題と解決策

課題4
人気商品でもギフト用途の注文率が低い

ギフトとしても売って行きたいのにギフト用途の注文率が低い場合、商品詳細ページの画像をギフト注文に最適化できていない可能性があります。

＜こんな対応になっていませんか？＞
・商品画像がパッケージの中身や商品単体のみ

課題4の解決策
ギフト購入を想定した商品の場合は包装状態の写真も用意する

「どういう状態で届くか」「どんな風に渡せるか」をイメージしてもらうために、包装、箱、手提げ袋など、手に渡ることを想像できる画像を充実させることが重要です。

＜参考にしたい事例＞

博多通りもんが有名な「 明月堂 」のECサイトでは、包装紙や手提げ袋の写真を用意して、相手に贈られる状態をイメージしやすいよう商品画像を充実させています。

課題5
「詰め合わせ商品」が他社と差別化できていないため注文が伸びない

上記の商品ページでは箱を開けた画像・パッケージ表面の画像のみになっており、個別の中身の詳細画像がないため、 商品の魅力が伝わりづらく他社商品と差別化がしづらいと考えられます。

課題5の解決策
箱やパッケージの画像も充実させた上で、内容物の商品の魅力が伝わる画像を複数掲載

詰め合わせの商品は、ギフト感を演出するために、外梱や包装から先に掲載して、後半に個別の内容や同梱物のイメージを掲載することで、ギフトで贈る状態をイメージしてから内容物自体の魅力を感じてもらえるため購入に繋がりやすくなります。

＜参考にしたい事例＞

京都北山の銘菓「 マールブランシュ 」のECサイトでは、箱やパッケージの画像も充実させた上で、後半に内容物の商品の全ての詳細画像を掲載しています。

配送可能日時の算出精度と明示

ギフトは誕生日や記念日など、特定の日に届けたいというニーズが強いため、緻密な配送可能日の算出と、わかりやすい場所での明示が重要です。

しかし、多くのECサイトでは、配送可能日時の算出や提示が不十分なため、購入者は本当にその日に届くのかと不安になり購入を躊躇ってしまいます。

▼ 具体的なUI・UXの課題と解決策

課題6
商品詳細ページで「希望日に届くか」を判断できず、カートページに入る前に離脱されてしまう

課題6の解決策
商品詳細ページの段階で「最短お届け可能日」を明確に表示し、不安を解消

ユーザーは「いつ届くのか？」という疑問や不安を持っていることが多いので、贈り物や、イベントごとに向けて購入を検討しているユーザーは特に、間に合うことが早い段階でわかっているとカートインしてくれる可能性が上がります。

＜参考にしたい事例＞

ケーキ、スイーツのお取り寄せサイト「 Cake.jp 」では、商品詳細ページで都道府県ごとに最短のお届け日を表示。

また目的の日に間に合わない方に向けて、最短翌日届く商品のカテゴリページに誘導して離脱を抑制しています。

課題7
希望する日時に届くか確信が持てず、カートページまでいっても注文をやめられてしまう

課題8
希望日の六曜を調べるため、一旦サイトから離脱されてしまう

課題7,8の解決策
配送リードタイムに基づいた正確な配送日時表示・六曜併記

都道府県ごとの配送リードタイムや六曜を考慮し正確な配送日時の指定を可能にする。

＜参考にしたい事例＞

京都北山の銘菓「 マールブランシュ 」では、お客様が入力したお届け先の郵便番号からヤマト運輸サービスレベル（お届け可能日時）を自動で算出し、適切な｢お届け希望日｣を六曜と合わせてお客様の選択肢に表示しています。

相手の住所を知らない場合でも贈れる仕組み

ギフトを購入する際、受取人の住所を知らないという問題が発生しやすいにもかかわらず、多くのECサイトでは「配送先住所の入力」を購入者に強制しています。

▼ 具体的なUI・UXの課題と解決策

課題9
住所を知らない場合はギフトを贈れないと判断され、検討の選択肢から外されてしまう

課題9の解決策
eギフト（受取人が自ら配送先住所を入力できる機能）を導入

住所が不明でも贈れるeギフトを導入することで、SNSのみで繋がる友人が多い若年層や、住所を知らない相手から突然のギフトでサプライズ感を求める客層等、新規客層獲得が期待できます。

またeギフトの利便性を体感した消費者のリピーター獲得も期待できます。

＜参考にしたい事例＞


出産内祝い用の商品を取り扱う「 GiftBaton 」のECサイトでは、購入者はカートページで「配送」か「ソーシャルギフト（eギフト）」かを選択して贈ることができます。

住所が不明の場合、eギフトを選択することで購入者は住所の入力は不要。受取人が自ら配送先住所を指定して受け取ることができます。

課題9の解決策
デジタルギフトカードや電子チケットを発行し、住所不要で贈れる仕組みを提供

＜参考にしたい事例＞

高級本革製品を取り扱う「 BONAVENTURA 」のサイトでは、購入後にデジタルギフトカードが発行されるため、住所を知らなくてもLINEやメールでギフトを贈ることができます。

このような仕組みを取り入れることで、相手の住所を知らないユーザーの離脱を防ぐことができます。

複数配送の注文フロー

中元、歳暮、内祝いを始めとして1度の注文でお届け先が複数になるのもギフト注文の特徴です。

▼ 具体的なUI・UXの課題と解決策

課題10
多くの情報を入力・選択する際に迷ってしまい、離脱されてしまう

課題10の解決策
お届け先単位で紐付けを完結できる注文フロー

スマホでの操作でも迷わないよう「1画面に対し1件のお届け先指定」のように操作手順を複数ページに分割し1つ1つの操作を完結させやすく、注文まで行き着きやすいカートフローを設計することが重要です。

＜参考にしたい事例＞

京都北山の銘菓「 マールブランシュ 」では、お届け先単位で「商品の数量」と「ギフトオプション」「お届け希望日」を指定できます。

お届け先単位で必要事項の指定を完了できることで、操作の煩雑さを軽減し、迷いにくいカートフローを実現しています。

課題11
1回の注文で大量に配送先を指定する場合、まとまった時間がないとなかなか注文完了まで行き着けずに離脱されてしまう

課題11の解決策
注文情報の入力内容を途中で一時保存できるようにする

入力内容を途中で保存し、保存したところから注文を再開できるようにしておくことで、時間の関係で注文完了まで行き着けないことによる離脱を防止することができます。

＜参考にしたい事例＞

お米のギフトECサイト「 八代目儀兵衛 」では、カート内にて「注文を一時保存する」を選択し、入力した内容を途中で保存できます。また時間を空けて途中から再開をすることができます。

このように、複雑な注文でもユーザーが迷わずギフト購入を完了できるUI設計を心がけることが重要です。

ギフト購入のUXを向上させるためには、以下のポイントを押さえることが重要です。

☑︎ 商品詳細ページでギフトオプション対応があることを明示する

☑︎ 「どういう状態で届くか」をイメージできる画像を充実させる

☑︎ カートページでプレビュー付きでオプションを選択できるようにする

☑︎ 商品詳細ページで配送可能日を明示する

☑︎ eギフトなど住所が分からなくてもギフトを贈れる仕組みを導入する

☑︎ 複数配送のギフト注文フローをできるだけシンプルにする

☑︎ 入力する内容が多い注文では、途中で一時保存して、再開できるようにする

ギフト専用クラウド型ECカート「 aiship 」では今回紹介したポイントを全て押さえてECサイトを構築することができます。

また今回ご紹介したUI改善を実現するための機能は全て標準機能として搭載しているため、追加の開発費用も不要で、月額9,800円〜と安価に導入して改善することができます。

現状のECサイトでの課題のヒアリングから、改善案のご提案、導入・運用サポートまで一貫して実施しておりますので、ギフト購入のUI改善をご検討の際は、ぜひ1度お問い合わせください。