サービスサイトの料金比較UI

複数の料金プランを比較しやすくするため、対応範囲と向いている利用者を整理した料金ページを設計しました。価格だけでなく、各プランの違いが一目で分かる構成です。

デスクトップでは比較表、スマートフォンではプランごとのカード表示に切り替えます。色だけで差を示さず、アイコンや文言も組み合わせています。

料金と機能はCMSから更新できる想定です。変更時に表示崩れが起きにくいよう、項目数の上限と表示ルールを決めています。