メディアのUIとUXは切っても切れない関係、生活者思考のデザインが必要。

  • 更新 | 2018.03.15 公開
メディアのUIとUXは切っても切れない関係、生活者思考のデザインが必要。

オウンドメディアを始める上で、UI(ユーザーインターフェース)とUX(ユーザーエクスペリエンス)は切っても切れない関係です。

UIだけ、UXだけを良くしようとする考えは、あなたのオウンドメディアの成長を妨げ、生活者に嫌われてしまいます。

UIとUXを切り離さず考えられるよう別々に説明はせず、オウンドメディアのUI・UXをひとまとめにした私の考え方を、一緒に見えていければと思います。

※この記事は、管理人が仕事で制作・運用・改善をしているオウンドメディアの体験談を元に書いています。あなたが知っている知識とは別の事が書いてあるかもしれませんが、何卒ご容赦ください。

関連情報
こんなに早くなるの!?wordpressの速度改善で検索順位をあげる方法
ブログは「note」と「wordpress」のどっちを使えば稼げる?【比較表あり】
ブロガーになるために、noteと独自ブログどっちを使えばいい?
有料noteの「作り方と値付け」マニュアル【101人分の調査データ有り】

そもそも「UIとは?」「UXとは?」

UI(ユーザーインターフェース)・UX(ユーザーエクスペリエンス)と聞いても、名前も似ているし、どんな違いがあるのかが、分かりづらい方もいるかと思います。

まずはUIについて。

UIは、機械、特にコンピュータとその機械の利用者(通常は人間)の間での情報をやりとりするためのインタフェースである。
入力 – ユーザーがシステムを操作する手段。
出力 – ユーザーが操作した結果システムが生成したものを提示する手段

次はUXについて。

UXは、人工物(製品、システム、サービスなど)の利用を通じてユーザーが得る経験である。しばしば「UX」と略される。「ユーザー経験」「ユーザー体験」などと訳される。

それぞれwikipediaさんでは、このような説明が書いてあります。

ユーザーインターフェースとユーザーエクスペリエンス。

ユーザーは実際に利用する生活者のことを指していますが、インターフェースとエクスペリエンスは意味合いが違います。

インターフェース:生活者と機械や装置を繋ぐ接点。マウスやwebサイトのボタンなど。
エクスペリエンス:経験や体験など。

オウンドメディアにおけるユーザーインターフェースは、ボタンや入力フォームなど、webメディアとユーザーを繋ぐ部分全て。

オウンドメディアにおけるユーザーエクスペリエンスは、生活者がメディアを通して体験や経験できるもの全て。

これらの説明を見ると、オウンドメディアにおけるユーザーエクスペリエンスを向上させるには、生活者が体験や経験するもの全てに関わるものに気を配らないといけない事になるので、ユーザーインターフェースも当然含まれます。

ユーザーインターフェースとユーザーエクスペリエンスは、切っても切れない関係であることが、なんとなく見えてきたかな?と思います。

領域ごとでUIとUXの関係性が間違われやすい?

デザインの現場では「UIさえ良くすれば色々改善できるから、UI良くしてよ!」

マーケティングの現場では「今のUX良くないからさ、UX改善してくれない?」

「UI」「UX」という言葉は様々な現場やお客様との会話の中でも頻繁に出てきます。

この言葉を使うとカッコイイですからね…。

しかし、仕事領域が違うとUI・UXを別々に考えてしまう事が多く、どちらか一方だけに意識が注がれてしまい、本質を見失ってしまうことがよく起こります。

なぜこのような事が起るかというと、自分たちの仕事領域の範囲で「UI」「UX」を別物として関係性を考えないまま覚えてしまっているからです。

デザイン担当の人は見た目への意識が強いため「UIを良くすれば…」という考えになってしまいやすく、マーケティング担当の人は数値やCVに意識が強いため「UXを良くすれば…」という考えになってしまいがち。

それぞれ、自分の仕事領域でしかUI・UXを感じていないため、このようにどちらか一方だけを良くする動きが出てきてしまいます。

UI・UXも、生活者が感じる全てに対しての事なので、デザインやマーケティングなどの見た目で表しやすいものだけでなく、運営しているスタッフや会計などをしている経理までも、全てUXとして関係があるんです。

UIとUXの関係性は分かった。それからどうすればいいの?

UIとUXの関係が切っても切れない関係であることが分かったら、次はUIとUXを向上させるための考え方を知ることが大切です。

