/

시스템 가이드

시스템 가이드

Funeral Platform MVP — 운영자 매뉴얼 · 설계 근거 · 디자인 시스템 종합 문서

시작하기

intro

본 시스템 소개

Funeral Platform MVP는 위시켓 입찰 RFP 본문 분석을 토대로, 장례 도메인의 8개 핵심 화면과 그 데이터 흐름을 React/TypeScript 기반으로 구현한 시연 자산입니다.

단일 화면이 아닌 본사가 보유한 다섯 시스템(장례식장 오픈 API · 토스페이먼츠 · 카카오톡 · SMS · 본사 통합 DB)을 묶는 데이터 허브로 설계되었습니다.

본 가이드는 운영자가 시스템을 실제로 운영할 때 참조할 수 있는 매뉴얼이자, 위시켓 심사관이 본 프로토타입의 설계 근거를 빠르게 파악할 수 있도록 구성된 문서입니다.

시작하기

system-structure

시스템 구조도

본 다이어그램은 본 사업의 결과로 본사가 새로 보유하게 되는 통합 데이터 자산의 위치와, 외부 시스템과의 입출력 흐름을 시각화한 것입니다.

관리자 Setup — AI 챗봇 시나리오 등록 · 안전성 검증 · 게시 승인 흐름시나리오 등록안전 점수 / 할루시네이션 검증게시 승인 / 차단본사 관리자 권한입력 / 외부 인격사용자 (B2C)회원 가입 · 가족 구성원 초대이하늘장사 + 카카오맵1,100개 시설 5종 통합LBS GPS 기반 탐색토스페이먼츠 PG가족 분담 + 할부 1~12개월Whisper STT + Google TTS시각장애인 음성 (양방향)API게이트웨이(RBAC)이번 사업 신축 영역 — 본사 통합 데이터 자산Funeral Platform 통합 DB(PostgreSQL · MongoDB · Redis)회원 · 가족 구성원 트리AI 상담 + DIY 견적가족 분담 결제 · 할부음성 세션 · 부의금 매칭알림 이벤트 · 감사 로그Single Source of Truth (SSOT)출력 화면 (UX)화면 2 · 통합 대시보드화면 3 · LBS 시설 탐색 (5종)화면 4 · AI 장례지도사 + DIY화면 5 · 가족 분담 결제·할부화면 6 · 시각장애인 음성화면 7 · 운영 알림관리자 Operation — AI 챗봇 모니터링 · 부적절 응답 차단 · 시나리오 보강 흐름실시간 안전성 모니터링부적절 응답 차단시나리오 보강 / 갱신Sentry · Datadog 연동▣ 강조 영역 = 이번 사업 신축 / □ 흰색 박스 = 외부 시스템 또는 기존 영역Funeral Platform MVP — 위시켓 입찰 프로토타입 · 2026.05

시작하기

screen-map

화면 구성 (9화면 — RFP 정합)

사이드바 메뉴 순서 그대로 화면 1~9가 배치되며, 각 화면은 RFP 섹션과 직접 매핑됩니다.

#화면명RFP 매핑역할
1프로토타입 소개전체자가완결 1페이지 시연 자산
2통합 대시보드2-1 ④5종 KPI · 6종 차트 · 위젯 2종
3LBS 시설 탐색2-2 ① ② ③1,100개 시설(5종) GPS 검색·1·2 순위 예약
4AI 장례지도사 + DIY2-3 ① ② ③ ⑤GPT 시나리오 + 견적 + 장지 추천
5가족 분담 결제·할부 ★2-4 ① ② ③ ④% 분담 + 할부 1~12개월 + 부의금 일시납
6시각장애인 음성 ★2-3 ④STT/TTS + 우선 모드 + 음성 명령
7다채널 알림2-4 ④카카오톡 · SMS · MMS · 이메일 통합
8외부 시스템 연동2-6 ③ ④5종 시스템 카탈로그 + API 키 관리
9운영 알림2-6 ⑤감사 로그 + 운영자 대응 흐름

핵심 기능

ai-chatbot-safety

AI 챗봇 안전성 검증 (RFP 차별화 핵심)

GPT 기반 응답에 안전 점수 / 할루시네이션율 / 응답 시간 3축 평가를 적용하여, 임계 미달 시 자동 차단·운영자 검토 큐로 이관합니다.

본 시스템이 위시켓 RFP 2-3 ①의 안전성 요건을 직접 충족하는 결정적 차별 자산입니다. 단순히 GPT API를 호출하여 응답하는 수준이 아니라, 모든 응답을 사후 검증하여 위험 응답을 사전 차단합니다.

특히 법적 절차 카테고리(상속세 · 유언장 효력)는 안전 점수 임계를 더 높게 설정하여, 부정확한 법률 정보가 사용자에게 전달되지 않도록 보호합니다.

임계 구간처리운영자 액션
85점 이상게시 (published)별도 검토 없이 응답 가능
78~84점검토 큐 (review)운영자 사전 검토 후 게시
78점 미만자동 차단 (blocked)시나리오 보강 후 재게시

핵심 기능

family-payment

가족 분담 결제 + 할부 + 부의금 일시납 (RFP 2-4 ★)

RFP 2-4 4개 항목을 모두 직접 시각화한 차별화 핵심 영역입니다. % 분담 비율 설정 + 할부 1~12개월 + 부의금 일시납 + 결제 실패 자동 재시도.

