Slack の美しさから学ぶ地味な改善の重要性

ども、@kimihom です。

皆さんは Slack を使っているだろうか？使ったことがない方は、試しに使ってみてほしい。Web の世界における、洗練された美しさというのを感じ取ることができる。世界中の人々を魅了する Slack。チャットツールってだけなら他にもたくさんあるのに、なぜこのサービスはここまで凄いのか。私自身、チャットツールをちょろっと作っている立場から、UI 的な視点でその凄さについて例をあげたいと思う。

Slack の徹底したこだわりは、なんとなくの使い心地としてだけ人の心に刺さり、それが愛されてやまないサービスにさせている。地味な改善が究極まで研ぎ澄まされているように感じられる。

徹底した無駄の排除

Slack のキャッチコピーは "Be less busy " だ。煩雑なことをやめて忙しさから解放されるような徹底っぷりが UI の機能まで落とし込めている。例えば人の発言のところ。1行ずつ Enter を押してメッセージ送信をしている。

本来なら、メッセージの時間ごとに日時が表示されるはずだ。この写真で言えば、それぞれ1行ずつ Enter キーを押しているので、 10:48pm と発言者のアイコンがそれぞれに表示されるはずである。しかし、当然そのような重複を Slack が許すわけもなく、2つ目以降は簡素化された表示となっている。

これ、実際に実装するとなると、2つ目以降のメッセージの日時を非表示だけで済む話じゃね？って思われるかもしれない。しかし、1つ目だけ名前やアイコンが表示されているので、2つ目以降の行間などの空白の調整が明らかに変わってくる。Slack のリアクションがなぜ文から少し浮いているのか。それは、アイコン表示のある1つ目のメッセージでも省略された2つ目以降のメッセージでも、共に元のメッセージに被らないようにするためだ。名前の右奥にそのままボタンを埋め込んでしまえば、2つ目以降のメッセージは文にかぶってしまうか、無駄にスペースができて行間が整わなくなってしまうのである。

2つ目以降の日時に関しても、マウスオーバーで美しく整理されているのがわかる。

このような綺麗な収まり具合が人々にとって「使っていて気持ち良い」という感覚レベルの感動を覚えさせるのだ。

日時の表示

Slack の日時の表記も徹底した無駄の排除が行われている。

メッセージは基本的に日時は同じものの塊であるから、メッセージごとに日時の表示をするなんてことは無駄につながる。 Slack はここにも徹底したこだわりで、上部に固定してスクロールしてもそれより下のメッセージがいつのメッセージだかを把握できるようにしている。

このアニメーションでの日時の切り替えのこだわりも感じる。こういう UI は実際に同じことを実装しようとしてもなかなか苦戦する。この徹底っぷりはさすがの一言だ。

美しくあり続ける

最初は美しかったのに、どんどん機能が追加されて汚くなってしまったプロダクトってのが後を絶たない。Slack もたくさん機能があるのにもか関わらず、未だに「シンプル」であるということが言割れ続けている。なぜ Slack はここまで美しさをキープできているのか。

ユーザーの90%は最低限の基本機能しか使わない。だからこそ、その基本機能だけをその画面に止めさせておいて、あとは Slack コマンドや Bot 、 API といったところで熟練者向けに隠し機能的な感じで提供しているのだ。これは、奥を知っていきたい開発者をワクワクさせてくれる。まるで宝探しのような気持ちだ。そういうワクワクを感じる人にだけそのような機能も提供しているというのが、非開発者向けに説明するにはちょうどいいかもしれない。

また、アイコンだけのUIに関しては、マウスオーバーをすれば必ず補足の説明が表示される。この表示タイミングのアニメーションも心地よいレベルで最適化されていると感じる。だからこそ初めて触った人でも、後から触った人でも、常に使いやすいをキープできているのだ。