diff --git a/landing/app/components/sections/roi-simulator.tsx b/landing/app/components/sections/roi-simulator.tsx deleted file mode 100644 index 57d03db..0000000 --- a/landing/app/components/sections/roi-simulator.tsx +++ /dev/null @@ -1,156 +0,0 @@ -import { useState } from "react" -import { ArrowRight, Clock, ShieldCheck } from "lucide-react" - -import { RangeSlider } from "@/components/ui/range-slider" -import { Section } from "@/components/ui/section" -import { SectionHeading } from "@/components/ui/section-heading" -import { Typography } from "@/components/ui/typography" - -/** 도입 ROI 시뮬레이터 — 예산·협력사 수 슬라이더로 예상 절감액을 즉시 계산. */ -export function ROISimulator() { - // 연간 총 구매 예산(억 원) - const [budget, setBudget] = useState(50) - // 관리 중인 협력사 수 - const [suppliers, setSuppliers] = useState(50) - - // 보수적 절감율 2.8%~4.5% — 협력사가 많을수록 병렬 대안이 늘어 상향 - const savingRate = Math.min(0.045, 0.028 + (suppliers / 300) * 0.015) - const estimatedSavingsValue = budget * savingRate - - // 협력사당 왕복 흥정 수작업 절약분을 ~6.5시간으로 잡은 추산 - const savedHours = Math.round(suppliers * 6.5) - - return ( -
- - 네고시움 도입 시
- 예상 절감액 확인하기 - - } - description={ - <> - 아직 실제 도입 실증 사례가 없는 신규 카테고리여도 신뢰할 수 있습니다.
- 연간 구매 예산과 공급사 수만 입력해 보수적인 시뮬레이션 성과를 즉시 시각화해 보세요. - - } - descriptionClassName="max-w-2xl" - /> - -
- {/* 좌: 입력 슬라이더 */} -
-
-
- - {formatCurrency(budget)} -
- 원자재, 부자재, 가공비, 운송비 등 협상에 연동할 총 연간 구매 규모입니다. -
- -
- 5억 원 - 500억 원 - 1조 원 -
-
-
- -
-
- - {suppliers}개사 -
- 에이전트가 동시에 1:1로 조율할 협력사 수입니다. -
- -
- 5개사 - 150개사 - 300개사 -
-
-
- -
- - - 최저가 스캔(LPS) 시세와 B2B 협상 데이터의 보수적 평균(3.1~4.2% 절감)을 적용한 추정치입니다. - 실제 데이터로 검증해 보시려면 파일만 주시면 됩니다. - -
-
- - {/* 우: 결과 지표 */} -
-
- - ESTIMATED ANNUAL SAVINGS - -

매년 절감 가능한 구매 원가 (보수적 추산)

-
- {formatSavings(estimatedSavingsValue)} -
- - 그동안 손이 못 가던 꼬리 거래(Tail Spend)까지 동시에 협상합니다. 수동으로는 놓치던 구간입니다. - -
- -
-
- - - 연간 실무 단축 시간: {savedHours.toLocaleString()}시간 - -
- - 메일 전송, 유선 협의, 엑셀 취합에 쓰이던 시간이 링크 한 번과 에이전트 응대로 - 완전히 생략되어 고부가가치 전략 구매 기획에 전념할 수 있습니다. - -
- -
-
-

예상 도입 ROI 회수 기간

-

도입 즉시 마진 확보 개시

-
- - 무상 맞춤 검증 신청하기 - - -
-
-
-
- ) -} - -/** 억 원 단위 → "50억 원" / "1조 200억 원" 표기 */ -function formatCurrency(val: number) { - if (val >= 100) { - const b = Math.floor(val / 100) - const m = val % 100 - return m > 0 ? `${b}조 ${m}00억 원` : `${b}조 원` - } - return `${val}억 원` -} - -/** 억 원 단위 → "1억 5,500만 원" 표기 */ -function formatSavings(val: number) { - const rawWon = val * 100000000 - if (rawWon >= 100000000) { - const eonPart = Math.floor(rawWon / 100000000) - const manPart = Math.floor((rawWon % 100000000) / 10000) - if (manPart > 0) { - return `${eonPart}억 ${manPart.toLocaleString()}만 원` - } - return `${eonPart}억 원` - } - return `${Math.floor(rawWon / 10000).toLocaleString()}만 원` -} diff --git a/landing/app/components/ui/range-slider.tsx b/landing/app/components/ui/range-slider.tsx deleted file mode 100644 index a37aa37..0000000 --- a/landing/app/components/ui/range-slider.tsx +++ /dev/null @@ -1,28 +0,0 @@ -type RangeSliderProps = { - min: number - max: number - step: number - value: number - onChange: (value: number) => void -} - -/** 채워진 트랙이 값을 따라가는 파란 슬라이더 (ROI 시뮬레이터·히어로 콘솔 공용). */ -function RangeSlider({ min, max, step, value, onChange }: RangeSliderProps) { - const filled = ((value - min) / (max - min)) * 100 - return ( - onChange(Number(e.target.value))} - className="w-full h-1.5 rounded-control appearance-none cursor-pointer accent-primary transition-all" - style={{ - background: `linear-gradient(to right, var(--color-primary) 0%, var(--color-primary) ${filled}%, var(--color-line-strong) ${filled}%, var(--color-line-strong) 100%)`, - }} - /> - ) -} - -export { RangeSlider }