バッジ一覧表示コンポーネントのバリアントを設計する

[Hidetaro7]

バッジ一覧表示にも、簡易的なバリアントを設計する必要があるので別Issueに立てる

Originally posted by @Hidetaro7 in #28 (comment)

• より詳しい内容が記載されているバリアント
• 簡易版のバリアント
  • 能力バッジ名
  • 取得条件
  • 発行大学名、ロゴ
  • n件の育成指標（hoverで詳細表示？）

[Hidetaro7]

ペルソナCさんのニーズで、「堺市教育委員会から薦められて『学校園管理職としての資質』の全部を学んでください」と合った場合の導線として、

• バッジ詳細内容より、今は育成指標から探すことのほうが重要
  なので、簡素表示のためのバッジコンポーネントのバリアントで設計

図では左がCさん向け、右はBさんのように育成指標、バッジ内容ともに見渡すことができる

右カラムサイドに table of content を配置

[Hidetaro7]

バッジコンポーネントは1つで複数のバリアントを持つように設計中

https://www.figma.com/file/dCE06JShf29eqnvZ4vcE8U/OKUTEP?node-id=265%3A2280

[knokmki612]

バッジ詳細内容より、今は育成指標から探すことのほうが重要
なので、簡素表示のためのバッジコンポーネントのバリアントで設計

TOC表示があれば指標項目を見渡すことができるので、引用部のような目的があるのであれば、バッジとしてはコンパクトな見た目がなくともよいように思ったのですがいかがですか

[knokmki612]

https://www.figma.com/file/dCE06JShf29eqnvZ4vcE8U?node-id=249:1753#261085891 にてバリアントを用意しないことで合意した