@ubie/vitals-ui-business 0.6.0 → 0.6.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (27) hide show
  1. package/CHANGELOG.md +59 -0
  2. package/DESIGN.md +22 -22
  3. package/docs/components/chat.md +2 -2
  4. package/docs/components/drawer.md +3 -3
  5. package/docs/components/icon.md +2 -2
  6. package/docs/components/layout.md +2 -2
  7. package/docs/components/modal.md +1 -1
  8. package/docs/components/statistic.md +4 -4
  9. package/docs/components/table.md +7 -7
  10. package/docs/patterns/chart.md +4 -4
  11. package/docs/patterns/disclosure.md +3 -3
  12. package/docs/patterns/empty-state.md +3 -3
  13. package/docs/patterns/link.md +2 -2
  14. package/docs/patterns/list-detail.md +5 -5
  15. package/docs/patterns/print.md +6 -6
  16. package/docs/patterns/region-state.md +5 -5
  17. package/docs/patterns/skeleton.md +5 -5
  18. package/docs/principles/README.md +45 -11
  19. package/docs/principles/information-design.md +7 -7
  20. package/docs/principles/runtime-environment.md +4 -4
  21. package/docs/principles/ux-checklist-items.md +199 -0
  22. package/docs/principles/ux-checklist.md +94 -0
  23. package/docs/principles/ux-principles.md +152 -43
  24. package/package.json +4 -3
  25. package/src/reference/hardcodedStyle.ts +117 -0
  26. package/src/reference/hardcodedStyleKnown.ts +41 -0
  27. package/docs/principles/scorecard.md +0 -56
package/CHANGELOG.md CHANGED
@@ -1,5 +1,64 @@
1
1
  # @ubie/vitals-ui-business
2
2
 
3
+ ## 0.6.1
4
+
5
+ ### Patch Changes
6
+
7
+ - 2a0f701: test(ui-business): トークンを通さない色・角丸・文字サイズの直書きを数える検査を足す
8
+
9
+ 利用側の API と見た目は変えていない。`src/` の直書き（hex・`rgb()`・角丸と文字サイズの数値）を数え、今ある分（すべて story）を固定した。増えたら CI が落ちる。
10
+
11
+ - 53848d2: fix: 見た目の回帰検査の基準画像を配布物から外し、8 原則の旧番号から 11 原則への対応表を足す
12
+
13
+ - `package.json` の `files` に `!src/**/__screenshots__` を足した。直前の版では、Storybook の見た目の回帰検査に使う基準画像 322 枚（約 3 MB）が配布物に入るところだった。利用側はこの画像を使わない
14
+ - `docs/principles/README.md` に「0.6.0 までの番号（8 原則）」を足した。0.6.0 まで原則は P1〜P8 の 8 個で、11 原則とは同じ番号が別の原則を指す。0.6.0 までの番号で書かれた参照は、次の表で読み替える
15
+
16
+ | 0.6.0 までの ID | 11 原則での行き先 |
17
+ | --------------------------------------------------------------------- | ---------------------------- |
18
+ | P1 間違いを防ぐことを最優先する | `P5`・`P6`・`P7`・`P8`・`P9` |
19
+ | P2 業務の性質で機能の形を決める | `P1` |
20
+ | P3 文脈を引き継ぎ、同じことを二度言わせない | `P11`・`P6`・`P10` |
21
+ | P4 結果は終点ではなく、次の行動の起点として出す | `P10`・`P5` |
22
+ | P5 システムが代わりに動くときは、先に見せ、途中で止められ、後で戻せる | `P6` |
23
+ | P6 今の判断に要る情報だけを、段階的に開示する | `P4`・`P3`・`P2` |
24
+ | P7 システムが何をどこまで確かに知っているかを正直に示す | `P5`・`P2` |
25
+ | P8 繰り返しと修正を無駄にしない | `P11` |
26
+
27
+ - e773a29: docs(principles): PR に貼る `## UX レビュー` の確認項目を「ID ＋元の原則の名前」に（UX チェックリスト v1.4.1）
28
+
29
+ - `ux-checklist.md` §6: 確認項目の欄は `C8 誰の・誰が（患者の切り替え）` のように、ID のあとに元の原則の名前を書く。C1〜C11 の名前を一覧にした
30
+ - 集計は先頭の ID だけを読む。名前の無い `C3`（v1.4.0）や数字だけの `3`（v1.3.2 まで）も `C3` として数える
31
+ - 版を v1.4.1 に上げた（`ux-checklist.md` の見出しと §6 の例、`ux-checklist-items.md` の参照）。確認項目の追加・削除・リネームはない
32
+
33
+ - 46984b2: docs(principles): UX チェックリストに「見る範囲」を足し、並びと流れで起きる見落としを拾う（UX チェックリスト v1.5.0）
34
+
35
+ - `ux-checklist.md` §2 に「見る範囲」を足した。変えた部分 → 同じ画面に並ぶ既存の操作 → 流れ（④ を選んだとき・画面の行き来が変わるとき）の順に広げて当てる。流れは、作業を始める画面から目的を果たして戻るまでをたどる
36
+ - C1 に「違う操作は見分けがつく」を足した（同じ行に同じアイコンだけの別の操作を並べない。似た操作は「〇〇をコピー」のように対象を書く）。確かめ方を「差分＋画面」にした
37
+ - §3: 画面写真は切り抜きでなく画面全体。流れを見るときは、録画から通る画面ごとに切り出した「流れの静止画」も貼る（評価役の AI は動画を読めない）。どちらも証拠の種類は「画面写真」
38
+ - 流れを見るときは、選んだ行に無くても C1〜C4 を答える。流れの 4 つの問いは、書き先の確認項目を 1 対 1 で決めた（次に何をすれば → C4 ／ 目に入る → C2 ／ 目的に近づく → C1 ／ 進んだと分かる → C3）。§4 の C1〜C4 の本文にも、流れを見るときの問いを 1 文ずつ足した（本文だけ読んでも同じ答えになるように）
39
+ - ボタンなどの操作する部品を足す、またはその見た目や言葉を変えるときは、選んだ行に無くても C1 を足す（並ぶ操作との見分けを見るため。⑤・⑦ だけを選ぶ変更でも当たる）
40
+ - 見る範囲の 2・3 で見つかった問題も、この変更で起きたなら「いいえ（この変更で入った）」
41
+ - 冒頭の「目安は 5 分」に、流れを見るときは長くなる、と添えた
42
+ - `ux-checklist-items.md` に P3.16（並ぶ違う操作は見分けがつく）を足し、C1 に対応させた。`ux-principles.md` の P3 の Don't に例を足した
43
+ - §5: 「画面で未確認」は、貼られた画面写真・流れの静止画では確かめられないとき（動きを録画で見ていないとき）にも使える
44
+ - 節の番号（§1〜§7）と確認項目の ID・数は変えていない
45
+
46
+ - 4a8df1f: docs(principles): 体験設計原則を 11 原則にし、UX チェックリストを追加する
47
+
48
+ - `docs/principles/ux-principles.md`: 8 原則（P1〜P8）を 11 原則（共通 8・医療の拡張 3）に置き換え
49
+ - `docs/principles/ux-checklist.md`（追加）: 画面に出る変更の PR を確かめる確認項目 11 と、PR に貼る `## UX レビュー` の固定書式
50
+ - `docs/principles/ux-checklist-items.md`（追加）: 原則ごとの詳しい確認項目 80
51
+ - `docs/principles/scorecard.md`（削除）: レビューは `ux-checklist.md` を使う
52
+ - `docs/patterns/`・`docs/components/` の原則の参照を、旧番号（P1〜P8）から 11 原則の番号に付け替え
53
+
54
+ - 5713aea: docs(principles): 原則と確認項目に消えない ID を振る（UX チェックリスト v1.4.0）
55
+
56
+ - 原則は `P1`〜`P11`、チェックリストの確認項目は `C1`〜`C11`、詳しい確認項目は `P3.9` の形にした。消しても番号を詰めない決まりを `docs/principles/README.md` に書いた
57
+ - `ux-checklist.md`: 版を v1.4.0 に上げた。PR に貼る `## UX レビュー` の表は、確認項目の欄に `C3` のように ID を書く（v1.3.2 までの数字だけの `3` は `C3` と同じもの）
58
+ - `ux-checklist.md`: 「1 本あたり確認項目は 10 以下」を、「確認項目は 11 個。1 本の PR で見るのは選んだ行の分だけ」に直した
59
+ - `ux-principles.md`: P3 の詳しい確認項目の範囲を `P3.1〜P3.15` に直した（`3.13` までと書いていた）
60
+ - `docs/components/*.md`・`docs/patterns/*.md`・`information-design.md`・`runtime-environment.md`: 「原則 5」などの参照を `P5` にそろえた
61
+
3
62
  ## 0.6.0
