SYSTEM BLUEPRINT

전자보증서 조회
고객과 운영자를 잇는 화면 설계

고유번호 입력부터 등록·검증·인계까지, 실제 운영 흐름을 화면 단위로 정의했습니다.

스토리보드란?

스토리보드는 고객용 조회와 운영자 등록을 실제 모습에 가깝게 미리 그려 보는 문서입니다. 데이터가 어디에서 입력되고 어떤 규칙으로 고객에게 보이는지 여정 순서로 배치했습니다.

  1. 고객이 카페24 메뉴에서 고유번호로 보증서를 확인하는 흐름
  2. 운영자가 보증서를 등록하고 조회 결과를 검증하는 흐름
  3. 발주사가 소스·DB·가이드로 직접 운영을 이어가는 흐름

마지막까지 보시면 다음 보증서부터 직접 운영할 수 있는 시스템의 모습이 그려집니다.

고객 시나리오

고객 보증서 조회 여정

카페24에서 연결된 조회 화면에서 본인 보증서를 확인하는 흐름입니다.

1. 메뉴 진입

카페24의 보증서 확인 메뉴
에서 조회 페이지로 이동

2. 번호 입력

카카오톡으로 받은 고유번호
를 입력하고 조회

3. 검증 처리

존재 여부와 표시 규칙을
확인한 뒤 결과를 반환

4. 결과 확인

이름·날짜·보증 종류 등
필요한 정보만 확인

5. 안내 종료

문의가 필요한 경우 안내
경로를 확인하고 종료

고객 | 화면 01

카페24 메뉴에서 조회 진입

cafe24://warranty-check
카페24 연결
WARRANTY CHECK

보증서 확인

받으신 고유번호를 입력하면 보증서 내용을 확인할 수 있습니다.

고유번호WR-2026-04821
고객명김**
보증 종류시공 보증

[화면 개요 및 목적]

카페24 사이트의 보증서 확인 메뉴에서 고객용 조회 페이지로 자연스럽게 연결됩니다.

[핵심 기능 로직]

카페24 본체와 조회 서비스의 책임을 분리해 연결이 단순하고 배포가 독립적입니다.

  • 연결 단순화
    Cafe24 메뉴
  • 독립 배포
    Pages
고객 | 화면 02

고유번호 입력·검증

service://lookup
입력 검증
WARRANTY CHECK

고유번호를 입력하세요

번호를 확인해 주세요. 등록된 보증서만 안전하게 표시됩니다.

고유번호WR-2026-04821
고객명김**
보증 종류시공 보증

[화면 개요 및 목적]

고유번호를 입력하고 조회를 요청하는 핵심 고객 화면입니다.

[핵심 기능 로직]

입력값 형식 검증 후 API가 DB를 조회하며 실패 사유는 개인정보 없이 안내합니다.

  • 오타 방지
    입력 검증
  • 안전 조회
    Workers API
고객 | 화면 03

보증서 조회 결과

service://result
조회 완료
WARRANTY CHECK

보증서 조회 완료

등록된 보증서 정보와 조회 기준이 일치합니다.

고유번호WR-2026-04821
고객명김**
보증 종류시공 보증

[화면 개요 및 목적]

등록된 데이터와 일치하는 보증서 정보만 읽기 쉽게 보여줍니다.

[핵심 기능 로직]

서버가 필요한 필드만 반환해 내부 관리 정보와 개인정보 노출을 줄입니다.

  • 일치 확인
    D1 조회
  • 최소 노출
    필드 정책
운영자 시나리오

보증서 등록·검증 여정

발주사가 다음 시공 건을 직접 등록하고 고객 조회까지 검증하는 흐름입니다.

1. 관리 진입

운영 화면에서 등록 메뉴를
선택하고 권한 확인

2. 정보 입력

이름·날짜·보증 종류 등
필수 항목 입력

3. 저장·검증

중복·필수값을 확인하고
DB에 저장

4. 고객 화면 확인

고유번호로 실제 조회해
등록 결과를 검수

5. 운영 인계

백업·수정·장애 대응을
가이드로 확인

운영자 | 화면 01

보증서 등록 목록

admin://certificates
운영 화면
WARRANTY CHECK

보증서 등록 관리

등록 완료 128건 · 검수 필요 2건 · 최근 백업 오늘

