📌 Charcoal (차콜) - AI 브리프 기반 글로벌 디자인 외주 마켓플레이스 플랫폼 구축

🔹 프로젝트 개요

• 작업 기간: 약 1개월
• 작업 범위: 디자인 외주 마켓플레이스 UI/UX 기획 및 디자인, Next.js 14 풀스택 개발, GPT-4o 기반 AI 브리프 자동 생성 파이프라인, 입찰·매칭·Stripe 결제·환불 라이프사이클, Supabase Realtime 실시간 채팅, 결과물 전달·정산, 한/영 다국어 아키텍처, 관리자 콘솔 및 배포 운영
• 사용 도구: Next.js 14 (App Router), React, TypeScript, Tailwind CSS, GSAP, Lenis, Prisma ORM, Supabase(PostgreSQL · Auth · Storage · Realtime · RLS), OpenAI GPT-4o, Stripe(Checkout · Webhook · Refunds), Resend, Vercel

🔹 프로젝트 목적

Charcoal(차콜)은 해외 클라이언트와 한국 디자이너를 연결하는 글로벌 디자인 외주 마켓플레이스입니다. 비전문가 고객이 작성한 느슨한 요구사항을 AI가 실무용 디자인 브리프로 재구성해 주고, 그 브리프를 기준으로 디자이너가 제안·입찰하는 구조입니다. 요청서 작성 → AI 브리프 → 제안 → 결제 → 작업·결과물 전달 → 정산·환불까지 외주 거래의 전 라이프사이클을 한 플랫폼 안에서 처리하고, 언어 장벽 없이 거래되도록 설계하는 것을 목표로 했습니다.

🔹 핵심 기술 및 구현 기능 (Key Technical Features)

• AI Brief Generation Pipeline (GPT-4o 브리프 자동 생성):

18항목 요청서를 GPT-4o로 구조화된 디자인 브리프로 변환하고, 정보가 부족한 지점을 판단해 고객에게 질문을 추천(JSON 모드)하며, 동일 브리프로 디자이너용 작업 가이드까지 생성합니다. 생성 실패 시에도 요청 흐름을 깨뜨리지 않는 best-effort 구조로 설계했습니다.

• Bidding & Payment Lifecycle (입찰·결제·정산 라이프사이클):

프로젝트 등록 → 디자이너 제안 → 선정 → Stripe Checkout 결제 → 결과물 업로드·서명 URL 다운로드 → 완료 승인 → 수수료 분해 정산까지를 상태 기계로 연결하고, 단계별 권한을 서버 가드로 검증합니다.

• Refund Workflow & Stripe Refunds API (환불 워크플로우):

고객 환불 요청 → 관리자 전액/부분/거절 처리를 3단계 상태로 모델링하고, 승인 시 stripe.refunds.create로 실제 환불 API를 호출한 뒤 인앱·이메일 알림을 발송합니다.

• Realtime Chat & Notification (실시간 채팅·알림):

Supabase Realtime 기반 1:1 메시지를 구현하고, 제안·낙찰·결과물·완료·환불·정산 등 핵심 이벤트를 인앱 알림과 Resend 이메일로 병행 발송합니다(발신 도메인 DKIM·SPF 인증 완료).

• Store-both i18n Architecture (다국어 아키텍처):

정적 UI는 키 사전으로, 사용자 생성 콘텐츠(요청·브리프·제안)는 범용 Translation 사이드테이블에 한/영 양쪽을 저장하는 구조로 설계했습니다. 원문 언어를 감지해 반대 언어를 자동 번역하며, 언어 추가 시 스키마 변경 없이 행만 추가되도록 확장성을 확보했습니다.

• Security Hardening (RLS · 권한 설계):

7개 테이블·21개 RLS 정책으로 행 단위 접근을 통제하고, 가입 트리거가 사용자 입력 role을 신뢰해 관리자로 승격될 수 있던 권한상승 경로를 차단했습니다. 관리자 콘솔은 비공개 경로 rewrite·역할 가드·세션 분리로 사용자 앱과 완전히 분리했습니다.