Meridian
디자인 요약
Meridian은 똑같은 카드 세 장 대신 하나의 주요 견적과 두 가지 대안을 제시합니다. 팀 규모와 결제 주기에 따라 가격과 추천이 즉시 바뀌며 간소화된 비교표는 플랜 헤더를 상단에 고정합니다.
검증 기록
확인됨독립 브라우저 리뷰에서 1–50인과 두 결제 주기의 100가지 상태를 실행해 300개 등급 월액, 150개 연간 총액, 모든 추천을 검증했습니다. 25인 연간 결제는 $1,920 / $3,360 / $5,760이었습니다.
검증 범위같은 리뷰에서 스크롤 전달 중 추천 블록이 자신의 열을 벗어나 비교 행을 읽는 동안 해당 헤더가 잠시 비는 문제도 발견했습니다. 최종 고정 상태가 올바르다고 이 결함이 해소되는 것은 아닙니다.
프롬프트
팀 협업 제품의 가격 페이지를 만드세요(1440×900에서 시작해 너비 390픽셀까지 반응형 대응). 영어 인터페이스로 세 가지 등급, 월간 및 연간 결제, 팀 규모에 따른 총 가격, 기능 비교표, FAQ를 제공합니다. 제품명과 기능은 가상입니다.
가격이 즉시 바뀌는 것이 이 작품의 핵심입니다. 팀 규모 컨트롤을 드래그하거나 월간 및 연간 결제를 전환하면 각 등급의 가격이 숫자 롤링 효과와 함께 새 값으로 바뀌고 추천 등급도 팀 규모에 따라 바뀌어야 합니다. 기능 비교표를 스크롤할 때는 등급명이 상단에 고정됩니다. 똑같은 둥근 카드 세 장을 나란히 배치하지 마세요.
색상은 순수한 흰색 배경, 잉크 블랙 텍스트, 에메랄드 단일 강조색을 사용하세요. 웜 화이트, 베이지, 오렌지는 사용하지 마세요.
기본 화면, 25인 팀의 연간 결제, 확장된 기능 비교의 세 가지 상태를 디자인하세요.
중국어 원본 프롬프트 보기
一个团队协作产品的定价页(1440×900 起,响应式到 390 宽),界面用英文:三个档位、月付和年付切换、按团队人数算总价、功能对比表和常见问题。产品名和功能都是虚构的。
价格当场变化是这件作品的核心:拖动人数、切换月付年付时,每档的价格数字滚动到新值,推荐的档位跟着人数变;功能对比表往下滚时档位名吸在顶上。不要做成三张一样的圆角卡片排一排。
配色:纯白底、墨黑字、祖母绿做唯一强调色;不用暖白、米色和橙色。
设计三个状态:默认、年付加 25 人团队、展开功能对比。
라이브 예제 열기