고유번호WR-2026-04821
고객명김**
보증 종류시공 보증

[화면 개요 및 목적]

등록된 보증서를 상태와 함께 확인하고 새 보증서를 추가하는 운영 화면입니다.

[핵심 기능 로직]

목록과 등록 API를 분리해 운영자가 오류 건을 다시 확인할 수 있습니다.

  • 현황 파악
    목록 UI
  • 재검수 가능
    상태 필드
운영자 | 화면 02

보증서 정보 입력

admin://certificates/new
등록 폼
WARRANTY CHECK

새 보증서 등록

필수 항목을 채우면 저장 전 검증 결과를 먼저 확인합니다.

고유번호WR-2026-04821
고객명김**
보증 종류시공 보증

[화면 개요 및 목적]

대리점 시공 건을 입력하는 단순한 폼으로 다음 등록을 빠르게 처리합니다.

[핵심 기능 로직]

필수값·날짜·중복 고유번호를 저장 전에 검증해 데이터 품질을 보장합니다.

  • 입력 실수 감소
    Form 검증
  • 중복 차단
    DB 제약
운영자 | 화면 03

조회 결과 미리보기

admin://preview
검수 완료
WARRANTY CHECK

등록 결과 검수

고객 조회 화면과 동일한 값을 확인한 뒤 운영을 마무리합니다.

고유번호WR-2026-04821
고객명김**
보증 종류시공 보증

[화면 개요 및 목적]

저장한 보증서가 고객 화면에서 어떻게 보이는지 등록 직후 확인합니다.

[핵심 기능 로직]

등록 응답의 고유번호를 이용해 고객용 읽기 경로를 재호출하고 일치 여부를 표시합니다.

  • 즉시 확인
    미리보기
  • 일치 보장
    조회 재검증
발주사 운영 시나리오

직접 운영·인계 여정

월 유지보수 계약 없이 발주사가 시스템을 이해하고 운영하는 흐름입니다.

1. 가이드 열기

운영 가이드에서 등록·백업
절차를 확인

2. 데이터 관리

DB 스키마와 입력 규칙을
기준으로 관리

3. 상태 확인

조회 오류와 등록 상태를
화면에서 확인

4. 백업 수행

정기 백업과 복구 절차를
문서대로 실행

5. 소스 인계

소스·스키마·가이드로
독립 운영

발주사 운영 | 화면 01

운영 가이드 홈

guide://start
직접 운영
WARRANTY CHECK

운영 가이드

보증서 등록 · 조회 검수 · 데이터 백업 · 오류 대응

고유번호WR-2026-04821
고객명김**
보증 종류시공 보증

[화면 개요 및 목적]

발주사가 자주 하는 작업을 짧은 단계로 안내하는 시작 화면입니다.

[핵심 기능 로직]

문서와 실제 화면의 용어를 맞춰 인수인계 이후에도 스스로 해결할 수 있게 합니다.

  • 학습 부담 감소
    운영 문서
  • 절차 일치
    화면 용어
발주사 운영 | 화면 02

DB 스키마·백업 안내

guide://data
DB 가이드
WARRANTY CHECK

데이터 관리

보증서 테이블, 필수 항목, 백업 파일과 복구 순서를 확인합니다.

고유번호WR-2026-04821
고객명김**
보증 종류시공 보증

[화면 개요 및 목적]

보증서 항목과 백업·복구 방법을 발주사 언어로 설명합니다.

[핵심 기능 로직]

스키마·마이그레이션·샘플 데이터의 관계를 문서로 고정해 변경 위험을 줄입니다.

  • 구조 이해
    D1 스키마
  • 복구 가능
    백업 절차
발주사 운영 | 화면 03

인계 체크리스트

guide://handoff
인계 체크
WARRANTY CHECK

인계 완료

소스코드 · DB 스키마 · 배포 설정 · 관리 가이드를 확인했습니다.

고유번호WR-2026-04821
고객명김**
보증 종류시공 보증

[화면 개요 및 목적]

소스·DB·배포·카페24 연결을 빠짐없이 넘기는 마지막 체크리스트입니다.

[핵심 기능 로직]

완료 기준을 기능이 아닌 운영 가능한 상태로 정의해 인계 누락을 방지합니다.

  • 누락 방지
    체크리스트
  • 소유권 명확
    전체 소스