Vercel プロジェクトカードのUI刷新:ウィジェット2段組で情報密度と視認性を両立
Rauno's Field Notes #2

Vercel のデザイナー Rauno 氏が、プロジェクトカードとコンテキストメニューの再設計プロセスを公開。カードのパディング調整や不要な情報の削除で縦のスペースを節約し、グリッドに1行分の余裕を生み出した。さらに、カード右上の領域にウィジェットを2段で配置する新しいパターンを採用。ウィジェットを視覚的に異なる「キャラクター」としてデザインすることでスキャンしやすくし、データがない場合もプラットフォーム機能の概要や有効化の導線として活用できるようにした。
ウィジェットはテキストや色だけでなく、互いに視覚的に異なる「キャラクター」としてデザインすると、スキャンしやすくなります。