陰鬱な日々にさよなら!?ペット業界のUI・UXデザインを比較してみた🐶🐱
目次
ぐ~てんだ~、いかがお過ごしでしょうか
自粛生活が続いており陰鬱ムードが続きますね。そんな日々だからこそ、家庭内で寄り添ってくれるパートナーとしてペット市場が注目されてきています。
さて今回はそのようなペットショップのPCデザインを比較していきたいと思います。PCデザインを選択した理由としてはペットという長く付き合う関係性があるため、利便性よりも専門性(簡単に調べるよりも内容を深くみたい)が求められたり、他店舗との比較を行うのに都合がよく検索媒体としてスマホより利用される傾向が高いと考えられるからです。
また、見る画面は「初回訪問トップ画面のファーストビュー」「ペット検索画面」「問い合わせフォーム」を比較対象とします。
今回は以下のペットショップを対象とします。
ペットン(https://www.petton.co.jp/)
ひごペットフレンドリー(http://www.higopet.com/ )
【ペット領域】初回訪問トップ画面のファーストビューのUIUXデザインを比較してみた
【ペットンのファーストビュー】
【ひごペットのファーストビュー】
比べて見ていかがでしょうか?どちらもデザインが独自的ですね。
【共通点】
「ペットン」も「ひごペット」もどちらもスクロール形式で重要情報を流しています。動物の画像を提示することでユーザーにとってサイト情報が動物に関するものであると一目で分かるようにしています。また、動物の画像は心理的退行を促し、サイトに留まる時間を延ばすメリットがある傾向があります(利用するカスタマーの大抵は動物に対して好意的であり、サイト内の様々な動物を見ようとするため)。
【ペットン】
「ペット専門店No.1を目指して」というキャッチコピーから連想される心象は主に「努力してます」「向上心があります」というようなものがユーザーに与えられ少なくとも悪いイメージはつかないでしょう。しかしながらデザインとしては小さく見えずらいためもう少し主張していくべきではないかと考えられます(競合店との差異を作るアピールポイントである為)。スクロール先のデザインも同様。
次に上部にあるそれぞれのアクションボタンですが、単に文字だけを置いたボタンではなく、犬の肉球マークを導入することで動物属性を付与し、ユーザーの心理的負荷を低減します。しかしながら画像がスペースを多くとっているためか、ボタンが小さくなっています。なので画面比率を調整しボタンサイズを大きくすることでそれぞれのページへのアクセスを促進できるようにすることが課題であると考えられます。
【ひごペット】
画面スペースはペットンと比べるとコンパクトに収められていますね。
ファーストビュー内の多くの犬の画像を掲示することで扱ってるペットの多様性をアピールするのと同時にユーザーの所謂「ワクワク感」を与え、サイト内での停滞率が高まります。
次に上部にある「ホーム」「はじめての方へ」などのアクションボタンですが、ペットンと比べるとボタンの大きさは妥当ですね。また具体的なボタン(検索・店舗情報・)は同様として抽象的なボタン(はじめての方へ・サービス案内・安心へのこだわり)が導入されていますね。そのボタンが押されることがなくてもボタン自体が良し悪し含めてユーザーに心象を与えます。例えば、「安心へのこだわり」ボタンに関しては見るだけで店が安心面に関してこだわっていることが分かりますね。
「はじめての方へ」ボタンは初見ユーザーに対して向けて設定がされていますが、実際に押す人がどれほどいるのか・必要性が疑問です。ユーザーが求める情報の優先度を検討する必要性がありますね。
【ペット領域】検索エリア一覧画面のUIUXデザインを比較してみた
【ペットンの検索エリア】
ペットンでは情報のメリハリをはっきりとしており、文字を置いただけでなく動物のロゴデザインを導入することにより視覚的に分かりやすくなっています。背景も可愛らしいですね。また検索アクションは三回(種類・店舗・性別)のみで簡単に検索を行うことができます。(その他は二回)
【ひごペットの検索エリア】
「あなたのベストパートナーがきっと見つかる!」というキャッチコピーのもとに、検索アクションが多用であり細分化されているため、理想のペットに出会う可能性は高いです。こだわりが強い人にはオススメかもしれません。しかしながら検索にかかるアクションが多く、フォントも小さいため不便さが見られます。なのでフォントデザインを変更し、情報にメリハリをつける必要がありますね。また、動物のカテゴリー毎に色で分けていますが🐶🐈🐟などといった付加情報を与えることで視覚的に分かりやすくすると良いと考えられます。
【ペット領域】詳細画面のUIUXデザインを比較してみた
今回はファーストビュー及びペット検索画面を比較しました。それぞれのデザインに工夫されている面や少し改善したらもっと便利になりそうな面がありましたね。
字数的に少し長くなりましたので問い合わせフォーム編はこちらです。
https://cxbottle.com/users/idearahppy/hYnuPrXadYMMtvjaD4ky
【さらにCVR向上を検討している方へ】
【CX BOTTLE】を運営しているビーンズでは直帰率改善やLPOに使える具体的でCVRを改善する確度の高い施策を毎月提案する事業を行っています。
初回の打ち合わせでは無料でサンプルの提案を受けとれますので試しに利用してみてはいかがでしょうか。
関連記事も読む
-
EFOツールGyro-nとは?主な11の便利機能や導入するメリットも紹介
EFOとは? EFOとは「Entry Form Optimization」を略した言葉で、日本語では「入力フォーム最適化」と訳すことができます。EFOの目的は、Webサイトにある入力フォームを訪問者に対して最適化すること 続きを読むdejamブログ運営局 2022年05月11日投稿 -
sincloを導入する5つの効果|料金プランや充実した主な機能も紹介
sincloチャットボットツールとは sinclo(シンクロ)チャットボットツールとは、プログラミングなどの作業不要で導入できるチャットボット型のWeb接客ツールです。Webサイトに訪れたユーザーに対して、対面での接客の 続きを読むdejamブログ運営局 2021年11月09日投稿 -
Optimizelyとはどのようなツールか|ABテストの作成方法手順も
Optimizelyとはどのようなツールか Optimizelyとは、サイト最適化に有効であるABテストが簡単に実施できるツールです。これまでABテストでは多くの部署や人が必要でしたが、Optimizelyは特別なコーデ 続きを読むdejamブログ運営局 2021年11月09日投稿 -
formrunが持つ特徴や導入メリットは?使い方もあわせて解説
フォーム作成ツール「formrun」とは フォーム作成ツール「formrun」は、フォーム作成だけではなく、問い合わせ対応・状況の確認やメール対応まで、フォームに関わる業務をワンストップで管理できるツールです。 コードの 続きを読むdejamブログ運営局 2021年11月09日投稿 -
「BOTCHAN EFO」とは|利用料金や活用シーンについても紹介
EFOツール「BOTCHAN EFO」とは EFOとは、Entry Form Optimizationの略で、入力フォーム最適化を指します。Webサイト上での問い合わせに対して、ユーザーが個人情報などを入力しなければなら 続きを読むdejamブログ運営局 2021年11月09日投稿