デザインハンドオフ
コピーは承認された。デザイナーやワイヤーフレーム生成ツールがそこから必要とするのは、単なる言葉ではない。各ブロックの言葉が読者に対して何をするべきか、その順序、そしてそのうちどれがスマートフォンでも有効であるべきか、である。このスキルは一方を他方に変換し、コピーが既に決定したことについては一切決定しない。
ゲート:承認済みコピー、およびセクションごとのセクション仕様
2つの入力がある。2つ目はしばしば欠落する。
承認済みコピーであって、ドラフトではない。 まだ議論中の段落を中心に構築されたレイアウトは作り直されることになり、その作り直しは常に悪化する。なぜなら、それは別の言葉のために選ばれた形状に対するパッチになるからだ。コピーがまだ変動中であれば、停止してその旨を伝えよ。
セクションごとのセクション仕様。 ../conversion-page-build/SKILL.md はコピーと並行して、## セクション仕様 という見出しの下にこれを生成する。このスキルは、section_type、purpose、content_hierarchy、components、responsive_intent という5つのキー名のみでそれを読み取る。そのファイルが、仕様の形状と、それがコピーの後ではなく前に書かれる理由を所有する。
仕様なしで到着したコピーでもハンドオフは可能である。まずコピーから仕様を書き出し、出力に それらが推測されたものであることを明記せよ。完成したコピーからリバースエンジニアリングされた仕様は、そのコピーが「何をするように見えるか」を記録する。これは「何をするために作られたか」と同じではない。両者が異なる場合、デザイナーは忠実に誤った意図をレイアウトすることになり、下流でそれを発見する手段はない。
手順
4つのステップ。最初の3つは常に実行する。4つ目は通常実行しない。
- 各セクション仕様をコンポーネントにマッピングする —
references/section-to-component.md。5つのキーを、セクションごとのコンポーネントリストと、そのセクションに関するレイアウトを制約する唯一の事項に変換する。 - ワイヤーフレームブリーフを書く —
references/relume-brief.md。ページレベルのフレーミング、次にセクションごとに1ブロック:構造とコンテンツ機能。外観は含まない。 - リファインメント仕様を書く —
references/figma-refinement-spec.md。視覚的階層、強調、ファーストビューの優先度、スキャンパス:ワイヤーフレームでは確定しない4つの事項。 - プラットフォームノート(条件付き) — 以下を参照。
ステップ2と3は意図的に別々のドキュメントとして、かつこの順序で維持される。その理由は references/figma-refinement-spec.md の冒頭に記載されており、ここでは繰り返さない。
プラットフォームパスは、プラットフォームが指定された場合のみ実行する
ビルドターゲットが指定され、それがWordPressである場合を除き、references/platform-notes-wordpress.md を開くな。 Webflowビルド、Framerビルド、手書きビルド、および名前のないビルドは、ここでは何も読み込まない。
これはファイル整理のためのものではない。プラットフォームノートは、あるプラットフォームでは現実的であり別のプラットフォームでは偽である制約を記述する。そのため、適用されない制約を含む仕様は、デザイナーに存在しない問題を解決させ、誰かが質問したときにその解決策を擁護させることになる。間違ったノートは、ノートがないことよりもコストがかかる。
ターゲットが指定されていない場合は、尋ねよ。答えが「未定」である場合は、プラットフォームフリーでハンドオフを書き、出力に プラットフォームパスは実行されていない と記録せよ。そうすることで、ビルドを引き継ぐ人が、パスが通過したと想定するのではなく、未確認のチェックがあることを認識できる。
すべてのプラットフォームファイルは同じ形状を持ち、それ以外は何も含まない: 動作ごとに1つのノート。各ノートは3つの事項を述べる — プラットフォームの動作、その動作が引き起こす失敗、およびそれを回避する表現。このスキルにファイルがないプラットフォームにはノートは付与されない。決してWordPressのノートをデフォルトとして使用してはならない。これこそが、条件分岐が防止するために存在する特定の誤りである。
ツール名は表札であり、手法ではない
2つのリファレンスファイルはツールにちなんで名付けられている — references/relume-brief.md と references/figma-refinement-spec.md — なぜならそれが人々が求める名前だからだ。どちらもツールに依存するものは何も含まれておらず、どちらも、与えられたもので任意のツールが何をするかについて主張することはない。
その抑制は意図的である。「ツールXはこのように整形された説明を受け入れる」と言うスキルは、他人の製品についての主張を行っており、それは静かに陳腐化する。そして読者は、現在の主張と2年前の主張を区別する方法を持たない。したがって、これらのファイルは、ドキュメントが何を含み、なぜそのように整形されているかを記述する。ツールに関する何かが実際に確認された場合、ファイルは確認された日付とともにその旨を記載し、確認範囲を超えたことは一切述べない。
レジスターは、ただ一つの場所でデザインに到達する
レジスターはコンバージョンブリーフから継承され、ここで再決定されることは決してない。その背後にある理由は ../audience-research/SKILL.md に属する。5つのプロファイル自体は ../audience-research/references/register-profiles.md に存在する。
レジスターは、このスキル内の1つの決定にのみ影響する:ページが費やすことができる強調の量。 ここでの他のすべては構造的であり、変更されずに伝わる — 同じセクションは、読者が誰であれ、同じことをしなければならない。references/figma-refinement-spec.md がその唯一の交点を持ち、このスキル内でレジスターの行を読み取る唯一のファイルである。
このスキルが行わないこと
- コピーを書き換えない。 あるセクションが、コピーがそのセクションの目的を決して述べていないためにレイアウトできない場合、問題が語句であるなら
../copy-sweeps/SKILL.md、問題が欠落した引数であるなら../conversion-page-build/SKILL.mdである。どちらであるかを特定し、停止せよ。 - ビジュアルスタイルを選択しない。 パレット、タイプスケール、スペーシング値、ブレークポイント番号は一切含まない。ランクと関係性を設定する。デザインシステムが値を提供する。
references/figma-refinement-spec.mdは、この拒否と、それらを提供するデザインシステムがない場合の対処法を完全に述べている。 - 既に出荷されたページから作業することは決してない。 このスキルは前向きに動作する。承認されたコピーから、誰もまだ構築していないレイアウトへ向かって。既存のレイアウトを評価することは逆向きの動作であり、このスキルが持たない証拠を必要とする —
../conversion-page-audit/SKILL.md。 - 構築しない。 プラットフォームノートは、仕様がビルドターゲットで安価に実現できないものを要求しないようにするために存在する。それらはビルド指示ではなく、このスキルをビルドスキルにするものでもない。
未解決項目
ハンドオフがコピーとブリーフから解決できないものはすべて、推測するのではなく、ドキュメント内に 未確定 — <それを解決するもの> と記述する。この規律とその理由は、プラグイン全体のために ../audience-research/SKILL.md で一度述べられており、ここでは変更せずに適用される。2つのケースが最も頻繁に発生する:レイアウトが依存しているがまだ誰も制作していないアセット、およびコピーが約束しているが存在しない証明要素。
生成物
単一のハンドオフドキュメント。この保管庫のファイリング規則では、03 Projects/<プロジェクト>/<ページ>/[C] デザインハンドオフ — <ページ>.md に配置される。他の場所では、プロジェクトが仕様を保管する場所ならどこでもよい。以下の順序で含まれる:セクションごとのコンポーネントマップ、ワイヤーフレームブリーフ、リファインメント仕様、そして — プラットフォームが指定された場合のみ — それに適用されるプラットフォームノート。
どこにファイルしたか、およびプラットフォームパスが実行されたかどうかを明記せよ。プラットフォームについて沈黙しているハンドオフは、プラットフォームがチェックされたハンドオフとして読まれる。