UIへの考え方

UIはインターフェース寄りな見方なので、見た目全般をどう考えるかが問われる部分です。

  • 大きさ
  • 長さ
  • 操作性
  • 情報の配置
  • 見た目の印象

まだまだありますが、これら見た目に関する部分は全てUIと言えます。

しかし、ただ単に見た目を変えたとしてもそれは、生活者のことを無視した独りよがりなUIとなってしまいます。

オウンドメディアの原則として、生活者の満足があって初めて、あなたが目的・目標としている成果という対価を生活者から受け取ることができます。

そのため、UIを考える際は、いかにして生活者の気持ちに応えられるかが重要です。

UIは生活者の顕在意識へ働く人間は一つの事に意識を向けると、他のことが目に入らなくなり、見たいものだけを見ようとします。
そのため、顕在意識という意識が働いている時に、UI上いくら見た目を派手にしたとしても、生活者は気づきません。
生活者が意識を向ける方向に、最適なUIを用意してあげることで、最大の効果を発揮できるようになります。

UXへの考え方

UXはあなたのオウンドメディアが、生活者へ提供する全ての体験・経験となります。

  • Googleなど検索フォームを利用して出てきたタイトルを見た時も体験、経験。
  • オウンドメディアの表示速度も体験、経験。
  • 使い心地も生活者の体験、経験。
  • 色や形などの見た目を感じるものも生活者の体験、経験。
  • 文章の内容や読みやすさも生活者の体験、経験。
  • 文章が生活者に与える印象も体験、経験。
  • javascriptやJqueryを使った動的な表示なども体験、経験。

まだまだありますが、生活者とあなたのオウンドメディアとの関わり合い一つ一つがUX。

文字の色にしても、誤字脱字など細かいことも全てがUXとなって生活者の中に体験・経験として溜まるため、UXを考えるということは、生活者とオウンドメディアが関わる全ての接点を考える・デザインするということです。

UXは生活者の潜在意識へ働く生活者は今まで体験・経験したものを潜在意識(無意識)へ大量にためています。
こういった体験・経験一つ一つが、あなたのオウンドメディアと出会った際に引き出されて、あなたのオウンドメディアの印象を作っていきます。
もし生活者が初めて訪れた際にUIが悪く使いづらかった場合、「初めまして、あなたは嫌いです」と生活者に言っているようなもので、あなたのオウンドメディアに対して悪い体験・経験が溜まっていきます。
他のページを見たとしても、その印象が生活者の中に残っているために、あなたのオウンドメディアの様々なものが悪い印象と結び付けられ、結果的にあなたのオウンドメディアへはもう来てくれなくなります。
UXは生活者の潜在意識の中にたくさん溜まっていき、それらが必要に応じて結びついたり引き出されることを、覚えてほしいです。

UIとUXをデザインするためには仕事領域ごとで考えていてはダメ?

UI・UXをデザインする時や、UI・UXの改善をもとめられた時、まずあなたは何から行おうとしますか?

領域詳細
デザイナーの場合自分なりに使いやすい使いづらい点を確認したり、競合や成功していそうなメディアのUIを研究する。
他にも格好いい日本・海外のデザインサイト集や、部分的なパーツのデザインが見れるサイトを見たり、見た目や印象の研究から入ろうとすることが多いと思います。
マーケッターの場合GoogleAnalyticsやサーチコンソール、その他ヒートマップやAdWorsなどなど色々なツールで得られた情報を元にUI・UXの改善をする。
集められた数値から客観的に考えることが多いと思います。
エンジニアの場合オウンドメディアの特性や構造を考えた上で導き出し、合理的且つ最適なシステム構造でUI・UXの改善を図ろうとすることが多いと思います。
個人の場合デザイン・マーケティング・システム構築など、1人で色々こなさないといけないので、そこまでUI・UX改善に時間がつかえないため、大手や人気のサイトのUIを真似たりする事が多いかもしれません。

このように、デザイナーは見た目・マーケッターはデータ・エンジニアは構造への意識が強いため、それぞれの領域でのUI・UXの考えに固執してしまいがちになります。

本当は、デザインもマーケティングもシステムも合わせて全てがUI・UXとなるため、関わる分野全ての人達の力を合わせなければいけません。

しかし、分野がことなる領域の人達が力を合わせるのは当然として、UI・UXの本質はそこではなく、生活者を中心とした考えを出せるかが重要。