토스페이먼츠 결제 토큰을 가족 구성원별로 분리 발급하여, N분의 1 또는 비율 분담을 직접 지원합니다. 가족 4명 그룹 기준 약 4~5초 만에 분담 비율 설정 + 결제 링크 발송 완료.

할부 1~12개월 직접 선택 — 사용자가 본인 부담 구간을 명시적으로 선택해 부담 분산. 일시납 선택 시 할부 수수료 없음.

부의금 입금 자동 매칭 — 후불제 상조 방식으로 부의금이 들어온 계좌를 연동해 잔액을 확인하고, 현금 일시납 결제 자동 매칭.

결제 실패 시 10분·1시간·24시간 간격 자동 재시도 3회. 실패 지속 시 가족 구성원에게 SMS·푸시 알림 동시 발송.

핵심 기능

voice-access

시각장애인 음성 인터페이스 (RFP 2-3 ④ ★)

OpenAI Whisper(STT) + Google Cloud TTS 통합으로 식장 검색·DIY 설계·결제 요청까지 음성 명령만으로 완결.

RFP에서 명시적으로 차별화 기능으로 정의한 영역이며, 우대 사항에 STT/TTS 음성 인식·합성 기술 연동 경험이 명시되어 있습니다.

시각장애인 우선 모드 활성 시 음성 응답을 두 번 안내, 화면에 큰 글자·고대비 표시, 화면 전환 시 음성 알림 함께 제공.

한국어 Native 모델 사용으로 평균 STT 정확도 95% 이상, TTS 자연도 90점 이상 유지.

설계 근거

data-hub-rationale

데이터 허브로 설계한 이유

본 사업의 결과로 본사가 새로 보유하게 되는 자산은 화면이 아니라, 다섯 시스템에서 흘러들어 온 통합 데이터입니다.

외부 시스템 5종(장례식장 오픈 API · 토스페이먼츠 · 카카오톡 · SMS · 본사 통합 DB)은 각자 다른 책임을 가지지만, 사용자에게는 하나의 일관된 경험으로 보여야 합니다.

본 플랫폼은 그 통합점 역할을 하며, 향후 R&D 정부지원사업(TIPS) 단계에서 본사의 핵심 차별화 자산이 됩니다. 단순한 화면 시스템이 아닌 데이터 자산 구축 사업이라는 관점이 핵심입니다.

설계 근거

tech-stack-rationale

기술 스택 선정 근거

RFP에 명시된 React / TypeScript / Next.js 옵션 / Node.js / PostgreSQL을 그대로 채택하되, 운영 안정성에 결정적인 라이브러리만 추가합니다.

계층선택 기술선정 이유
프런트엔드Next.js 16 + React 19 + TypeScript 5RFP 명시 · App Router · Turbopack 빌드 속도
스타일Tailwind CSS v4 + CSS Modules디자인 시스템 일관성 + 페이지 격리
차트Recharts 3.xB2C UI에서도 가독성 확보된 모노톤 차트 구성 가능
애니메이션Framer Motion 12.x사이드바 호버·모달 페이드 등 미세 디테일
아이콘lucide-react 0.5.x이미지 아이콘 사용 금지 룰 준수 (라인 아이콘만)
백엔드Node.js + NestJS (RFP 명시)MSA 구조 · Postgres·MongoDB·Redis 조합
인프라AWS EKS / RDS / ElastiCacheRFP 2-7 ① 명시 클라우드 환경

디자인 시스템

design-tokens

디자인 토큰

본 시스템은 Calm Enterprise UI 룰을 따르며, 모노톤 + Primary Blue 단일 강조색을 절제하여 사용합니다.

토큰용도
Primary#0d47a1강조 텍스트 · 강조 보더 · prelabel
본문 메인#1a1a1a본문 12px 메인 텍스트
본문 보조#4a5568설명문·테이블 데이터
캡션#718096캡션·메타 텍스트
보더 표준#e2e8f0박스·카드 보더
섹션 배경#f8fafc섹션 박스 배경
라운드6px모든 박스·버튼·카드 (배지만 5px 예외)
폰트Pretendard / Noto Sans KR본문 표준

디자인 시스템

typography-rules

타이포그래피 룰

12px 본문 / 11px 메타 / 24px 페이지 타이틀 — 폰트 사이즈 변종을 만들지 않습니다.

크기용도예시
24px페이지 타이틀 (h1)각 화면의 제목 (반드시 PageHeader 사용)
20px섹션 타이틀 (h2)가이드 섹션 제목 등
14px카드/박스 타이틀ChartCard / KpiCard 헤더
12px본문 표준단락 · 테이블 데이터 · 라벨
11px메타 라벨uppercase + tracking-wider 라벨

디자인 시스템

color-philosophy

색감 철학 — 알록달록 금지

한 화면에 색이 많지 않도록 의미 색상(빨강·주황·초록)을 절제합니다.

위계는 색의 진하기가 아니라, 모노톤 + 단일 강조색의 사용 빈도와 위치로 잡습니다. 이는 장례 도메인의 차분한 정서를 해치지 않으면서도 정보 밀도를 확보하는 결정적 룰입니다.

solid 배지는 화면당 0~1개로 제한하며, 정상·완료 상태는 muted 배지로 회색 톤다운하여 시선 분산을 방지합니다.