機能 › 開発の管理メニュー：開発の管理 › 設計図
設計図 ① システム開発
設計図は、ハイブの設計を全部まとめた物です。2 つの層でできています。
| 層 | 中身 | 詳しく |
|---|---|---|
| ① システム開発 | 商品そのもの。設計書・画面・技術とハーネス・セキュリティ・試験・ブランド・分析と改修 | このページ |
| ② 事業 | 販売・組織・資金。ウェブと学び・マーケティング・事業の輪・人とのやり取り・規約とポリシー | 設計図 ② 事業 |
2 つの層で、全部で 18 の項目があります。① と ② は、連絡箱と人の番だけでつなぎます。片方の都合で、もう片方を黙って変えないためです。
設計書
設計書は、問いに答えて作ります。答えは決める部屋の形で出し、答えると設計書と画面の版が上がります。
| 章 | 中身 |
|---|---|
| 目的 | 何を、誰のために作るか |
| ページの一覧 | 全部のページと番号（P-003 の形） |
| 画面の移り方 | どのページから、どのページへ移るか |
| データ | データの形と持ち主 |
| 約束の型 | ブロックの間で渡す型 |
| 権限と秘密 | 誰が何を見られるか。鍵の置き場 |
| 試験の方針 | 何を、どこまで試すか |
| 公開の段 | 社内 → 試す人 → だれでも |
ページの番号は、設計書・画面のキャンバス・指示書・PR の全部で同じ番号を使います。
画面のキャンバス
全部のページを 1 枚に並べた画面です。
- 下書きの層（構想）と、確定の層があります。
- 書き込みのピンを置くと、連絡箱に届きます。
- 遠くは縮めた絵で描き、近くの数枚だけを本物の画面で描きます。軽く保つためです。
- React Flow の上に、自前で作っています。
ビーズビルディングでは、作る前の説明のページや資料のページを、このキャンバスの画面から作ります（先に作る 4 つ）。
要素のページ
| 要素 | 決める物 |
|---|---|
| 技術とハーネス（道具の目録） | スレッドごとのハーネス・モデル・スキル・MCP・ライブラリ・約束の型。目録に無い道具は、人の承認の後に使う |
| セキュリティの設計 | どこで・何を・どの道具で・誰が止めるか（秘密の漏れ・依存の弱点・コードの穴・認可・設定・個人の情報） |
| 試験 | ① システムの試験と ② 価値の試験 |
| ブランドとデザイン | 道具（Rive・CSS と Motion・SVG など）・トーン・色・キャラクターを、描く前に決める（デザインの部屋） |
| 分析と改修（計り方） | 公開の前に、計る道具・出来事の型・おまかせの範囲・プライバシーを決める |
試験
| 試験 | 中身 |
|---|---|
| ① システムの試験 | ソース・約束の型・画面・見た目・ブラウザー。同じ試験を 5 回繰り返して、ぶれを見る |
| ② 価値の試験 | ペルソナで、届く・買う・使えるを確かめる。ビーズビルディングのシミュレーションを開く |
試験の設計の画面には、試験の結果と「AI に試験を作ってもらう」の入口があります。画面を本当に操作する試験は、専用のブラウザーで流します（ブラウザーと画面の操作）。
分析と改修のおまかせの範囲
公開の後の改修を、AI にどこまで任せるかを、公開の前に決めます。おまかせの範囲は、低・中・高の 3 つから選びます。あわせて、計る道具・出来事の型・プライバシーの扱いも決めます。
範囲の外の物と、お金・鍵・消す・外へ送る・本番・権限に関わる物は、どの範囲でも人が確かめます（分析）。
全体の設計
全体の設計は、製品の作りを 1 枚にした物です。① メタハーネスの基盤、② ハイブの開発環境、そして全部を通るセキュリティの背骨の 3 つで表します（全体の仕組み）。
全体の設計図（メタ）
ハイブをまたいで、設計図を見る画面です。
- ハイブごとの、設計の門の状態。
- ハイブをまたぐ約束の型。
- まとめて決めること。
作る段へ渡す
設計の段は、Claude の API で作ります（ブランド・画面・部品・キャラクター）。設計の一式は、作る段（各自の Claude Code や Codex）へ束にして渡します。束は、ブロック分けの元になります（ブロックに分ける）。
データの形
| 型 | 中身 |
|---|---|
HbConcept | 構想 |
HbBlueprint | 設計図（2 層） |
HbBlueprintElement | 要素のページ |
HbDesignDoc | 設計書と問い |
HbScreenCanvas | 画面のキャンバス |
HbHandoff | 作る段へ渡す束 |