ClubhouseのUIに嫉妬している

こんにちは、千葉といいます。
ゲームアプリ開発会社で働いているUIデザイナーです。

突然ですが、Clubhouseというアプリをご存知ですか？
1月末ごろ、Twitterのトレンドを賑わせていた招待制音声SNSです。

なんだそれ？ って人のためにまとめたツイートを貼っておきます（供養）

Clubhouse（クラブハウス）って何？
どうやったらできるの？😂
という人向けにシンプルにまとめてみた！#Clubhouse #クラブハウス pic.twitter.com/0oqUqCghgj

— ちばくん (@moeta_kun) January 28, 2021

このClubhouseがですね、UIがまぁ〜〜 素敵で。
同じUIデザイナーとして嫉妬の念を禁じ得ないので、言語化して昇華したいなぁと思いまとめました。

シンプルにどこがすごいの？

大きく分けて２つ、すごい要素があって、

1. そのUIを思いつかない
 （デザイナーの力：発想力、UIを根本的に考える力、遊び心）
2. 思いついたとしても、採用してリリースまで持っていけない
 （企業や環境の力：企業文化、開発風土）

です。いろんなUIデザイナーさんが言及してますが、片方だけだと現状のUIになってなかったと思うんです。そして片方を満たすだけでも相当難易度が高いので、ダブルでジェラシーを感じます。

この二つの要素が満たされていることで、何が良かったのか具体的に見てみましょう。1、2ともに現在満たしていない私が作るとどうなっちゃうか、合わせてご紹介したいと思います。

とりあえず触ってみてね感。 説明しない。

UIの設計が操作前提であり、繰り返し使われることを見越して、最低限の情報だけを出す！ が徹底されているように思います。
言い換えれば、ユーザーの学習を信頼しているということでしょうか。

・気になるボタンがあったらとりあえず押しちゃって！
・気になるルームがあったら入っちゃって！
・説明とかあんましないから、とりあえずやってみて！

スタンスがこんな感じです。

合わせてUIも楽しげで、ライトな雰囲気に最適化されていると感じました。

UIデザイナーの方、『いや、その情報いる？ 一回触ればわかるじゃん』と言いたくなったことはありませんか？ 

もちろん決済の画面など、法律によって必ず見せなければいけない情報もありますが、『5％の人に配慮しすぎた結果、95%の人の邪魔になっている』というのは、UIデザインにおいてはかなり心苦しい状態です。
なるべく多くの人に快適に触って欲しいからです。
私の関わっていたプロジェクトでは、規模が大きくなればなるほど過剰にフォローをしてしまって、この辺りはまだ強気にいけてなかったなと思います。

Clubhouseはそもそも一期一会前提のサービスなので、操作での失敗が後をひかず、実質失敗にならないUXなのも影響しているかもしれません。

この簡略化とか、結構珍しいなと思っていて、

「All room」を押してroomが最小化された状態なのですが、潔くボタンが✌🏽だけになってます。「✌🏽」の絵文字自体、【部屋を離れる】というイメージとリンクしないはずなのに、✌🏽いいよね！慣れてね！ という意思を感じます。

何気にローカライズしないという決定もすごい。
狙ってやったのか、開発会社の組織サイズの問題かわかりませんが、本当にミニマムで作ってる感じがします。

表現に遊びがあり、一つ一つがナリじゃない

Notion（オールインワン情報共有ツール）がUIアイコンに絵文字を活用した時も話題になりましたが、Clubhouseはその先を行き、絵文字そのものがボタンになっているUIです。
UIアイコンを作成しなくてもいい、見慣れた絵文字で意味が伝わる、すでに親しみがある、など色々メリットがあります。

私が驚いたのは、「✌🏽Leave quietly（静かに去る＝room退出）」のボタン。
Clubhouseでよく使われている 👋 この絵文字ですが、👋🏻👋🏼👋🏽👋🏾👋🏿 このように実はカラーバリエーションがあります。

何も考えずに設定したら、デフォルトの肌の色で「✌Leave quietly」になると思いませんか？ 国民性による違いかもしれませんが、こういった細かいところへの配慮もすごくいいなぁと思いました。