4
63
 
5
64
  ### Minor Changes
package/DESIGN.md CHANGED
@@ -23,7 +23,7 @@ antd と Ant Design X の公開 API をそのまま再 export し、共通のテ
23
23
  | 色・寸法を決める | `docs/tokens.md` |
24
24
  | グラフを置く | `docs/patterns/chart.md`。系列色は `chartSeriesColors` |
25
25
  | 戻る・再試行・再訪の導線を決める | `docs/principles/runtime-environment.md` |
26
- | 設計や実装を見直す・採点する | `docs/principles/` |
26
+ | 設計や実装を見直す・レビューする | `docs/principles/` |
27
27
 
28
28
  ## 索引
29
29
 
@@ -48,27 +48,27 @@ antd の同名コンポーネントに既定を足したもの、および antd
48
48
 
49
49
  ### 文書
50
50
 
51
- | 文書 | 場所 |
52
- | ---------------------------- | ---------------------------------------- |
53
- | 体験設計の 8 原則と採点の枠 | `docs/principles/README.md` |
54
- | 情報設計の原則 | `docs/principles/information-design.md` |
55
- | 実行環境の前提 | `docs/principles/runtime-environment.md` |
56
- | トークンの優先順位 | `docs/tokens.md` |
57
- | Table カード | `docs/components/table.md` |
58
- | 画面骨格 5 型と区画 | `docs/patterns/skeleton.md` |
59
- | 情報の開示パターン | `docs/patterns/disclosure.md` |
60
- | 一覧と詳細 | `docs/patterns/list-detail.md` |
61
- | グラフ | `docs/patterns/chart.md` |
62
- | 区画の状態（読み込み・失敗） | `docs/patterns/region-state.md` |
63
- | 空状態 | `docs/patterns/empty-state.md` |
64
- | 印刷様式 | `docs/patterns/print.md` |
65
- | リンクの体裁 | `docs/patterns/link.md` |
66
- | Statistic カード | `docs/components/statistic.md` |
67
- | Layout カード | `docs/components/layout.md` |
68
- | Modal カード | `docs/components/modal.md` |
69
- | Drawer カード | `docs/components/drawer.md` |
70
- | チャット | `docs/components/chat.md` |
71
- | Icon カード | `docs/components/icon.md` |
51
+ | 文書 | 場所 |
52
+ | ---------------------------------- | ---------------------------------------- |
53
+ | 体験設計の 11 原則とチェックリスト | `docs/principles/README.md` |
54
+ | 情報設計の原則 | `docs/principles/information-design.md` |
55
+ | 実行環境の前提 | `docs/principles/runtime-environment.md` |
56
+ | トークンの優先順位 | `docs/tokens.md` |
57
+ | Table カード | `docs/components/table.md` |
58
+ | 画面骨格 5 型と区画 | `docs/patterns/skeleton.md` |
59
+ | 情報の開示パターン | `docs/patterns/disclosure.md` |
60
+ | 一覧と詳細 | `docs/patterns/list-detail.md` |
61
+ | グラフ | `docs/patterns/chart.md` |
62
+ | 区画の状態（読み込み・失敗） | `docs/patterns/region-state.md` |
63
+ | 空状態 | `docs/patterns/empty-state.md` |
64
+ | 印刷様式 | `docs/patterns/print.md` |
65
+ | リンクの体裁 | `docs/patterns/link.md` |
66
+ | Statistic カード | `docs/components/statistic.md` |
67
+ | Layout カード | `docs/components/layout.md` |
68
+ | Modal カード | `docs/components/modal.md` |
69
+ | Drawer カード | `docs/components/drawer.md` |
70
+ | チャット | `docs/components/chat.md` |
71
+ | Icon カード | `docs/components/icon.md` |
72
72
 
73
73
  ### 描画カタログ
74
74
 
package/docs/components/chat.md CHANGED
@@ -76,6 +76,6 @@ Ant Design X の部品は、共通既定を持たずそのまま使う。実体
76
76
 
77
77
  ## 原則との対応
78
78
 
79
- - P7（システムが何をどこまで確かに知っているかを正直に示す）: `evidence` で応答の根拠をたどれるようにし、断定的
79
+ - P5（値の確かさ）: `evidence` で応答の根拠をたどれるようにし、断定的
80
80
  な見た目だけで進めさせない
81
- - P4（結果は次の行動の起点として出す）: `onRetry` で失敗した結果をその場のやり直しに繋げる
81
+ - P10（行き止まりを作らない）: `onRetry` で失敗した結果をその場のやり直しに繋げる
package/docs/components/drawer.md CHANGED
@@ -37,7 +37,7 @@ Drawer に ToB プロダクト共通の既定が必要になったら、置き
37
37
  ## Do / Don't
38
38
 
39
39
  - Do: `getContainer={false}` で一覧の中にマウントし、一覧の文脈（スクロール位置・選択状態）を保つ
