크리에이터 멤버십·콘텐츠·소통을 연결한 반응형 웹 ‘팬스테이지’

프로젝트 개요

서비스

크리에이터·팬 멤버십 플랫폼

개발 범위

팬·크리에이터 반응형 웹 운영 관리자 웹

팬 화면

검색·팔로우·콘텐츠 이용 기간별 구독·메시지·후원

크리에이터 화면

콘텐츠 발행·구독료 설정·팬 관리 매출 조회·정산 신청

운영 관리자

회원·게시물·신고 관리 결제·정산 신청 내역 관리

사용 기술

Angular · TypeScript Firebase · AngularFire

팬의 탐색·구독·소통과 크리에이터의 콘텐츠 발행·수익 관리를 한 서비스 안에서 연결했습니다. 역할에 따라 이용 화면과 관리 기능을 나눠 구성했습니다.

01

크리에이터를 찾고 콘텐츠를 확인하는 팬 화면

홈에서 전체·구독·팔로우 게시물을 구분하고 크리에이터를 검색합니다. 크리에이터 페이지에서 프로필과 콘텐츠를 확인하고 팔로우·구독·메시지로 이동합니다. 게시물은 무료·구독·판매로 구분합니다.

크리에이터를 찾고,콘텐츠와 구독으로 이어집니다.

검색과 콘텐츠 탐색에서 크리에이터 프로필·구독으로 이어집니다.

01 · 팬 홈 · 모바일 웹

전체·구독·팔로우 피드에서 콘텐츠를 탐색하고 크리에이터를 검색합니다.

02 · 크리에이터 페이지 · 모바일 웹

프로필과 콘텐츠를 확인하고 팔로우·구독·메시지로 이동합니다.

02

기간을 선택하고 결제 내용을 확인하는 구독 흐름

1·3·6·12개월 중 구독 기간을 선택하고 결제 금액과 수단을 확인합니다. 구독 내역 관리와 메시지·Key 후원 기능을 함께 구성했습니다.

기간을 선택하고 확인한 뒤,메시지로 이어집니다.

기간 선택과 결제 확인부터 메시지·후원까지 이어지는 화면입니다.

01 · 1·3·6·12개월 구독 선택

구독 기간과 기간별 금액을 확인합니다.

02 · 기간·금액 결제 재확인

선택한 기간·금액과 기본 결제 카드를 확인합니다.

03 · 메시지와 Key 후원

메시지와 게시물을 주고받고 Key 후원 내역을 확인합니다.

03

매출 조회와 정산 신청을 역할별로 관리하는 화면

크리에이터는 유형별·일별 매출을 조회하고 정산을 신청합니다. 운영 관리자는 기간·회원·처리 상태별로 신청 내역을 조회하고 정산 상태를 관리합니다.

매출 조회와 정산 신청,역할별 운영 화면.

크리에이터의 수익 관리와 운영 관리자의 정산 신청 처리 화면입니다.

01 · 크리에이터 · 매출 대시보드

월별 매출 유형별 비중과 일별 매출을 조회합니다.

02 · 크리에이터 · 정산 신청

정산 계좌·정산 가능 금액·예상 매출을 확인하고 정산을 신청합니다.

03 · 운영 관리자 · 정산 신청 내역

기간·회원·대기/완료 상태별로 정산 신청을 조회하고 처리 상태를 관리합니다.