さらに、アプリのアイコンも。ギターを抱えている男性の白黒写真になっています。順当に行くと、アプリ内部のデザインがかなりシンプルであることから、
①アプリのサービスをイメージさせるデザインアイコン
②アプリのロゴアイコン
③背景を賑やかしてアプリ名を入れる  ... このあたりになると思うんですよ。

万一写真を使うことになったとしても、ギターを抱えている男性のカラー写真にしたくなっちゃうと思うんですよね。色が多い方がリッチに見えるので。

目立たせるためにあえてやってると思うんですよね。本当に一つ一つ考えられてます。かっこいい、悔しい。

そして繰り返しになっちゃいますが、これをデザイナーが提案して「いいね！ いこう！」ってなる組織もすごいと思います。「でも今DL数出てるアプリってこうだから、こっちの方がよくない？」ってなっちゃう心理、解りますもん。

・アイコンを「正円」「正方形角丸」ではなく特殊な丸みで作るこだわり
・UIアニメーション、基本操作がiOS標準のものに近い
・余計な画像類が少なく見ていて疲れない（サービス運用的にもよさそう）

などなど、 Good Lookingなところがまだまだあるのですが、私の技量的に語りきれないのでここまでとさせていただきます。

UI/UXデザインについて語るルームで、とあるスピーカーの方が

・これが日本から生まれないのが悔しい
・自分もこれを部下が出してきたらNG出すかも

と話されていて、『マジでその通りだな……私もNGだしちゃうかもなぁ』と思ったので、戒めも兼ねて今後の展望を語っておきます。

どうやったらできるのか？

私は、ClubhouseのUIの特徴を「めっちゃいいじゃん！」と思った勢なので、日本のUIデザインでも「めっちゃいいじゃん！」を増やしていきたい。そのために何からできるか？ を考えました。

心構え編
・遊び心を持つ（これいいんじゃね？ を積極的に試す）
・固定概念に対して疑問を持つ（業界・いままでがこうだから → ×）
・学習前提でUIをつくる、提案する（ユーザーの慣れを信じる）
・デザインの価値を伝え続ける

これらは、個人で意識したいポイントです。

私はUIデザイナー歴6年の中堅なのですが、ClubhouseのようなUIを生み出したことは数えるほどしかないです。思い返してみると、その全てがひらめき起因でした。
「これ、ここに入れたら面白いんじゃない？」「この要素とこの要素、くっつけたらどうなるんだろ」みたいな軽い気持ちで作ったものばかりでした。

どのポイントも、すぐに100点でできるようになるものでもないので、自分を責めすぎず・しかし見つめ直しつつやっていけるといいなと。

組織編
・遊び心を歓迎する（そんなことやってる場合か、という空気にしない）
・CDOを置く/ デザイナーCTOを増やす（デザイン周りの決裁権をえらい人が持つ、切り分ける）
・最低限のデザイナーで作る（変に盛るための余剰人員を持たない）

こっちは、組織作りで意識したいポイント。

私のささやかなUI発明が採用されたのも、当時、一緒にお仕事をしていたメンバーが「いいね！」と言ってくれ、採用・実装してくれたからです。「いいからUI量産してくれよ。これのコピーでいいよ」という仲間だったら余裕でお蔵入りでした。

自分だけ強くても足りない。組織だけ強くてもだめ。
ということで、はあ〜！ やっぱClubhouseつええ〜......
言語化した結果、改めてClubhouseへの嫉妬が強くなっちゃいました。でもこれはいい嫉妬だと思います。というか、いい嫉妬にします。

「今の自分は十分頑張ってきた。でももっと強くなりてえ。日本のUIデザインも負けたくない！がんばるぞ」
そんな気持ちでこれからも精進していきます。
ここまでお読みくださり、ありがとうございました 👋

#デザイン #UIデザイン #Clubhouse #備忘録 #クラブハウス

まだClubhouseに入られていなくて、興味があるよという方の中で

・UI/UXデザイナーの方（UIを見てほしいので）
・ちばくんに電話番号を知られても問題ない方（招待に必要です）

あと1名招待できますので、TwitterのDMよりご連絡ください。お気兼ねなく！
Twitter / Clubhouseのフォロー等必要ないです。先着で招待コードをお送りします。埋まりましたら注記します。


※note内一部解説画像に、当時同席していた方のアイコンを表示しております。問題等ありましたらすぐに差し替え・対応をいたしますので、お手数ですがお声がけください。