グループ表記はマイページに既にあります
アプリ正典のベースラインHTMLを確認したところ、マイページに グループA のバッジと「提出グループ グループA（毎月8日締切）」の行がありました。ただし表記ゆれが3つあります。ベースラインは「グループA」、Notionの業務側は「Aグループ」。さらにベースラインの締切が「毎月8日」で、Notionの資料提出期限（P1・P2は月末、P3は翌年1/10）と一致しません。どちらが正なのか確認が要ります。このギャラリーは業務側に合わせて「Aグループ」「月末〆」で作っています。
R
右側にすべて集約（縦に伸びない形）
グループ・フェーズ・対象月・提出期限を、見出しの右だけで完結させた5案です。セグメントを下にフル幅で置いていた前回より、カードの高さが約35px縮んでいます。
R-12段（グループ＋P／期間・期限）推奨
1段目にグループとフェーズ、2段目に対象月と提出期限。見出しの高さの中にほぼ収まるので、縦がいちばん伸びません。読む順番も、自分の所属からいまの期、対象月、期限へと自然に流れます。
R-22段（グループ・期間／P・期限）
1段目に文字情報、2段目にフェーズと期限を置いた案。セグメントが下にくるぶん、下のステップ行との距離が近くなります。
R-31段（最小）
対象月を省いて1行に収めた案。高さは最小ですが、P2が何月分かは画面から読み取れなくなります。
R-4ミニプラン（P1なし）
フェーズが2つしかないミニプランでも、R-1と同じレイアウトのまま収まります。枠の数が変わるだけで、右端の位置は揃います。
R-5期限が近いとき
提出期限までの残り日数が少なくなったら、2段目を残日数の表示に切り替える案。色を増やさず、文字を濃くするだけで差をつけています。
N
「要対応」の強調バリエーション
いま自分の番の工程をもっと見つけやすくするための5案です。緑地に白抜きの「要待機」と見分けがつくことを条件にしています。それぞれ工程3を対応中にして並べました。
N-1枠＋グロー（前回）
白地に緑の太枠と、外側のやわらかい光。静かですが、並ぶと埋もれがちです。
N-2枠＋明滅推奨
N-1のグローをゆっくり明滅させた案（この画面でも動いています）。色を増やさずに、動きだけで視線を取れます。ボタンのバッジと同じ手法なので、画面の中で調子が揃います。
N-3濃い緑の塗り
いちばん濃い緑で塗りつぶした案。静止画でも確実に目立ちます。「要待機」の緑と濃さで見分ける形になるので、並んだときに一瞬迷う可能性があります。
N-4点滅ドット付き
先頭に小さな緑の点を足して、それだけを明滅させた案。通知の赤丸と同じ文法なので、「ここに用がある」と直感的に伝わります。
N-5薄い緑の背景
白地ではなく薄い緑を敷いた案。面で色がつくので、白い工程の中で塊として浮きます。動きがないぶん落ち着いた見え方です。
M
工程ごとの画面（5パターン）
1つのサイクルが進むにつれて画面がどう変わるかを、工程1から5まで並べました。自分の番はボタン、スマカクの番は待機の帯に変わります。「要対応」はN-2、グループ表示はR-1です。5枚を横に並べるため端末は実寸の8割に縮めています（実寸のカードはセクションRとNで確認してください）。
E
実装用データ
出典はNotion「資料提出の年間サイクル」（スマカクユーザーポータル／スマカクスタートガイドDB、2026-09-14更新）。
| プラン | グループ | P1 | P2 | P3 |
|---|
| 通常（年3回） | Aグループ | 1〜3月（4月末〆） | 4〜6月（7月末〆） | 7〜12月（翌年1/10〆） |
| Bグループ | 1〜4月（5月末〆） | 5〜7月（8月末〆） | 8〜12月（翌年1/10〆） |
| Cグループ | 1〜5月（6月末〆） | 6〜8月（9月末〆） | 9〜12月（翌年1/10〆） |
| ミニプラン（年2回） | Aグループ | なし | 1〜6月（7月末〆） | 7〜12月（翌年1/10〆） |
| Bグループ | なし | 1〜7月（8月末〆） | 8〜12月（翌年1/10〆） |
| Cグループ | なし | 1〜8月（9月末〆） | 9〜12月（翌年1/10〆） |
実装上の注意
P3の締切だけ全グループ共通で翌年1月10日に固定、P1とP2は月末でグループごとに1か月ずつずれます。フェーズの数（2つか3つか）と対象月は、必ずユーザーのプランとグループから組み立ててください。3つ固定で書くとミニプランで崩れます。