超没入体験を作る！「フロー体験」をUXに活かす4つのポイント

「フロー体験」をUXに生かす4つのポイント

1. どこに何があるか想定できるページ構成にする

画像引用元：BURST by shopify

フロー体験を生み出す構成要素には、様々なものが挙げられます。

例えば、明確な目標を持ってWebサイトを訪問し、専念と集中によって、注意力を目標に100％向けることができれば、それは「フロー状態」を生み出している、と言うことができます。言い換えれば、目標達成に向けて予測をしたり既知の法則を適用することができ、深く集中し探求するような機会が与えられていれば、没入感のあるWebサイトになっているということです。

ということは、ユーザーが明確な目標を持ってWebサイトを訪問し、その目標を達成するプロセスが明確になっていればいいと言えます。Webサイトの制作側は、フロー体験を生み出すために、どこに何があるか想定できるページ構成にする必要があります。

コマースサイトであれば、購入ボタンがどこにあるかわからなかったり、数量の変更の仕方がわかりにくかったりする場合、没入体験を妨害している可能性があります。

メディア系のサイトも、カテゴリーはどこで、問い合わせはどこで、というのをユーザーテストをとおしてすぐに発見できる位置を特定し、最も使いやすいページを考えることが、フロー体験を生み出す第一歩です。
　　

2. コントロール可能にする

画像引用元：BURST by shopify

NetflixやHuluなどは、ダークカラーを採用することで作品選びの際に没入感を生み出すための環境を作り出している、と言われています。

しかし、それだけではなく、実際に動画を再生したときのコントロール（音量を上下したり、数秒戻ったり）の出来が没入体験を左右しています。

制御可能なインターフェイスが揃っていることは、Webにおける「フロー体験」現出の必須条件だといえます。動画が思ったとおり再生されない、上手くもとのページに戻ることができない、といった不具合は、大きいものであれ小さいものであれ、没入感を妨害するものにほかなりません。

集中を妨害する要素は極力排除すべきですが、このような要素は意外なところに潜んでいます。基本的なボタンパーツのようなUI部品をチェックして、意図したとおりに動いているのかを改めて確認してみましょう。
　　

3. 高度なインタラクティブ性がある

画像引用元：BURST by shopify

ペットや小さな子どもと戯れていると、時間がアッという間に過ぎてしまった。

そんな経験はありませんか？

フロー体験を生み出す構成要素の1つに、*「直接的で即座な反応」*があります。つまり、自分が行った行為に対して、目に見える形で反応があれば、フロー状態を構成しやすいというのです。

ECサイトで言えば、「買い物かごに入れる」ボタンを押せば、「買い物かごに入りました」などのメッセージを表示したり、買い物かごアイコンの上にある数字に１を足したりして、反応が即座に受理されたことを知らせることで、フロー体験を作りだすことができます。

一方、ボタンを押しても何も反応がなかったり、想定した反応とまったく違う反応があると、フローとはとても呼べない状態に変わってしまうのです。
　　

4. 広告を入れない

画像引用元：BURST by shopify

YouTubeでも動画が見られるのに、お金を払ってもNetflixやHuluのような有料サービスで映画を観たいというユーザーはたくさんいます。

理由はいくつかありますが、その中でも無視できないのが*「広告」*の存在です。

フリーミアムのビジネスモデルであれば、広告の表示によって収益を得る場合が多いはずです。ただ、広告は結局のところ、没入感を妨害してしまうものとして認識しておいたほうがよいでしょう。フロー体験を構成する要素の1つは「集中」ですが、広告は今集中しているものとは全く関係のないコンテンツを表示し、気を逸らしてしまう可能性すらあるからです。

もし広告を入れざるを得ない状況になったとしても、全く関係のない広告は挟むべきではありません。映画館の本編上映前に、関連した映画が紹介されるのは、没入感を妨げないためです。どうしても広告を入れざるを得ない状況であれば、少なくとも、何らかの形で関連性のあるものに替えることができるようにしましょう。