UI・UXでは生活者の存在が非常に重要だとお伝えしてきましたが、なぜここまで生活者の存在が重要なのでしょうか。

次は、生活者の存在がUI・UXをにどれだけ影響するのかを見てみましょう。

UIとUXをデザインする前に、もう一度生活者の事を考えましょう

UIとUXをデザインするためには、生活者の存在が非常に重要です。

例えば、ターゲットとする生活者が70代以降の方だとして、現代風のボタンや小さい文字を使ってカッコイイUIを提供したらどうでしょうか。

文字も見づらいしボタンも押せない、生活者にとっては苦痛でしかないので、あなたのオウンドメディアは絶対に失敗します。

これは極端な例かもしれませんが、あなたがオウンドメディアに訪れる生活者の事を、知らないということはこういった間違いが起る、すでに起こっているという事でもあります。

UI・UXの間違いは、そのまま失敗を招く危険があることを、予め知っておいてほしいです。

先程は極端な例としてお伝えした間違いでしたが、どうすれば生活者に対して最適であり、目的・目標が達成できるUI・UXにできるのでしょうか。

生活者の事を考えてUI・UXが作れる思考を見つけるため、以下の情報を見てみましょう。

デザインと聞くと…。UI・UXのデザインと聞くと、デザインという言葉のイメージから、見た目に対して意識が集中してしまいがちですが、見た目も体験や経験も含めて、利用する生活者全ての行動がスムーズになるようにデザインしてあげるのが、UI・UXデザインだと考えています。

生活者の事を考えてオウンドメディアのUI・UXをデザイン

生活者のことを考えて、オウンドメディアのUI・UXをデザインしていくためには、以下の情報が必要となってきます。

  • キーワード
  • ペルソナ
  • カスタマージャーニーマップ
  • アクセス解析

「え、こんなの当たり前でしょ?」と思うかもしれませんが、これらの情報でどこまで生活者の事を深く理解できているかで、UI・UXの質が変わってきます。

この4つの情報それぞれが、あなたが生活者のことをリアルに感じ、気持ちを把握し、細かい行動の一つ一つを知るためのものとなります。

生活者のことを知るということは、生活者が何をしたいのか、行動の先読みもできるようになるため、UI・UXのデザインをするための重要な情報となります。

オウンドメディアを始める前

オウンドメディアを始める前のUI・UXに関しては、アクセス解析など数値のデータがないため参考にすることができません。

そのため、アクセス解析ではない情報にて、生活者の情報を集めなければいけません。

