ECサイト構築のAtoZ全28回

0 0/28 28

Lesson6 デザイン編

16ECサイトのデザインに必要なコンセプトとUI/UX未学習

ここで学ぶ概要

この講座は約6分で読めます


「ECサイトを作りたいけど、どんなデザインにすればよいかわからない」
と思っている方。

ECサイトをデザインするには、お客様に商品の魅力をわかりやすく伝え、売上につなげる意識が大切です。

とはいえ、どのように商品の魅力を伝えていけばよいのか、具体的なイメージはつきにくいですよね。

そこでこの記事では、デザインにとって重要な、

  • CIをどのように決めるか
  • UI/UXの関係性の理解

についてお伝えします。

「デザインのことはまったくわからない」という方もいるかもしれませんが、必要なポイントを押さえれば難しくありません。
まずはこの記事で、ECサイトのデザインに必要なコンセプトとUI/UXについて知っていきましょう!

CI設定とは、自社コンセプトに基づく3つの要素を明らかにすること

CIとは「コーポレート・アイデンティティー」の略で、自社コンセプトにそって統一したイメージをつくり、より良い会社をつくろうとする戦略です。

ECサイトをデザインするには、CI設定が欠かせません。

CIは、3つの要素を明らかにすることで設定できます。

3つの要素は、

  • MI(マインド・アイデンティティー):自社が大切にしている考え
  • BI(ビヘイビア・アイデンティティー):自社の特性、特徴
  • VI(ビジュアル・アイデンティティー):自社に対してどんなイメージを持ってほしいか

です。

特に、ECサイトを作るうえで重要なのは3つ目の「VI」です。

VIは主に、

  • ブランドマークやロゴのデザイン
  • ブランドカラー

などへ反映されます。

ECサイトは、「見た目」によってほとんどのことが判断されてしまいます。

ゆえに「自社に対して持ってほしいイメージ」を実現するためには、見た目に関わる「VI」の要素が重要なのです。

ECサイトをデザインするときは、自社コンセプトに基づいてVIを明らかにするようにしましょう。

トピックまとめ:CI設定は自社コンセプトに基づく「MI」「BI」「VI」で決まる

CIを設定するには、自社コンセプトに基づいた、

  • MI(マインド・アイデンティティー):自社が大切にしている考え
  • BI(ビヘイビア・アイデンティティー):自社の特性、特徴
  • VI(ビジュアル・アイデンティティー):自社に対してどんなイメージを持ってほしいか

の3つの要素を明らかにする必要がありました。

ECサイトを構築する際は自社のコンセプトに基づき、「MI」「BI」「VI」を明らかにしておくことで、適切なCI設定ができます。

〈ここをチェック!〉ECサイトのデザインは、特に「VI」が重要

CI設定を行うときに必要な3つの要素のうち、ECサイトのデザインにおいて重要なのは「VI」とお伝えしました。
VIとはビジュアル・アイデンティティーの略で、「自社に対してどんなイメージを持ってほしいか」を明らかにする要素です。

VIで設定した、

  • ブランドマークやロゴのデザイン
  • ブランドカラー

に基づいて、ECサイトのデザインを考えるようにしましょう。

UI/UXの関係性を理解する

ECサイトを運営するうえで、売り上げに大きく影響する要素が

  • UI(ユーザーインターフェース):ユーザーが目にする部分、使用する部分
  • UX(ユーザーエクスペリエンス):ユーザーが商品やサービスを通じて得られる体験

という2つの要素です。

ECサイトにおいてUIは、

  • 表示されるデザイン
  • フォント
  • 商品の画像

などが該当します。

UIを高めるためには、すべてをユーザー目線で考え、

  • 見やすさ
  • わかりやすさ
  • 使いやすさ

の実現が必要です。

一方UXは、ECサイトにおいては、

  • ページデザインがわかりやすい
  • フォントが読みやすい
  • 商品が購入しやすい

などが該当します。

サービスを利用する一連の流れで「ユーザーが感じたこと全てがUXである」と考えましょう。企業にとっては、このUXをいかに高めていくかがポイントです。

トピックまとめ:UIは「ユーザーが目にする部分、使用する部分」、UXは「 ユーザーが商品やサービスを通じて得られる体験」

ここまでUIとUXについてお伝えしました。

UIとUXは、

  • UI(ユーザーインターフェース):ユーザーが目にする部分、使用する部分
  • UX(ユーザーエクスペリエンス):ユーザーが商品やサービスを通じて得られる体験

でしたね。

UIとUXはセットで語られることが多いため誤解を生みやすいのですが、決して「UIイコールUX」ではありません。

もちろんユーザーに対してより高いUXを与えるには、優れたUIが必要です。見づらく、わかりにくく、使いづらいECサイトでは、ユーザーはすぐに離れてしまいます。

〈ここをチェック!〉UIはUXを高める要素の1つ

ECサイトの売り上げを伸ばすためには、UIとUXを高めていく必要があることをお伝えしました。
しかし、UXに影響を与えるのはUIだけではありません。

例えば、

  • 商品が届くまでの早さ
  • 問い合わせたときの対応の良しあし
  • 商品そのもののクオリティ
なども、UXに影響を与えます。

あくまで「UIはUXを高める要素の1つ」であることを忘れないようにしましょう。
優れたUIはUXを高めることにつながり、高いUXは売り上げアップにつながります。

コンセプトに基づくCIを設定し、UI/UXを理解することで売り上げアップにつながる!

ここまで、CI設定のポイントと、UI/UXの概要についてお伝えしました。

CIを設定するには、自社コンセプトに基づく、

  • MI(マインド・アイデンティティー):自社が大切にしている考え
  • BI(ビヘイビア・アイデンティティー):自社の特性、特徴
  • VI(ビジュアル・アイデンティティー):自社に対してどんなイメージを持ってほしいか

の3つの要素を明らかにすることが必要です。

ECサイトデザインにおいては見た目が購買体験に大きく影響するため、特に「VI」が重要であることをお伝えしました。

そして、UI/UXの関係性は、

  • UI:ユーザーが目にする部分、使用する部分
  • UX:ユーザーが商品やサービスを通じて得られる体験

です。

ECサイトの売り上げを伸ばすためにはUIとUXを高めていく必要があり、まずはユーザー目線で作られたUIが大切であることをお伝えしました。

また、UXを高めるものはUI以外にもあり、あくまで「UIはUXを高める要素の1つ」であることを覚えておきたいところです。

これで、ECサイトのデザインに必要なコンセプトとUI/UXについて、理解が深まったと思います。

まずは、

  • MI(マインド・アイデンティティー):自社が大切にしている考え
  • BI(ビヘイビア・アイデンティティー):自社の特性、特徴
  • VI(ビジュアル・アイデンティティー):自社に対してどんなイメージを持ってほしいか

をはっきりさせて、CI設定を行うことから始めてみてください。

小テスト:CI設定に必要な3つの要素
では、最後にこの記事のトピックをつかむための小テストをします。
【問題】:CI設定に必要な3つの要素のうち、該当するものを1つ選びなさい。


【正解】2:VI
CI設定に必要な要素は、MI(自社が大切にしている考え)、BI(自社の特性、特徴)、VI(自社に対してどんなイメージを持ってほしいか)の3つでした。