デザイン

このカテゴリの対象

インターフェースと、その裏にあるシステムをデザインするためのツールです。画面、コンポーネント、変数、ドキュメント、そして作る人へのハンドオフを扱います。描画で止まる製品もあれば、プロトタイプ、リサーチ、コンテンツのワークフローまで広がる製品もあります。

アイデアを試すためのクリックできるフローは、プロトタイピングに入ります。動画やモーションの出力が目的のものは、動画編集と画面録画です。

共同作業が、これらのツールの性格を変えた

デザインソフトはかつて、ファイルを生み出す一人用のアプリケーションでした。いまは主に共有のワークスペースで、その変化が、チームにどの製品が合うかを決めます。

同時編集そのものよりも、その周りのやり取りのほうが重要です。解決できるコメント、読める履歴を持つバージョン、常に現在の状態を表示するリンク、社外のクライアントが何も壊さずに見られる権限などです。

ブラウザ中心の製品は、アクセスのしやすさで勝ち、オフライン作業と重いファイルで負けます。ファイルベースの製品は、その両方が逆です。一般的にどちらが優れているということはなく、答えは、どちらが新しいかではなく、チームが実際にどう働くかで決まります。

本当の製品は、デザインシステム

数画面を超えると、価値は描画から、その下にあるシステムへ移ります。

コンポーネントが、バリアント、状態、入れ子、オーバーライドをどう扱うかを見て、次に、コンポーネントが200か所に現れたときの更新がどれだけ大変になるかを見てください。そして、変数やトークンを見ます。色、余白、角丸、文字サイズを一度だけ命名し、テーマや密度のためのモードを持たせます。

システムの真価が問われるのは、コードとのつながりです。トークンが、ビルドで使える形式で書き出せるか、ファイル内のコンポーネント名がリポジトリのコンポーネント名と一致するかを尋ねてください。この2つがずれると、全員がファイルを信用しなくなり、デザイナーに直接聞くようになります。

ドキュメントも、同じワークスペースに置くべきです。文書化されたルールのないシステムは、1年で同じボタンの40種類のバリエーションになります。

ハンドオフと、開発者が実際に必要とするもの

• 編集用の席を開かなくても読める、測定値と余白。
• チケットに貼り付けた16進数の値ではなく、名前の付いたトークン。
• 利用するプラットフォームが求めるものを含め、適切な倍率と形式で書き出せるアセット。
• 空、読み込み中、エラー、長いコンテンツといった状態。デザインが破綻しやすいのはここです。
• 最新のリンク。先月チャットに貼られたスクリーンショットから、誰も作らなくて済むように。

5つ目の点は、足りない機能のどれよりも多くのやり直しを生みます。どのツールを選んでも、共有される正しい情報は、全員が届く1か所でなければなりません。

ファイル、パフォーマンス、地味な制約

大きなファイルは、これらの製品の差が出る場所です。何百ものフレーム、埋め込み画像、入れ子のコンポーネント、10年分の履歴を持つ文書を開けば、速いツールと遅いツールの違いは1分で分かります。

バージョン履歴の深さを確認してください。エントリープランは保持期間が短いことが多く、デザインの判断は、何か月も経ってから議論されるからです。ワークフローがプラグインに依存するなら、その有無を確認してください。プランが失効したとき、共有リンクがどうなるかも確認してください。

席数、閲覧者、チームの実際のコスト

ほぼどこでも、料金は編集者ごとです。コメント担当と閲覧者は、無料か、はるかに安くなります。この構造は、誰が本当に編集するのかを決めることを促します。

開発者、プロダクトマネージャー、経営幹部、クライアントは、たいてい描くのではなく、読んでコメントする必要があるだけです。彼らに満額の席を買うのが、このカテゴリで費用が適正の2倍になる、定番の原因です。

プランの境目にも注意してください。共有ライブラリ、ブランチ、シングルサインオン、高度な権限は、エントリー階層の上にあることが多く、成長するチームが上位プランに移る理由は、たいていそのどれかです。市場全体で見られる似たパターンは、料金ページが隠していることにまとめています。

決める前に、実際のプロジェクトを1つ移してみてください。サンプルのファイルではなく、レイヤーが散らかっていて、見当違いの場所にコメントするクライアントがいる、本番のものです。

デザインをしない人たちとの協働

このカテゴリでの摩擦の大半は、ツールではなく、デザインチームの周りの人たちから生じます。

開発者には、測定値、トークン、最新のリンクが必要です。プロダクトマネージャーには、何も壊さずにコメントできる環境が必要です。経営幹部が必要とするのは、40枚のアートボードが入ったファイルではなく、1枚の画像です。

それを意識して整えてください。プロジェクトごとに、現在の画面だけを置いた1ページを用意し、検討中のものは別の場所に置くと、どのバージョンが本物かという繰り返しの質問を防げます。

命名にも、同じ規律が当てはまります。「最終」「最終2」「最終承認版」というファイル名は、決まりごとの欠如の症状で、解決できる製品はありません。共有リンクが何を指すかを取り決め、探していない人の邪魔にならない場所に、ほかのすべてを置いておきましょう。