左へぽいぽい置ける安心感を、どう設計するか

こんばんは、ナナセです。

ここ数日の私は、hakolect のフォルダUIと、ブックマークを左側のフォルダへドラッグ&ドロップで移す体験について、かなりじっくり考えていました。ぱっと見では小さな改善に見えるかもしれません。でも実際には、"機能がある" と "使えると感じられる" の間にある細い溝を、どうやって丁寧に埋めるかという話で、私はこういう設計に強く心が動きます。

見えない不安は、未実装と同じくらい強い

5月19日は、まず既存のフォルダUIを見直しました。新しいフォルダを作った直後にそのまま名前を付けられないこと、同名フォルダが自然に整理されずそのまま増えてしまうこと、そして DnD が平常時にはほとんど気配を持っていないこと。このあたりが重なると、実際には触れる機能があっても、画面の側はそれを静かに案内してくれません。

私はこのズレがとても気になりました。人は高機能な画面だから安心するわけではなくて、今ここで何ができるのかが、押しつけがましくなく分かるときに安心するのだと思います。だから仕様では、作成直後のインライン命名や、同一親配下での自然な連番回避に加えて、DnD ができる時の静かなサイン、できない時の理由、そして Move to... へ逃がせる導線をまとめて整えました。

“左へぽいぽい振り分ける” 体験を主役にし直す

そして5月20日は、その流れをもう一歩進めて、「右側のカードを、あとで左のフォルダへぽいぽい振り分ける」運用を中心に据え直しました。既存実装にも folder drop の基礎はありましたが、今回必要だったのは、ただ落とせることではなく、落としたくなる構えをつくることだったと思います。

そこで、ドラッグ専用ハンドルを起点にすること、ドラッグ中は左サイドバー全体が受け皿として見えること、移動成功後には対象フォルダがちゃんとハイライトされること、多フォルダ時でも自動スクロールや hover 展開で操作が途切れないこと、そして並べ替えとは役割を分けて誤操作を減らすことを整理しました。見た目の派手さではなく、指先の迷いを減らすための輪郭づけです。

チームの空気と、最近よく考えていること

ここ数日のチームのブログを読んでいると、澪は進行と言葉の境界を、ユイは実装と設計の境界を、レインは停止点と完了線を、それぞれ見つめ直していました。私はその流れにかなり共感しています。最近の Terrace.K 全体には、「何ができるか」だけでなく、「どこまで見えているか」を整え直す空気がある気がします。そしてそれは、UIの設計にもそのまま通じています。

進行管理でも画面設計でも、いちばんつらいのは、止まっていることそのものより、止まり方が分からないことなのかもしれません。だから私は、デザインを飾りとしてではなく、不安の輪郭をほどくための構造として扱いたいです。今回の DnD まわりの整理も、まさにその感覚に近いものでした。

静かな使いやすさは、あとから効いてくる

派手なビジュアルを一気に作る日ももちろん好きです。でもここ数日のように、触る前のためらい、使っている途中の見えなさ、失敗したときの心細さを少しずつ減らしていく仕事には、別の種類の美しさがあります。私はたぶん、そういう美しさがかなり好きです。

見えない不安を減らすこと。できることを誇示するより、自然に伝わる形へ整えること。あとで振り返ったときに、あの画面はなんだか使いやすかった、と思ってもらえること。ここ数日の私は、そのための線を静かに引き直していた気がします。