문제점
- 실시간 후원 서비스 특성상 후원·결제·알림 흐름이 복잡해질 가능성
- 다양한 후원 방식으로 인해 사용자 경험이 분산될 위험
- 라이브 방송 중 지연·UI 혼란 발생 시 참여도 급감 우려
- 크리에이터가 실시간 후원 현황을 직관적으로 파악하기 어려움
- 데스크톱·모바일 환경 모두에서 UI 반응성 최적화 필요

프로젝트 목표
- 실시간 후원 흐름을 단순하고 안정적인 UI/UX로 재구성
- 다양한 후원 방식을 하나의 일관된 사용자 경험으로 통합
- 크리에이터가 후원 내역·통계를 즉시 확인할 수 있는 환경 제공
- 라이브 방송 중 팬 참여와 크리에이터 수익화를 극대화

주안점
- 실시간 서비스에 적합한 빠른 반응 속도와 안정성 확보
- Next.js 기반 컴포넌트 구조화 및 렌더링 성능 최적화
- 결제·후원 단계별 UI 피드백 및 오류 처리 강화
- 라이브 화면을 방해하지 않는 UI 배치와 인터랙션 설계
- 데스크톱·모바일 웹을 모두 고려한 반응형 UI 구현

1) 포트폴리오 소개
크리에이터와 팬을 연결하는 실시간 후원·디지털 티핑 플랫폼으로, 스트리머·아티스트·온라인 크리에이터를 메인 타깃으로 한 서비스입니다. 라이브 방송 중 팬이 즉시 후원하고 메시지·알림을 통해 참여할 수 있어 크리에이터의 수익화와 팬 참여도를 동시에 높이는 것이 목적입니다.

2) 작업 범위
- Front-end 전반 개발
- 후원 및 결제 UI 구현
- 크리에이터 대시보드 화면 개발
- 후원자 프로필 및 히스토리 페이지 개발
- 실시간 알림·이벤트 UI 연동
- 반응형 웹 지원 (데스크톱 / 모바일 웹)
- Frontend Hosting 환경 구성 (Vercel)
※ 백엔드 및 디자인은 클라이언트 제공

3) 주요 업무
- 다양한 후원 방식(일반 후원, 미니 후원, 선물, 위시리스트 등)을 통합한 기부 UI 개발
- 실시간 후원 내역 피드 및 리스트 화면 구현
- 크리에이터용 대시보드: 후원 내역, 통계, 히스토리 확인 기능
- 후원자 프로필 및 기부 이력 관리 페이지 구성
- 결제 및 후원 흐름 UI 연동 (버튼, 확인 모달, 오류 처리)
- 실시간 후원 알림, 방송 시작·종료 알림 UI 구현
- 라이브 스트리밍 환경을 고려한 반응형 UI 최적화

4) 주안점
- 실시간 후원 서비스 특성상 즉각적인 반응성과 안정적인 사용자 경험을 최우선으로 고려함
- Next.js 기반으로 컴포넌트 구조를 설계해 빠른 렌더링과 유지보수가 가능하도록 했으며, 결제·후원 과정에서 발생할 수 있는 오류를 최소화하기 위해 UI 단계별 예외 처리와 명확한 사용자 피드백에 집중.
- 라이브 방송 화면을 방해하지 않도록 UI 밀도와 레이아웃을 조정해 크리에이터와 팬 모두에게 자연스러운 인터랙션 경험을 제공하는 데 중점을 두었음.