GitLab UIのこれから

この1年、GitLabの製品UIは「引き算」の季節を過ごしてきました。ダークモードに続いて、アプリケーションの外枠は静かになり、色数は全体的に絞られ、操作系の要素はニュートラルな見た目へ。ちょうど、潮が引いていくような変化です。何かが失われたように感じられるかもしれません。引き潮とは、いつもそういうものですから。ただ、潮が引いたときこそ、海岸線の輪郭がはっきりと見えてきます。その上に新しいものを築けるくらい、はっきりと。

代わりに満ちてくるのは、これまでとは違う働き方のためのUIです。目当てのボタンを探しに行くのではなく、必要になった瞬間に、それ自体が立ち上がってくる。こうした発想の転換には、呼吸するための余白が要ります。いま進めているのは、そのための地ならしです。

テクノロジーは、こうした循環を何度も繰り返してきました。物理ボタンがタッチスクリーンに置き換わったときも、当初は失われたものばかりが目につきました。ジェスチャーや音声、触覚フィードバックが、より深いインタラクションと表現を可能にするまでは。ケーブルは無線に道を譲り、世代が変わるたびに、しばらくのあいだ確かな摩擦が生まれてきました。引いていく潮そのものが主題なのではありません。大切なのは、その潮とともに満ちてくるものの可能性です。

GitLab UIでは、次の点が変わりました。

• アクションとコントロール（ボタン、フォームコントロール、切替、タブ）をニュートラル化し、コントラストを向上
• インスタンスのテーマ設定を強化し、適用範囲をさらに拡大
• ニュートラルパレットを刷新。テーマ向けに、わずかに色味を帯びたニュートラルカラーを追加
• にじむような光を表現する新しい「bloom」ビジュアル要素により、GitLab Duoとのやり取りや、ユーザーの入力が必要な場面へ注意を向ける

変更前（左）と変更後のコンポーネント

変更前（上）と変更後のUIテーマ

GitLab Duoパネルの下に現れるbloom

新しいデザインに至るまでの道のり

GitLabにおけるこの循環は、数年前、古いBootstrapのバリアントを数多く取り除いたところから始まりました。その後、デザイントークンへの移行とともに歩みを進めています。混み合ったパレットをみんなで共有するのではなく、アクション、フィードバック、コントロールといったカテゴリーごとに、色の適用範囲をより狭く定義していく。製品における色には、一度にあまりに多くの役割を担おうとしていたという、実際の問題がありました。結果として、画面によっては「クリスマスツリーのように光り輝いている」ように感じられてしまう。一般に、エンタープライズソフトウェアが色を絞るのは、色が現れたときにそこへ意味を持たせるためです。GitLabが何年もかけてイテレーションを重ねてきたのは、まさにこの方向性でした。

この種の変更が一度目で完璧に決まることは、まずありません。レビューや初期テストでは問題なく見えていても、製品全体という広い面で使われて初めて、課題が姿を現します。2つの状態を見分けにくい、コントロールが見つけにくい。そうした声は、その背後にあるより大きなUXや構成上の課題を示唆していることもあり、修正する価値があります。これは今回の展開に限った話ではなく、イテレーションという営みそのもの。GitLabではUIフィードバック用のイシューを用意し、寄せられたコメントに対応しています。

ここまでAIに触れずに来ましたが、そろそろ本題です。静かで引き算的なUIそのものが目的なのではありません。次に来るUIの波は、クリックされるのを待つ要素の中だけに宿るのではなく、知性を備えて自ら姿を現す瞬間に宿ります。すでに騒がしいUIでは、そうしたやり取りはかき消されてしまうのです。

すべての変更が同じように受け止められるわけではないことも、承知しています。主観的な理由による場合もあれば、きわめて客観的な理由による場合もあるでしょう。その違いはGitLabにとって重要な意味を持ちますし、どちらについてもぜひ声をお聞かせください。フィードバック用のイシューにコメントを投稿する