Twitterのフォローボタンの見た目が反転した理由を考察してみた

2021年8月12日TwitterのUIが変わったというツイートを見ました。

うわ、トレンドのTwitterのUIってこのことか。
フォロー中の表示が今まで薄いブルーだったのが新仕様で背景と同じ色に・・・これわかりにくい上に誤クリックしてフォロー外すまである。どうしてTwitter社は毎度毎度ユーザーを混乱させる意味不明仕様変更をするの。頼むから元に戻して。 pic.twitter.com/Z26vTN0DM2— 🐾みけさん🐾/ やすにゃー提督@大湊 / ウマ娘 (@Mikecat283) August 11, 2021

フォローのButtonに関しては、色と塗りの状態が変わったというものです。

単純にこの変化だけ見ると「どうしてこうなった」という疑問が湧いたので、自分が持つUIの知識と向き合って考えてみました。

結論

フォローのButtonはトグル(ON/OFFを切り替えるButton)からアクションを促すButtonに期待が変わったのでそのルールに合わせて変化したのではないか。というものです。

Buttonについて

私が持っているUIの知識の中でButtonは塗られているものが「選択中のとき」塗られていないときは「選択していない」のときという傾向が強いと考えています。
ナビゲーションなどで使われる場合は特にその傾向が強いです。

一方でアクションを起こさせるためのButtonは塗られていることが多いです。
塗られている理由はButtonを配色の領域を増やすことで、「目立たせる(アクションを起こさせる)」ためと考えています。
塗りのないGhostButtonの場合は、別の選択肢として並列させたり、優先度は低いがButtonやリンクとして必要な場合に使われます。

色が黒に変わった理由

TwitterのUIでアクションを促すためのButtonがすべて黒に変わったわけではありません。
例えばツイートボタンは青のままです。

色に違いを出す場合はPrimaryやSecondaryのように優先度や意味をもたせることが多いのですが、今回の場合は明確な意図を見つけることは出来ませんでした。

ただもし青のままでフォローのButtonの塗りが反転されていたらどうなったかと考えると、今以上の混乱を生んだことが想像できます。フォローをしたつもりが、実際はフォローを外す行為をしていたなんてことは非常にマズいでしょう。
黒にしたことでUIの変化に気づいてもらうという意図が濃厚な気はしています。
この考察が合っていた場合、どこかのタイミングで青に戻る気がします。

アクションButtonに見た目を変更をした理由の考察

「フォローする」というButtonはもともとアクションを促すためのButtonだっと思いますが、UIは選択中かそうでないかのような構造になっており、Twitterのデザイナ自身もこの矛盾に長い時間悩まされていたのではないかと考えています。

その矛盾を正すために今回のような強引と思えるような変更があったのではないかと考察しています。

もちろんデザイナのわがままで変わったということではなく、いわゆる普通のUIに近づけた事で認知を使用してユーザーに「フォローする」のアクションを促したかったからということかな。と考えると改善の理解はできます。

普通のUIの難しさ

私は普段UIデザイナをしており「普通のUI」というの難しさと向き合っています。
それは普通のUI = 至上のUIと捉えているからです。

他者の UIDesignをみて時々混乱するのがダイアログなどで使われるButtonの並びです。
AndroidやiOSなどでは単純な選択の場合は右端にアクションを促すButtonを用意することが多いです。

ただ時々、「OK」「キャンセル」といった左端の優先度を高めるButtonの配置も見かけたりしまうので、「普通」という定義は非常に難しいなとしばしば頭を悩ませます。

まとめ

Twitter社のUI変更はこれまでも何度もあり、その度に「使いにくい」と話題になっています。
ただ数週間・数ヶ月立っていくとそんな話題は消えていき、苦言を呈していたユーザーも普通に使っていたからこういった変更を行えたのではないか。と思ってます。

リニューアルあるなどで「使いにくくなる」というのは引っ越ししたばかりのときと似ていて、アクションする度に今までと同じようにできずノイズが走りストレスになります。ただ人類は慣れるので、慣れたあとに使いやすくなるかを考えてリニューアルなどは行われます。

私もUIデザイナを長年していますが、失敗した設計は今でもありますので、今回のUI変更が考察通りのものと思うと並々ならぬ共感を持ちました。

多少強引な変更が合っても私にとっては Twitterは必要なプラットフォームなので一瞬使いにくくなっても問題はないので、これからもTwitterの改善を暖かく見守っていこうと思います。

宣伝

最近Webデザイナ向けのお役立ちサイトを作りました。よかったらこのサイトも御覧ください

この記事を書いた人

conti

名古屋在住のUIデザイナ。UIコンポーネントの設計と運用と素早くプロトタイプを作りながらフロントの実装するのが得意です。最近はReactを触るのとデザインシステムを作るのが好きです。コーギーと暮らしています。
プロフィール