Meridian
デザイン概要
Meridian は、3枚の同じカードではなく、一つの主な見積もりと2つの代替案で料金を提示します。チーム人数と請求期間に応じて価格と推奨が即座に更新され、差分を絞った比較表ではプラン見出しが固定されます。
検証記録
確認済み独立ブラウザーレビューでは、1～50人と2つの請求期間を組み合わせた100状態を操作し、300件のプラン月額、150件の年払い合計、すべての推奨を検証しました。25人の年払いでは $1,920 / $3,360 / $5,760 になりました。
検証の範囲同じレビューでは、スクロールの引き継ぎ中に推奨ブロックが自身の列から離れ、比較行を読める間もその列の見出しが一時的に空白になる問題が残っていました。最終的な固定状態が正しいからといって、この不具合が解消されるわけではありません。
プロンプト
チームコラボレーション製品の料金ページ（1440×900を基準とし、幅390ピクセルまでレスポンシブ対応）。英語のインターフェースとし、3つのプラン、月払い・年払い、チーム人数に基づく合計料金、機能比較表、よくある質問を含める。製品名と機能は架空とする。
価格が即座に変わることがこの作品の中核。チーム人数の操作をドラッグする、または月払いと年払いを切り替えると、各プランの価格が数字のロールアニメーションで新しい金額へ切り替わり、推奨プランも人数に応じて変わる。機能比較表をスクロールすると、プラン名が上部に固定される。同じ角丸カードを3枚横に並べてはいけない。
色：ピュアホワイトの背景、インクブラックの文字、アクセントはエメラルドのみ。ウォームホワイト、ベージュ、オレンジは使わない。
デフォルトビュー、25人チームの年払い、機能比較を展開した状態の3状態をデザインする。
中国語の元のプロンプトを見る
一个团队协作产品的定价页（1440×900 起，响应式到 390 宽），界面用英文：三个档位、月付和年付切换、按团队人数算总价、功能对比表和常见问题。产品名和功能都是虚构的。
价格当场变化是这件作品的核心：拖动人数、切换月付年付时，每档的价格数字滚动到新值，推荐的档位跟着人数变；功能对比表往下滚时档位名吸在顶上。不要做成三张一样的圆角卡片排一排。
配色：纯白底、墨黑字、祖母绿做唯一强调色；不用暖白、米色和橙色。
设计三个状态：默认、年付加 25 人团队、展开功能对比。