40
- - Do: Drawer 内の破壊的な変更にも P1 に従って確認を挟む
40
+ - Do: Drawer 内の破壊的な変更にも P6 に従って確認を挟む
41
41
  - Do: 幅は `size` で指定する
42
42
  - Don't: Drawer から別の Drawer を開く（入れ子にしない。2 件目が必要になったら別ページを検討する）
43
43
  - Don't: `width` / `height` / `maskClosable` を使う（非推奨。`size` / `mask.closable` に置き換える）
@@ -45,5 +45,5 @@ Drawer に ToB プロダクト共通の既定が必要になったら、置き
45
45
 
46
46
  ## 原則との対応
47
47
 
48
- - P6（今の判断に要る情報だけを、段階的に開示する）: 一覧 → Drawer で詳細に降り、それでも情報量が収まらないなら別ページへ進む。Drawer に情報を詰め込みすぎない
49
- - P3（文脈を引き継ぎ、同じことを二度言わせない）: 一覧の文脈（スクロール位置・選択状態）を保ったまま Drawer で詳細を開き、開き直すたびに一覧を探し直させない
48
+ - P4（要るものが届く）: 一覧 → Drawer で詳細に降り、それでも情報量が収まらないなら別ページへ進む。Drawer に情報を詰め込みすぎない
49
+ - P11（二度させない）: 一覧の文脈（スクロール位置・選択状態）を保ったまま Drawer で詳細を開き、開き直すたびに一覧を探し直させない
package/docs/components/icon.md CHANGED
@@ -87,8 +87,8 @@ const SolidHeart = () => (
87
87
 
88
88
  - `@ant-design/icons` のアイコンは `role="img"` と `aria-label="user"` のようなアイコン名（英語）を既定で持つ。**装飾なら `aria-hidden` を明示する**。読み上げに英語のアイコン名が漏れるのを防ぐ
89
89
  - 意味を持つアイコンは日本語の `aria-label` で上書きする。`Icon` に自前 SVG を渡した場合は既定のラベルが無いので必須
90
- - アイコンだけのボタンは `aria-label` + `Tooltip` を必ず組にする。削除などの破壊的操作はテキストラベルも出す（P1）
91
- - 意味をアイコンの形や色だけに載せない。ラベルと組にする（P7。`../principles/ux-principles.md`）
90
+ - アイコンだけのボタンは `aria-label` + `Tooltip` を必ず組にする。削除などの破壊的操作はテキストラベルも出す（P6）
91
+ - 意味をアイコンの形や色だけに載せない。ラベルと組にする（P2。`../principles/ux-principles.md`）
92
92
 
93
93
  ## Do / Don't
94
94
 
package/docs/components/layout.md CHANGED
@@ -31,5 +31,5 @@ ToB プロダクト共通の見た目は `businessTheme` の components 既定
31
31
 
32
32
  ## 原則との対応
33
33
 
34
- - P2（業務の性質で形を決める）: 骨格は業務の流れ（並行参照か手順か）で選ぶ。`../patterns/skeleton.md` の判断基準
35
- - P3（文脈を引き継ぐ）: 戻る・再訪の導線を骨格の中に持たせ、ブラウザのナビゲーションが無い環境でも辿れるようにする。`../principles/runtime-environment.md`
34
+ - P1（対象から作る）: 骨格は業務の流れ（並行参照か手順か）で選ぶ。`../patterns/skeleton.md` の判断基準
35
+ - P10（行き止まりを作らない）: 戻る・再訪の導線を骨格の中に持たせ、ブラウザのナビゲーションが無い環境でも辿れるようにする。`../principles/runtime-environment.md`
package/docs/components/modal.md CHANGED
@@ -46,4 +46,4 @@ Modal に ToB プロダクト共通の既定が必要になったら、置き場
46
46
 
47
47
  ## 原則との対応
48
48
 
49
- - P1（間違いを防ぐことを最優先する）: Modal は取り消し不可・破壊的な操作の確認と、続行に必須な選択にだけ使う。それ以外の操作に強い拘束を課さない。確認ボタンは動詞 + 対象にして、押した先に何が起きるかを一目で分かるようにする
49
+ - P6（望まない変化）: Modal は取り消し不可・破壊的な操作の確認と、続行に必須な選択にだけ使う。それ以外の操作に強い拘束を課さない。確認ボタンは動詞 + 対象にして、押した先に何が起きるかを一目で分かるようにする
package/docs/components/statistic.md CHANGED
@@ -12,7 +12,7 @@
12
12
  | 補足 | `Statistic` の直下に `Typography.Text type="secondary"` | 分母（「発行 N 件のうち」）・達成月・比較（前月比）を 1 行。文字は `fontSizeSM` |
13
13
  | 推移 | `valueRender` にスパークライン | 主数字の代わりに置くのではなく、主数字の隣に小さく。数値を読ませる面では省く |
14
14
 
15
- - 補足は必ず主数字の直下に置く。分母や定義を画面や区画の末尾にまとめて逃がさない（P7。数字だけが切り取られても意味が保たれる）
15
+ - 補足は必ず主数字の直下に置く。分母や定義を画面や区画の末尾にまとめて逃がさない（P5。数字だけが切り取られても意味が保たれる）
16
16
  - 指標名・主数字・補足を持つ面は 1 つの部品にまとめ、各画面で `Statistic` と `Typography.Text` を手で並べ直さない。置き場が画面ごとに揺れるのを防ぐ
17
17
  - 前月比は矢印（`ArrowUpOutlined` / `ArrowDownOutlined`）+ 符号付きの実数で書き、色だけで増減を示さない
18
18
  - 集計中・推定の値は確定値と同じ顔で出さない。補足に「（集計中）」を付ける
@@ -33,6 +33,6 @@
33
33
 
34
34
  原則の本文は [../principles/ux-principles.md](../principles/ux-principles.md)。
35
35
 
36
- - P4（結果を次の行動の起点に）: 分母と比較が数字の隣にあるので、次に何を見るかがその場で決まる
37
- - P6（段階的開示）: 面には主数字と 1 行の補足まで。内訳は区画の表に降りたときに見せる
38
- - P7（確かさを正直に）: 分母・定義・集計中を主数字の直下で示す
36
+ - P10（行き止まりを作らない）: 分母と比較が数字の隣にあるので、次に何を見るかがその場で決まる
37
+ - P4（要るものが届く）: 面には主数字と 1 行の補足まで。内訳は区画の表に降りたときに見せる
38
+ - P5（値の確かさ）: 分母・定義・集計中を主数字の直下で示す
package/docs/components/table.md CHANGED
@@ -44,7 +44,7 @@ antd の props（`sticky` / `scroll` / `columns[].width` / `rowSelection` / `exp
44
44
  - Don't: 行に focusable な要素が 1 つも無い一覧でキーボードから到達する必要がある操作を `revealOnHover` に置く
45
45
  （`revealOnHover` は hover に加えて行内の要素へフォーカスが入ったときにも現れるが、フォーカスが行に入る経路
46
46
  自体が無ければ到達できない。その場合は常時表示の列にする）
47
- - 取り消しにくい操作（削除）は常時表示でも `Popconfirm` を挟む（P1）
47
+ - 取り消しにくい操作（削除）は常時表示でも `Popconfirm` を挟む（P6）
48
48
  - 3 つ以上のアクションは Dropdown に畳む
49
49
  - Don't: `revealOnHover` と overlay（`Popconfirm` / `Dropdown` / `Select`）を組み合わせる
50
50
  （overlay は既定で `document.body` に portal されるため、確認ボタンなど overlay の中へフォーカスが移ると
@@ -147,7 +147,7 @@ antd の props（`sticky` / `scroll` / `columns[].width` / `rowSelection` / `exp
147
147
  - 数値の列は `align: "right"`。桁がそろって縦に読める。`render` で `font-variant-numeric: tabular-nums` を当てると桁幅もそろう
148
148
  - 単位は列見出しに書く（「セッション数（回）」）。セルの値に単位を繰り返さない
149
149
  - 合計行は `summary` で描く。データの先頭行や末尾行に「合計」を混ぜない（並べ替え・ページングで位置が動く。`summary` は動かない）
150
- - 前月比などの増減は矢印 + 符号付きの実数で書き、色だけで示さない（P7）
150
+ - 前月比などの増減は矢印 + 符号付きの実数で書き、色だけで示さない（P2）
151
151
  - 集計中の期間の列・行は見出しに「（集計中）」を付け、確定値と同じ顔で出さない
152
152
  - 行内で値を比べる横棒（`Progress`）を置くなら、基準は表示中の全行の最大値にし、数値を必ず併記する。横棒だけの列にしない
153
153
  - 分類 × 期間のピボット表は先頭列（分類名）を `fixed: "left"` にし、期間の列は同じ `width` にする。「未設定」「未分類」のような残余の行は末尾に固定し、並べ替えの対象から外す
@@ -168,7 +168,7 @@ antd の props（`sticky` / `scroll` / `columns[].width` / `rowSelection` / `exp
168
168
  - Do: すべての列に幅の意図を与え、可変列を 1 つだけ残す
169
169
  - Do: fixed layout の表には `scroll={{ x }}` を渡す（潰すより横スクロールを選ぶ）
170
170
  - Do: 表の中のコントロール（リンク・ボタン・入力）は `fontSize: "inherit"` で表の文字サイズ（14px）を継がせる（`Typography` は `Table` が継がせる。`Tag` と `Title` は対象外）
171
- - Do: 状態は `Tag` の色 + ラベルで示す（色だけに頼らない。P7）
171
+ - Do: 状態は `Tag` の色 + ラベルで示す（色だけに頼らない。P2）
172
172
  - Do: 空状態は antd の既定（`Empty`）に任せる。文言だけ `locale.emptyText` で差し替える。集計が 0 の表は空状態ではなく 0 を出す（`../patterns/empty-state.md`）
173
173
  - Do: 数値の列は右寄せ、単位は列見出し、合計は `summary`
174
174
  - Don't: 行に `cursor: pointer` を付ける
@@ -181,10 +181,10 @@ antd の props（`sticky` / `scroll` / `columns[].width` / `rowSelection` / `exp
181
181
 
182
182
  ## 原則との対応
183
183
 
184
- - P1（間違いを防ぐ）: 削除など取り消しにくい操作は `rowActions` の中でも `Popconfirm` を挟む
185
- - P4（結果を次の起点に）: 識別列のリンクや遷移ボタンの先に詳細と次の操作がある
186
- - P6（段階的開示）: 常時表示する列は「一覧で判断に要るもの」だけ。残りは詳細へ
187
- - P7（色だけに頼らない）: リンクは色だけでなくテキストの位置と文脈で識別させる
184
+ - P6（望まない変化）: 削除など取り消しにくい操作は `rowActions` の中でも `Popconfirm` を挟む
185
+ - P10（行き止まりを作らない）: 識別列のリンクや遷移ボタンの先に詳細と次の操作がある
186
+ - P4（要るものが届く）: 常時表示する列は「一覧で判断に要るもの」だけ。残りは詳細へ
187
+ - P3（言葉と部品をそろえる）: リンクは色だけでなくテキストの位置と文脈で識別させる
188
188
 
189
189
  ## 0.3.x からの移行
190
190
 
package/docs/patterns/chart.md CHANGED
@@ -42,7 +42,7 @@
42
42
  - 同じ系列を主・従の 2 値に割るとき（テンプレート / 自由入力、手動 / 自動など）は `cool[i].base` と `cool[i].shade` を組で使う。`shade` を単独の系列に使わない。`shade` が `null` の位置は 2 値の内訳に使わない
43
43
  - 「（未設定）」は `neutral.unset`、「その他」は `neutral.other`、系列に属さない全体の線（合計・率）は `neutral.total`
44
44
  - 凡例の文字は本文の文字色で書く。系列色で文字を書かない（薄い系列で読めなくなる）
45
- - 集計中・未確定の期間は塗りの不透明度を `opacityLoading` に落とし、軸ラベルに「（集計中）」を併記する。色だけに頼らない（P7）
45
+ - 集計中・未確定の期間は塗りの不透明度を `opacityLoading` に落とし、軸ラベルに「（集計中）」を併記する。色だけに頼らない（P5）
46
46
  - `chartSeriesColors` のテストが守るのはこのパッケージの中だけ。画面側では、グラフを描くファイルに 16 進や描画ライブラリの既定色名が無いことを lint か test で検査する
47
47
 
48
48
  ## 軸・目盛・文字
@@ -77,8 +77,8 @@
77
77
 
78
78
  原則の本文は [../principles/ux-principles.md](../principles/ux-principles.md)。
79
79
 
80
- - P4（結果を次の行動の起点に）: 表と [画像を保存] で、見た数字をそのまま次の作業に持ち出せる
81
- - P6（段階的開示）: 系列は上位 N + その他に畳み、全系列は表に降りたときに見せる
82
- - P7（確かさを正直に）: 集計中の期間は別塗り + ラベル、未設定は専用の系列で混ぜない
80
+ - P10（行き止まりを作らない）: 表と [画像を保存] で、見た数字をそのまま次の作業に持ち出せる
81
+ - P4（要るものが届く）: 系列は上位 N + その他に畳み、全系列は表に降りたときに見せる
82
+ - P5（値の確かさ）: 集計中の期間は別塗り + ラベル、未設定は専用の系列で混ぜない
83
83
 
84
84
  実演: `Stacked`（積み上げ。集計中の月あり）/ `Grouped`（平均なので積まない）/ `AllZero`（全 0。表を主に）/ `Palette`（系統・中立・印刷ランプの一覧）。
package/docs/patterns/disclosure.md CHANGED
@@ -122,6 +122,6 @@ Modal より軽量な確認。説明が 1〜2 行に収まる、行内で完結
122
122
 
123
123
  ## 原則との対応
124
124
 
125
- - P1（間違いを防ぐことを最優先する）: Modal・Popconfirm は取り消し不可・破壊的な操作の確認にだけ使う。それ以外の操作に強い拘束を課さない
126
- - P6（今の判断に要る情報だけを、段階的に開示する）: Tooltip → Popover → Drawer / インライン展開 → 別ページの順で開示量が増える層を、業務に必要な分だけ選ぶ
127
- - P7（システムが何をどこまで確かに知っているかを正直に示す）: 中間状態に明示的な名前と形を与えることは、確定していない状態を確定した顔で出さないことの具体化
125
+ - P6（望まない変化）: Modal・Popconfirm は取り消し不可・破壊的な操作の確認にだけ使う。それ以外の操作に強い拘束を課さない
126
+ - P4（要るものが届く）: Tooltip → Popover → Drawer / インライン展開 → 別ページの順で開示量が増える層を、業務に必要な分だけ選ぶ
127
+ - P2（いまの状態）: 中間状態に明示的な名前と形を与えることは、確定していない状態を確定した顔で出さないことの具体化
package/docs/patterns/empty-state.md CHANGED
@@ -14,7 +14,7 @@
14
14
 
15
15
  ## 理由と次の行動の置き場
16
16
 
17
- - 空の理由と次の行動は、空になっている数字・表のすぐ隣に置く。画面や区画の末尾にまとめて書かない（P4「次にできる操作を結果の近くに置く」）
17
+ - 空の理由と次の行動は、空になっている数字・表のすぐ隣に置く。画面や区画の末尾にまとめて書かない（P10「行き止まりで業務を止めない」）
18
18
  - 1 文で書く。「〈理由〉。〈次の行動〉」の順。例: 「まだ利用が始まっていません。利用者にアカウントの案内を送ると数字が動き始めます」
19
19
  - 次の行動が画面内の操作なら `Button`、別画面なら `Button type="link"` を文の直後に置く。動詞で始める
20
20
  - 「未設定」「未分類」のような残余の分類が最大になるときは、空ではないが同じ扱いで「分類を登録すると内訳が読めるようになります」と登録先への導線を数字の隣に置く
@@ -33,5 +33,5 @@
33
33
 
34
34
  原則の本文は [../principles/ux-principles.md](../principles/ux-principles.md)。
35
35
 
36
- - P4（結果を次の行動の起点に）: 空を行き止まりにせず、理由と次の行動を数字の隣に置く
37
- - P7（確かさを正直に）: 0 と「取得できていない」を別の顔で出す
36
+ - P10（行き止まりを作らない）: 空を行き止まりにせず、理由と次の行動を数字の隣に置く
37
+ - P5（値の確かさ）: 0 と「取得できていない」を別の顔で出す
package/docs/patterns/link.md CHANGED
@@ -49,5 +49,5 @@
49
49
 
50
50
  原則の本文は [../principles/ux-principles.md](../principles/ux-principles.md)。
51
51
 
52
- - P1（間違いを防ぐ）: 押せるものが同じ体裁で揃い、押せないものと見分けられる
53
- - P7（確かさを正直に）: 状態の手がかりを、色の薄さのような読み取りにくい信号に載せない
52
+ - P3（言葉と部品をそろえる）: 押せるものが同じ体裁で揃い、押せないものと見分けられる
53
+ - P2（いまの状態）: 状態の手がかりを、色の薄さのような読み取りにくい信号に載せない
package/docs/patterns/list-detail.md CHANGED
@@ -65,8 +65,8 @@
65
65
 
66
66
  ## 原則との対応
67
67
 
68
- - P2（業務の性質で機能の形を決める）: 対象の本性に応じて必要な相だけを作る判断は P2 の具体化
69
- - P3（文脈を引き継ぎ、同じことを二度言わせない）: 一覧の文脈（スクロール位置・絞り込み・選択）を保ったまま詳細を開閉する
70
- - P4（結果は次の行動の起点として出す）: 詳細に対象へのアクションを並べ、見るだけで終わらせない
71
- - P6（今の判断に要る情報だけを、段階的に開示する）: 一覧に置く列を絞り、残りは詳細へ送る
72
- - P1（間違いを防ぐことを最優先する）: 詳細のアクションのうち取り消し不可な操作は、確認を挟むかどうかを [./disclosure.md](./disclosure.md) の判断に従って決める
68
+ - P1（対象から作る）: 対象の本性に応じて必要な相だけを作る判断は P1 の具体化
69
+ - P11（二度させない）: 一覧の文脈（スクロール位置・絞り込み・選択）を保ったまま詳細を開閉する
70
+ - P10（行き止まりを作らない）: 詳細に対象へのアクションを並べ、見るだけで終わらせない
71
+ - P4（要るものが届く）: 一覧に置く列を絞り、残りは詳細へ送る
72
+ - P6（望まない変化）: 詳細のアクションのうち取り消し不可な操作は、確認を挟むかどうかを [./disclosure.md](./disclosure.md) の判断に従って決める
package/docs/patterns/print.md CHANGED
@@ -12,20 +12,20 @@
12
12
 
13
13
  - 画面専用（操作の部品）と印刷専用（見出しの番号・各頁のフッタ）を、それぞれ 1 つの class（`screenOnly` / `printOnly`）で切り替える。個々の部品に条件分岐を書かない
14
14
  - 印刷から外すもの: ナビゲーション・アンカー・絞り込み・ボタン・読み込み中の表示・再試行・Drawer など開いていない開示。残すもの: 見出し・補足・数字・表・グラフ・脚注
15
- - 読み込みが終わっていない区画は印刷しない。数字の代わりに「この区画は取得できなかったため掲載していません」を印字し、0 と見分けがつくようにする（P7）
15
+ - 読み込みが終わっていない区画は印刷しない。数字の代わりに「この区画は取得できなかったため掲載していません」を印字し、0 と見分けがつくようにする（P5）
16
16
  - 画面側の骨格が高さを固定してスクロールを内側に閉じ込めている（`height: 100vh` / `overflow: hidden`）と、1 頁目しか印刷されない。`@media print` で骨格の高さ制約と `overflow` を解き、サイドバーを非表示にして本文を文書の流れに戻す。印刷用の DOM を骨格の外に二重に置く案は採らない（状態の共有が煩雑になる）
17
17
 
18
18
  ## 頁の組み方
19
19
 
20
20
  - `@page` で用紙と余白を宣言する。紙の寸法（A4 の幅・余白の mm）はトークンに無い物理量なので、寸法の値を書かない約束の例外として CSS に書いてよい。理由をコメントに残す
21
21
  - 区画の見出しだけが前頁の末尾に残らないよう、見出しに `break-after: avoid`。表は途中で改ページしてよい（`break-inside: auto`）。1 区画が 1 頁に収まるときだけ `break-inside: avoid`
22
- - 各頁のフッタにデータ基準日と条件（期間・絞り込み）を繰り返す。`position: fixed` で下端に置き、本文の末尾に同じ高さの余白を取る。頁が切り離されても、どの時点の値かが分かる（P7）
22
+ - 各頁のフッタにデータ基準日と条件（期間・絞り込み）を繰り返す。`position: fixed` で下端に置き、本文の末尾に同じ高さの余白を取る。頁が切り離されても、どの時点の値かが分かる（P5）
23
23
  - 表紙は作らない。1 頁目の先頭に画面タイトル・対象・出力日を置く
24
24
  - 段組は印刷幅を基準にする。antd の `Row` / `Col` のブレークポイントは window 幅で決まるので、Storybook の広い window で確認した段組と紙の段組が一致しない。印刷側は CSS の grid で列数を固定する
25
25
 
26
26
  ## 色と文字
27
27
 
28
- - 白黒で印刷されることを前提にする。系列の見分けは表が担う（`./chart.md`「表を必ず併置する」「モノクロ印刷」）。状態は色だけでなく文字で示す（P7）
28
+ - 白黒で印刷されることを前提にする。系列の見分けは表が担う（`./chart.md`「表を必ず併置する」「モノクロ印刷」）。状態は色だけでなく文字で示す（P2）
29
29
  - 文字サイズは画面と同じトークンを使う。印刷用に小さくしない
30
30
  - 背景色の面（`Card` の影・ページ背景）は印刷では外す。面の区切りは罫線（`colorBorderSecondary`）で示す
31
31
 
@@ -39,6 +39,6 @@
39
39
 
40
40
  原則の本文は [../principles/ux-principles.md](../principles/ux-principles.md)。
41
41
 
42
- - P4（結果を次の行動の起点に）: 紙に持ち出しても条件と基準日が付いて回り、そのまま報告・申請に使える
43
- - P6（段階的開示）: 操作の部品を外し、読むための層だけを残す
44
- - P7（確かさを正直に）: 取得できなかった区画は「掲載していません」と印字し、基準日を各頁に繰り返す
42
+ - P10（行き止まりを作らない）: 紙に持ち出しても条件と基準日が付いて回り、そのまま報告・申請に使える
43
+ - P4（要るものが届く）: 操作の部品を外し、読むための層だけを残す
44
+ - P5（値の確かさ）: 取得できなかった区画は「掲載していません」と印字し、基準日を各頁に繰り返す
package/docs/patterns/region-state.md CHANGED
@@ -13,11 +13,11 @@
13
13
 
14
14
  - `Skeleton` の形を中身に合わせる。数値の面（`Statistic` の列）なら面の数だけ短い行、表なら列見出し + 数行、グラフなら固定高さの面。一律 `paragraph rows` で済ませない（読み込み後に画面が動く）
15
15
  - 高さは読み込み後と同じにし、描画が終わっても位置がずれないようにする
16
- - 画面全体の `Spin` で覆わない。他の区画は読める状態を保つ（P2）
16
+ - 画面全体の `Spin` で覆わない。他の区画は読める状態を保つ（P1）
17
17
 
18
18
  ## 失敗
19
19
 
20
- - 数字を出さない。失敗した区画は `Alert type="error"` に置き換え、0 と見分けがつく状態にする（P7）
20
+ - 数字を出さない。失敗した区画は `Alert type="error"` に置き換え、0 と見分けがつく状態にする（P5）
21
21
  - 文言の型: 見出しは「〈区画名〉の集計を取得できませんでした」、本文は「この区画だけが取得に失敗しています。他の区画の数字はそのまま使えます」。何が失敗し、何は使えるかを 1 文ずつ
22
22
  - 再試行は `Alert` の `action` に `Button size="small"` で置く。区画の外や画面の上部に置かない（失敗の場所と操作の場所を一致させる）
23
23
  - 再試行が無い（自動で再取得する・利用者に手段が無い）ときはボタンを出さず、本文に「しばらくしてから開き直してください」を足す
@@ -33,6 +33,6 @@
33
33
 
34
34
  原則の本文は [../principles/ux-principles.md](../principles/ux-principles.md)。
35
35
 
36
- - P1（間違いを防ぐ）: 失敗を 0 と誤読させない。数字の代わりに `Alert`
37
- - P2（業務の性質で形を決める）: 並行して読み比べる画面では、失敗した区画だけを止め、他は使える状態を保つ
38
- - P7（確かさを正直に）: 取得できていないものを取得できた顔で出さない
36
+ - P5（値の確かさ）: 失敗を 0 と誤読させない。数字の代わりに `Alert`
37
+ - P1（対象から作る）: 並行して読み比べる画面では、失敗した区画だけを止め、他は使える状態を保つ
38
+ - P2（いまの状態）: 取得できていないものを取得できた顔で出さない
package/docs/patterns/skeleton.md CHANGED
@@ -52,9 +52,9 @@ Tabs は Content の先頭に置き、メインナビゲーションとして機
52
52
 
53
53
  - 区画 = 見出し + 1 行の補足 + 白地の面（`Card`）の列。面は Content の背景の上に浮かせる（「背景と面の使い分け」）。面の中に区画の見出しを入れない
54
54
  - 見出しのサイズは `Typography.Title` の `level` で固定する。画面タイトル `level={3}` → 区画の見出し `level={4}` → 面の中の小見出し `level={5}` → 補足は `Typography.Text type="secondary"` に `fontSizeSM`（`../tokens.md`）。数値 1 枚の面（`Statistic`）では `title` が指標名を担うので、`level={5}` を重ねない
55
- - 同じ層の区画は同じ部品・同じ `level` で描く（P6「同じ層の中では情報の見え方をそろえる」）。区画の見出しを `Card` の `title` で代用しない。`Card` のヘッダは文字サイズが別に決まっていて、隣の区画の `Title` と揃わない
55
+ - 同じ層の区画は同じ部品・同じ `level` で描く（P3「同じものは、同じ言葉・同じ部品・同じ出し方で示す」）。区画の見出しを `Card` の `title` で代用しない。`Card` のヘッダは文字サイズが別に決まっていて、隣の区画の `Title` と揃わない
56
56
  - 余白はトークンで書く。区画と区画の間は `marginXL`、区画の中の面と面の間は `marginMD`、見出しと補足の間は `marginXXS` を目安にする
57
- - 読み込みと失敗は区画単位にする。1 つの区画が失敗しても他の区画は表示し、失敗した区画は数字を出さずに `Alert` にする（0 と見分けがつく状態にする。P7）
57
+ - 読み込みと失敗は区画単位にする。1 つの区画が失敗しても他の区画は表示し、失敗した区画は数字を出さずに `Alert` にする（0 と見分けがつく状態にする。P5）
58
58
  - 開閉は既定で開いたまま。閉じられるようにするなら区画すべてを `Collapse` で統一し、既定を開にする。閉じた状態を保存・復元する「モード」にしない
59
59
 
60
60
  ### 区画へのアンカー
@@ -78,6 +78,6 @@ Tabs は Content の先頭に置き、メインナビゲーションとして機
78
78
 
79
79
  ## 原則との対応
80
80
 
81
- - P2（業務の性質で形を決める）: 並行参照が多い業務は固定サイドバー、単一の手順を通す業務はヘッダーのみ
82
- - P6（段階的開示）: モーダルドロワーはナビを隠して画面領域を主対象に使う判断。区画は同じ層の見出しを同じ `level` でそろえ、面の中に降りたときだけ詳細を見せる
83
- - P7（確かさを正直に）: 区画単位の失敗は数字を出さず `Alert` にし、0 と見分けがつく状態にする
81
+ - P1（対象から作る）: 並行参照が多い業務は固定サイドバー、単一の手順を通す業務はヘッダーのみ
82
+ - P4（要るものが届く）: モーダルドロワーはナビを隠して画面領域を主対象に使う判断。区画は同じ層の見出しを同じ `level` でそろえ、面の中に降りたときだけ詳細を見せる
83
+ - P5（値の確かさ）: 区画単位の失敗は数字を出さず `Alert` にし、0 と見分けがつく状態にする
package/docs/principles/README.md CHANGED
@@ -4,19 +4,53 @@ ubie-vitals-business を使う ToB プロダクトの「どう作るか」を決
4
4
 
5
5
  npm パッケージ `@ubie/vitals-ui-business` に同梱され、利用側からは `node_modules/@ubie/vitals-ui-business/docs/principles/` で読める。
6
6
 
7
- | ファイル | 内容 |
8
- | -------------------------------------------------- | ---------------------------------------------------------------------------------------- |
9
- | [ux-principles.md](./ux-principles.md) | 体験設計の 8 原則（P1〜P8） |
10
- | [scorecard.md](./scorecard.md) | 8 原則で設計と実装を採点する枠 |
11
- | [information-design.md](./information-design.md) | 採用した IA / OOUI の原則（P2 / P6 の具体化） |
12
- | [runtime-environment.md](./runtime-environment.md) | 実行環境の前提。ブラウザのナビゲーションとブックマークが使えない環境（P3 / P8 の具体化） |
7
+ | ファイル | 内容 |
8
+ | -------------------------------------------------- | ----------------------------------------------------------------------------------------- |
9
+ | [ux-principles.md](./ux-principles.md) | 体験設計の 11 原則（共通 8・医療の拡張 3） |
10
+ | [ux-checklist.md](./ux-checklist.md) | UX チェックリスト。画面に出る変更の PR を 11 原則で確かめる 1 枚と、PR に貼る形 |
11
+ | [ux-checklist-items.md](./ux-checklist-items.md) | 原則ごとの詳しい確認項目（大きな変更・新しい画面・設計の段階で使う） |
12
+ | [information-design.md](./information-design.md) | 採用した IA / OOUI の原則（P1・P2・P4 の具体化） |
13
+ | [runtime-environment.md](./runtime-environment.md) | 実行環境の前提。ブラウザのナビゲーションとブックマークが使えない環境（P10・P11 の具体化） |
13
14
 
14
- ## 参照元
15
+ ## 使い方
15
16
 
16
- - medinavi-agent `/design`（`ia-design` skill）: 設計時に採点し、Spec PR の Screen Design 節に書く
17
- - medinavi-agent `/build`: 実装後に採点し、実装 PR 本文に書く
18
- - 各プロダクトの実装ルール（例: aimon-genius-fe `.claude/rules/antd-ui.md`）
17
+ - 設計するとき: 各原則の「こんな変更のときに開く」から当てはまる原則を読み、設計の段階で見る確認項目（[ux-checklist-items.md](./ux-checklist-items.md) の「いつ」が設計時のもの）を spec で満たす
18
+ - PR を出すとき: [ux-checklist.md](./ux-checklist.md) で答え、PR 本文に `## UX レビュー` の表を貼る
19
+ - 各プロダクトの実装ルール（例: aimon-genius-fe `.claude/rules/antd-ui.md`）から参照してよい
20
+
21
+ ## 番号（消えない ID）
22
+
23
+ 原則・確認項目には、ほかの文書・PR・別のリポジトリから参照するための ID を振っている。ID は一度振ったら変えない。
24
+
25
+ | 対象 | ID の形 | 例 |
26
+ | ------------------------------------------------------------------ | ----------------------- | ------ |
27
+ | 原則（[ux-principles.md](./ux-principles.md)） | `P` ＋番号 | `P7` |
28
+ | チェックリストの確認項目（[ux-checklist.md](./ux-checklist.md)） | `C` ＋番号 | `C8` |
29
+ | 詳しい確認項目（[ux-checklist-items.md](./ux-checklist-items.md)） | 原則の ID ＋ `.` ＋番号 | `P7.2` |
30
+ | チェックリストの「変えたこと」 | 丸数字 | `⑥` |
31
+
32
+ - 消しても番号を詰めない。消した番号は欠番にして、二度と使わない（例: `P3.2`・`P3.3` は欠番）
33
+ - 足すときは、その種類の最後の番号の次を使う。間に差し込まない
34
+ - 中身を大きく変えて別のものになったら、元の ID を欠番にして新しい ID を振る。言い回しを直すだけなら ID はそのまま
35
+ - 参照するときは ID で書く（「原則 5」「確認項目 3」ではなく `P5`・`C3`）。v1.3.2 までのチェックリストの数字だけの確認項目（`3`）は `C3` と同じもの
36
+
37
+ ### 0.6.0 までの番号（8 原則）
38
+
39
+ `@ubie/vitals-ui-business` 0.6.0 までは原則が 8 個（P1〜P8）で、いまと同じ番号が別の原則を指していた。ID を変えない決まりは 11 原則から始めたもので、それより前の番号には当てはまらない。
40
+
41
+ 0.6.0 までの番号で書かれた参照は、下の表で読み替える。行き先が複数あるものは、参照している文の意味で選ぶ。
42
+
43
+ | 0.6.0 までの ID | 0.6.0 までの原則 | 11 原則での行き先 |
44
+ | --------------- | ------------------------------------------------------------------ | ---------------------------- |
45
+ | P1 | 間違いを防ぐことを最優先する | `P5`・`P6`・`P7`・`P8`・`P9` |
46
+ | P2 | 業務の性質で機能の形を決める | `P1` |
47
+ | P3 | 文脈を引き継ぎ、同じことを二度言わせない | `P11`・`P6`・`P10` |
48
+ | P4 | 結果は終点ではなく、次の行動の起点として出す | `P10`・`P5` |
49
+ | P5 | システムが代わりに動くときは、先に見せ、途中で止められ、後で戻せる | `P6` |
50
+ | P6 | 今の判断に要る情報だけを、段階的に開示する | `P4`・`P3`・`P2` |
51
+ | P7 | システムが何をどこまで確かに知っているかを正直に示す | `P5`・`P2` |
52
+ | P8 | 繰り返しと修正を無駄にしない | `P11` |
19
53
 
20
54
  ## 変え方
21
55
 
22
- 原則や採点の枠を変えるときは、このディレクトリへの PR に `@ubie/vitals-ui-business` の changeset（patch）を付ける。changeset が無いと npm に出ず、利用側から新しい内容が読めない。
56
+ 原則やチェックリストを変えるときは、このディレクトリへの PR に `@ubie/vitals-ui-business` の changeset（patch）を付ける。changeset が無いと npm に出ず、利用側から新しい内容が読めない。確認項目を変えたら、[ux-checklist.md](./ux-checklist.md) の版を上げる。
package/docs/principles/information-design.md CHANGED
@@ -1,7 +1,7 @@
1
1
  # 情報設計の原則（採用したもの）
2
2
 
3
- この文書は、8 原則のうち P2（業務の性質で機能の形を決める）と P6（今の判断に要る情報だけを段階的に開示する）を、情報設計の語彙で具体化したもの。
4
- 採点は 8 原則で行い、この文書は新しい採点軸を作らない。原則の一覧は [./ux-principles.md](./ux-principles.md)、採点は [./scorecard.md](./scorecard.md) を参照。
3
+ この文書は、11 原則のうち P1（対象から作る）・P2（いまの状態）・P4（要るものが届く）を、情報設計の語彙で具体化したもの。
4
+ この文書は新しい原則を作らない。原則の一覧は [./ux-principles.md](./ux-principles.md)、レビューは [./ux-checklist.md](./ux-checklist.md) を参照。
5
5
 
6
6
  ## 1. 情報 > 機能 > フォーム
7
7
 
@@ -46,7 +46,7 @@
46
46
  | 定型手順（対象が固定・単一、操作が制度で決まっている） | タスク指向（手続き的） | 手順を最後まで完了させる必要があり、逸脱が業務上の不整合を招く |
47
47
  | 業務モードは決まっているが、対象操作は自由 | モード前置型 | 業務モードを選んでから対象を特定し、その先は選ばれた業務の文脈でアクションが並ぶ |
48
48
 
49
- どの型に当てはまるか決められないときはモードレスを採る（P2 の既定）。モーダルダイアログを置くのは、下記 A〜E の条件を満たすときだけ。
49
+ どの型に当てはまるか決められないときはモードレスを採る（P1 の既定）。モーダルダイアログを置くのは、下記 A〜E の条件を満たすときだけ。
50
50
 
51
51
  ここで決めるのは相互作用の型（業務モード）で、画面の骨格（Header / Sider / Content の組み合わせ）は別の軸で選ぶ。骨格の選び方は [../patterns/skeleton.md](../patterns/skeleton.md)。
52
52
 
@@ -88,7 +88,7 @@
88
88
 
89
89
  ## 原則との対応
90
90
 
91
- - §1（情報 > 機能 > フォーム）と §2（名詞 → 動詞）は P2 の前提: 機能の形を決める前に、情報構造とオブジェクトをフォームより先に決める
92
- - §3・§4（モードレスを既定にし、モーダルダイアログは条件で正当化する／業務フローを画面手順に写さない）は P2 そのものの判定手順: 業務タスクの性質（業務モード）で相互作用の型を選び、手順を画面に固定しない
93
- - §5（ナビゲーションは地面）は P6 の具体化: 段階的開示の土台になるナビゲーションを安定させ、層をまたいで動かさない
94
- - §6（命名）も P6 の具体化: ラベルから中身が予測できることが、開示の最初の層（通知・概要）の質を決める
91
+ - §1（情報 > 機能 > フォーム）と §2（名詞 → 動詞）は P1 の前提: 機能の形を決める前に、情報構造とオブジェクトをフォームより先に決める
92
+ - §3・§4（モードレスを既定にし、モーダルダイアログは条件で正当化する／業務フローを画面手順に写さない）は P1 そのものの判定手順: 業務タスクの性質（業務モード）で相互作用の型を選び、手順を画面に固定しない
93
+ - §5（ナビゲーションは地面）は P2 の具体化: 段階的開示の土台になるナビゲーションを安定させ、層をまたいで動かさない
94
+ - §6（命名）も P1 の具体化: ラベルから中身が予測できることが、開示の最初の層（通知・概要）の質を決める
package/docs/principles/runtime-environment.md CHANGED
@@ -1,7 +1,7 @@
1
1
  # 実行環境の前提（ブラウザのナビゲーションとブックマーク）
2
2
 
3
3
  この文書は、利用者の実行環境が持つ制約のうち、画面の設計に効くものを置く面。今は 1 つ、戻る・進む・リロード・アドレスバー・ブックマークバー（以下まとめて「ブラウザのナビゲーション」）が画面に無い環境でも成立する画面にするための前提と帰結を持つ。
4
- 採点は 8 原則で行い、この文書は新しい採点軸を作らない。原則の一覧は [./ux-principles.md](./ux-principles.md)、採点は [./scorecard.md](./scorecard.md) を参照。
4
+ この文書は新しい原則を作らない。原則の一覧は [./ux-principles.md](./ux-principles.md)、レビューは [./ux-checklist.md](./ux-checklist.md) を参照。
5
5
  判断表の側でこの前提が効く箇所には、[../patterns/disclosure.md](../patterns/disclosure.md)・[../patterns/list-detail.md](../patterns/list-detail.md)・[../patterns/skeleton.md](../patterns/skeleton.md)・[../components/drawer.md](../components/drawer.md) に注記がある。
6
6
 
7
7
  ## 1. 前提
@@ -47,7 +47,7 @@ Ubie の ToB プロダクトの導入先でも、次の 2 つが実際に報告
47
47
 
48
48
  ## 原則との対応
49
49
 
50
- 原則の本文は [./ux-principles.md](./ux-principles.md)。新しい採点軸は作らず、次の 2 つに紐づく。
50
+ 原則の本文は [./ux-principles.md](./ux-principles.md)。次の 2 つに紐づく。
51
51
 
52
- - P3（文脈を引き継ぎ、同じことを二度言わせない）: 戻れない環境で文脈を捨てると、利用者は入力と選択をやり直す（§2-1・§2-3）
53
- - P8（繰り返しと修正を無駄にしない）: 再読み込みで復帰する設計は、リロードできない環境で入力を捨てる（§2-2）
52
+ - P10（行き止まりを作らない）: 戻れない環境で文脈を捨てると、利用者は入力と選択をやり直す（§2-1・§2-3）
53
+ - P11（二度させない）: 再読み込みで復帰する設計は、リロードできない環境で入力を捨てる（§2-2）