#172スコア 4/5金融

AI に M&A マッチングを作らせてみた — 索引が「会社にアバター」を勧めた回（やってみた #172）

ルート: /ma-matching
デスクトップ表示
モバイル表示

375px のビューポートで撮影。縦長のページはフレーム内をスクロールします。

解説記事

AI に M&A マッチングを作らせてみた — 索引が「会社にアバター」を勧めた回（やってみた #172）

やってみたシリーズ: 自作のデザインシステム @gunjo/ui（群青）を、文脈ゼロの cold な AI に実 UI で作らせる連載。MatchCard 狙いの深掘り＋新業種（M&A/事業承継・金融）——M&A マッチング（買い手⟷売り手・適合度・業種/エリア/規模の適合）。M&A アドバイザー向けの情報密度コンソール。

結果 — 4/5、pairing 詳細だけが穴

tsc 緑・デスクトップ密。cold AI（群青を一度も触っていない設定）：

本物の強い back-office キット。 KPI strip・ランク候補リスト・スコア Meter・案件テーブル・対応キューに purpose-built 部品が逐語で嵌まった。1星減点は、マッチングコンソールがまさにそれについての1つ＝二者間のペアリング詳細。会社×会社 primitive が無く、索引が people-shaped な物に能動的に誤誘導した。

観測の核 — 索引が「会社にアバター」を勧めた（MatchCard 2/3）

売り手×買い手のマッチ詳細（2社を左右に並べ＋適合度＋業種/エリア/規模/価格/シナジーの factor 適合）——RelationshipRow を当てたくなる。だが：

cold AI「二者間 MatchCard/PairingPanel が無いので手組み(PairingPanel.tsx)。会社用の identity cell が無い——PersonCell は avatar+name+role なので会社カラムを一から作った。索引は『2人を並べる(上司↔部下)』→ RelationshipRow と誘導するが、RelationshipRow の from/to は PersonCellProps 型＝2つの PersonCell(アバター＋presence dot)をレンダーする。会社×会社 には3点で誤り：(1) アバター/presence の人モデルを組織に強制(2) 各社の財務 facts リストのスロット無し(3) score/factor-breakdown 領域無し(細い relationshipLabel だけ)。索引は視覚的に最も近い物を勧めつつ意味論的に間違い**。追加すべきは generic な二者間 MatchCard/PairingPanel(left/right エンティティ＋score＋factors・people 前提でない)＋CompanyCell(PersonCell の組織版)。**」

MatchCard は #160 求貨求車(荷物×空車) と #172 M&A(売り手×買い手) で 2/3。 仕様は両回で安定＝left＋right の任意エンティティスロット＋中央 score/connector＋factors breakdown・エンティティ非依存。サブ穴＝CompanyCell（組織 identity＝ロゴ/イニシャル＋名前＋facts）も浮上＝RelationshipRow が people 固定なのもこれが原因。あと1回のマッチング/比較画面で 3-confirm → build。

学び — 「視覚的に近い」と「意味論的に正しい」は別物（索引の罠の集大成）

索引の罠を整理してきた（隠す/すり替える[型・a11y・形]/自認する）。#172 の RelationshipRow はすり替える罠の最も教科書的な形：

  • 視覚的には近い（2つを並べた横長コンポーネント）。
  • 意味論的には逆（people 固定で、会社の財務 facts も適合 score も入らない）。

cold AI 評：「索引は視覚的に最も近い物を勧めつつ意味論的に間違い——マッチングコンソールがまさにそれについての pairing 詳細でそれが起きる」。これは #170 の「形（縦 vs 横）の取り違え」のさらに先＝横長で形は合うが、中身のモデル（人 vs 組織）が違う。索引の格付けは、型・a11y・レイアウトの形に加えて**ドメインモデル（人か組織か）**まで含める。

→ MatchCard は people 非依存で build する（あと1回で 3-confirm）。CompanyCell も同時に＝PersonCell（人）↔CompanyCell（組織）の対。「人の部品があるなら組織の部品も要る」——#150 で書いた「表示があるなら入力も要る」の組織版だ。

拾った点（陽性の越境検証）

  • ✅ Leaderboard(適合度ランキング)/DataTable(案件一覧)/Meter(適合度 higher-is-better+target=提案推奨ライン)/ActionQueue(NDA/返答待ち)/StatGroup/FilterChips/MetadataList(各社の財務 facts) 全て native。
  • 🟡 Select だけ children/option 駆動で他の items-prop 規約とズレ（DX）・Badge/Tag と Meter/Leaderboard の tone union が非互換でマッピング glue。

今回 src build なし（4/5・MatchCard 2/3・RelationshipRow people 固定 再確認・CompanyCell 浮上）。

📊 結晶化スコアボード（build 済 24個）

…OriginDestination / DocumentRow（このセッションで11部品） 進行中：MatchCard(2/3)・CompanyCell(1/3)・SimpleDialog(1/3)

📋 進捗

  • 運輸5モード完走 ✅／在庫深掘りで goodWhen/OriginDestination/DocumentRow 結晶化
  • MatchCard 2/3（あと1回で build）・新業種 金融(M&A)に着手

次回予告（やってみた #173）

  • MatchCard 3回目（別のマッチング/比較画面）→ build＋CompanyCell、or 新業種さらに。※KeEem に確認。

試す

索引が「会社にアバター」を勧めた——視覚的に近いが意味論的に逆（人 vs 組織）。索引の格付けはドメインモデルまで含める。MatchCard は people 非依存で、CompanyCell とセットで build へ。

<!-- 公開前: 相互URL差込／スクショ確定／EN(dev.to)ミラー -->

使用した @gunjo/ui コンポーネント

この画面のソースが直接 import している部品です。

ActionItemActionQueueBadgeButtonCardCardContentCardHeaderCardTitleColumnDefDataTableEmptyStateFilterChipFilterChipsLeaderboardLeaderboardItemMetadataListMetadataListItemMeterPageHeaderSelectSeparatorStatGroupStatisticPropsTag

cold AI が組み上げた実コード

ファイル名をクリックでソースを展開できます。