状態と操作を分離する
保存操作に状態変更を混ぜず、状態は状態として独立させる。
「下書き保存」と「確定保存」のように、保存ボタンが複数あるなら、設計を見直すきっかけかもしれません。
ユーザーのゴール達成にどう寄与するか: 「内容を直したい」と「状態を進めたい」を別々に実行できる。「柔軟に作業を進めたい」というゴールに直結する。
なぜこの考え方か
Section titled “なぜこの考え方か”| 混在させる設計 | 分離する設計 |
|---|---|
| 下書き保存ボタン / 確定保存ボタン | 保存ボタン1つ + ステータス切替 |
| 保存時に状態が決まる | 状態はいつでも変更できる |
| 「状態を変えるために編集モードにする」 | 状態変更は参照モードでも可能 |
保存操作に状態変更を混ぜると、「状態を変えるためだけに編集モードにする」という不自然な操作が発生することがあります。
避けたい構造
Section titled “避けたい構造”
保存ボタンは1つ
Section titled “保存ボタンは1つ”- 保存ボタンを押したら、現在の状態のまま保存される
- 状態を変えたいなら、状態変更の操作を別途行う
状態変更は参照モードでも可能
Section titled “状態変更は参照モードでも可能”- ステータスバッジをクリックして状態を切り替える
- 編集モードに入らなくても状態変更できる
API設計の例
Section titled “API設計の例”PUT /items/:id → 内容を更新（状態は変えない）PATCH /items/:id/status → 状態のみ変更避けたいこと
Section titled “避けたいこと”- 「下書き保存」「確定保存」のように保存ボタンを複数用意する
- 保存操作に状態変更を暗黙的に含める
- 状態を変えるために編集モードを経由させる