キーワード
【キーワード】
なぜキーワードが必要かキーワードとは生活者の不安・悩みそのものが言葉となって表れているものなので、キーワード調査をすることによって、生活者が何に困っているのか・どんな状況なのかを知ることが出来るようになります。
キーワードで分かる事生活者を具体的にイメージできるようになり、生活者の行動パターンや、どんなUIとUXを提供すればいいか見えてきます。
UI・UXへの活用場所オウンドメディア全体よりも、キーワードごとのコンテンツページで、UI・UXを考えるのに活用できます。
キーワードの活用例例えば「雨漏り修理」といったキーワードで検索した生活者があなたのオウンドメディアに入ってきた際、雨漏りは突然発生したり家の不調が目に見えて分かるため、生活者はとても不安な気持ちになります。
不安の度合いも高く緊急を要することも考えられるため、「雨漏り修理」のページの、電話番号・フォームでの相談のボタンや表示を、大きくしてあげたり、ページ上いろんな部分を見なくても済むように、ページの最初の方に配置してあげることで、生活者にとって良質なUIとなり、困っていることに対してすぐに解決できた経験を与えることができます。
ペルソナ
【ペルソナ】
なぜペルソナが必要か現実でターゲットとなるお客様と繋がったり、あなたが行いたいユーザーテストを生活者にやってもらえれば一番いいですが、求める生活者を探して・選んで・呼んでといったことをするにはとても時間も労力もかかります。そのため、仮想の生活者を数人作り出し、ペルソナとして生活者のことを知るための仮想人格を作り出します。ペルソナを作る過程で、あなた自身にターゲットとする生活者の情報をたくさん取得をしてもらう必要があります。
ペルソナで分かる事ペルソナを作る過程で、特定のペルソナの人格を作る以外にも大量の生活者の情報を、あなた自身で保有することになります。ペルソナを作るとペルソナの生活シーンや特定の情報に対しては深い知識が得られますが、ペルソナを作る本当の目的は、ペルソナ以外の生活者の情報をたくさん入手することです。ペルソナ以外の生活者の情報をたくさん持つことで、様々な生活者の行動をイメージできるようになり、その結果UI・UXに対して生活者思考を取り入れることができるようになります。
UI・UXへの活用場所ペルソナを作る過程で入手した大量の情報を元に、生活者の行動や感情を読み取れるようになるので、オウンドメディア全体のUI・UXの流れを作れるようになります。
ペルソナの活用例大量の生活者の情報を持つことで、生活者の行動パターンや傾向が見えやすくなり、ナビゲーションの選定やコンテンツの配置の位置など、オウンドメディア全体のUI・UXをデザインする際に役立ちます。
カスタマージャーニーマップ
【カスタマージャーニーマップ】
なぜカスタマージャーニーマップが必要かカスタマージャーニーマップがあることで、生活者の行動と感情の関係性を、目で見える形で捉えることができるようになります。1人ならいいですが複数が関わっているならば、見える形にした事で生活者の行動と感情を共有し合い、進むべき方向を関わる人全員で統一する必要があるため、カスタマージャーニーマップが必要となります。
カスタマージャーニーマップで分かる事カスタマージャーニーマップでは、生活者とあなたのオウンドメディアとの接点、その接点で生活者が感じている感情をポイント事でわかるため、主にUXである生活者の体験・経験をどうデザインするべきかが見えてきます。
UI・UXへの活用場所生活者とオウンドメディアの直接の接点だけではなく、間接的に生活者と関わる部分である、検索サイトでの検索結果ページや広告など、他の接点に対してもUXの観点を持つことができる。
カスタマージャーニーマップの活用例カスタマージャニーマップを利用することで、オウンドメディア内のデザインだけに意識が向けられがちな問題を解決できる。
UIという観点であればオウンドメディア内のデザインが主だが、UXという観点であればオウンドメディア外でも、生活者の体験・経験が発生していることに気づき、狭い視点を広い視点に変えてUXに取り組むことができるようになる。

オウンドメディアを始めた後

オウンドメディアを始めた時には、生活者のアクセスを取得できていなかったが、オウンドメディアを運用していくごとに、生活者のアクセスログが溜まっていきます。

アクセスログを数値化し、客観的な視点で生活者の行動と思考を読み解けるようになります。

アクセス解析
【アクセス解析】
なぜアクセス解析が必要かあなたのオウンドメディアに訪れた生活者を一人ひとり計測していると、膨大な時間と手間がかかります。アクセス解析ツールを使うことで、見えにくい生活者の行動を、簡単に数値といった見やすいものにすることで、UI・UXへの改善ヒント得られるようになります。
アクセス解析で分かる事アクセス解析で定量的なデータがあると、個人的な感情など解析する際の不要なものを抜くことができるため、客観的な思考で生活者のことを知ることができるようになります
UI・UXへの活用場所タイトル・コンテンツの内容・ボタンの箇所・CVに最適なページ遷移など、オウンドメディアのUIとUX改善に大変役立ちます。
アクセス解析の活用例Google Analyticsの直帰率や離脱の数値が高ければ、コンテンツの見直しであったり、オウンドメディアでボトルネックとなっているページを見つけるのに役立ちます。また、配置したのにクリックされる数が少ないボタンがあった場合は、ボタンの形状・文言の変更をするための気付きを与えてくれます。

UIとUXを考えると見えてくる事

UIとUXを考えていくと、必然的に生活者のことをあなた自身も深く知るようになってきます。

自分が運営しているオウンドメディアにはどういった生活者が、どんな理由で、どんな気持ちを持って、何を解決したくて来てくれているのか。

知れば知るほど様々な思考や行動を持った生活者の事を、あなたは知るはずです。

つまりUI・UXを考えるということは…。生活者一人ひとりを大切に扱い、生活者の想いに一つ一つ丁寧に応えていくという、考え方そのもの。

UI・UXをデザインするには、生活者思考が重要であると、あなたにも覚えてほしいです。

関連情報
こんなに早くなるの!?wordpressの速度改善で検索順位をあげる方法
ブログは「note」と「wordpress」のどっちを使えば稼げる?【比較表あり】
ブロガーになるために、noteと独自ブログどっちを使えばいい?
有料noteの「作り方と値付け」マニュアル【101人分の調査データ有り】