docs(creator): 최종 검증 기록을 갱신한다
This commit is contained in:
@@ -1,7 +1,7 @@
|
||||
# PRD: 크리에이터 채널 홈 탭
|
||||
|
||||
## 1. Overview
|
||||
크리에이터 채널 화면은 title bar, 크리에이터 프로필 header, tab-bar를 공통 shell로 유지하고, tab-bar 아래 콘텐츠만 선택된 탭에 따라 교체한다. 채널 최초 진입 시 기본 선택 탭은 `홈`이며, 홈 탭에서는 신규 API `GET /api/v2/creator-channels/{creatorId}/home` 응답을 사용해 현재 라이브, 최신 오디오 콘텐츠, 후원, 공지, 스케줄, 오디오, 시리즈, 커뮤니티, 팬Talk, 소개, 활동, SNS 정보를 표시한다.
|
||||
크리에이터 채널 화면은 title bar, 크리에이터 프로필 header, tab-bar를 공통 shell로 유지하고, tab-bar 아래 콘텐츠만 선택된 탭에 따라 교체한다. 채널 최초 진입 시 기본 선택 탭은 `홈`이며, 홈 탭에서는 신규 API `GET /api/v2/creator-channels/{creatorId}/home` 응답을 사용해 현재 라이브, 최신 오디오 콘텐츠, 후원, 공지, 스케줄, 오디오, 시리즈, 커뮤니티, 팬Talk, 소개, 활동, SNS 정보를 표시한다. 대화하기 액션은 최신 코드 기준처럼 크리에이터 프로필 header 내부에 표시한다.
|
||||
|
||||
API 연동을 먼저 구현하고, UI는 공통 shell과 홈 탭 콘텐츠를 분리한 뒤 API 응답 데이터를 기준으로 Figma 섹션 단위로 나누어 순차 구현한다.
|
||||
|
||||
@@ -11,21 +11,20 @@ Figma 전체 화면 기준 공통 shell은 아래를 따른다.
|
||||
2. 크리에이터 이미지/프로필 header
|
||||
3. tab-bar
|
||||
|
||||
Figma 전체 화면 기준 홈 탭 콘텐츠 순서는 아래를 따른다.
|
||||
최신 코드 기준 홈 탭 콘텐츠 순서는 아래를 따른다.
|
||||
|
||||
1. 대화하기 액션 영역
|
||||
2. 현재 라이브
|
||||
3. 최신 오디오 콘텐츠
|
||||
4. 채널 후원
|
||||
5. 공지
|
||||
6. 스케줄
|
||||
7. 오디오
|
||||
8. 시리즈
|
||||
9. 커뮤니티
|
||||
10. 팬Talk
|
||||
11. 소개
|
||||
12. 활동
|
||||
13. SNS
|
||||
1. 현재 라이브
|
||||
2. 최신 오디오 콘텐츠
|
||||
3. 채널 후원
|
||||
4. 공지
|
||||
5. 스케줄
|
||||
6. 오디오
|
||||
7. 시리즈
|
||||
8. 커뮤니티
|
||||
9. 팬Talk
|
||||
10. 소개
|
||||
11. 활동
|
||||
12. SNS
|
||||
|
||||
상단 tab-bar 항목은 `홈`, `라이브`, `오디오`, `시리즈`, `커뮤니티`, `팬Talk`, `후원`으로 구성한다. Figma에는 `화보` 탭과 활동 항목이 보이지만 이번 구현 범위에서는 제외한다.
|
||||
|
||||
@@ -42,7 +41,7 @@ Figma 전체 화면 기준 홈 탭 콘텐츠 순서는 아래를 따른다.
|
||||
- 신규 API, Repository, ViewModel, Response model은 `SodaLive/Sources/V2/**` 하위에 둔다.
|
||||
- API 구현을 UI보다 먼저 완료해 공통 shell과 홈 탭 섹션들이 동일한 response model을 사용하도록 한다.
|
||||
- `CreatorChannelView`는 title bar, header, tab-bar, 선택된 tab 상태, 홈 API 호출 상태를 소유한다.
|
||||
- `CreatorChannelHomeView`는 tab-bar 아래 홈 탭 콘텐츠만 렌더링한다.
|
||||
- `CreatorChannelHomeView`는 tab-bar 아래 홈 탭 콘텐츠만 렌더링하며, 대화하기 액션은 `CreatorChannelHeaderSection`에서 렌더링한다.
|
||||
- 홈 API 응답의 `creator` 정보는 공통 shell의 header/title/follow/notification/action 상태에 반영한다.
|
||||
- Figma 기준 섹션을 이후 `plan-task.md`에서 phase 단위로 나눌 수 있도록 요구사항을 분리한다.
|
||||
- 크리에이터 대표 이미지는 화면 최상단에서 OS status bar 영역까지 확장해 표시한다.
|
||||
@@ -169,16 +168,16 @@ Figma 참조:
|
||||
- `isFollow == false`이면 `팔로우` capsule 버튼을 표시한다.
|
||||
- `isFollow == false` 상태의 follow capsule에는 `ic_new_follow` asset을 사용한다.
|
||||
- `isFollow == true` 상태의 following capsule에는 `ic_new_following` asset을 사용한다.
|
||||
- `isFollow == true && isNotify == true`이면 following capsule과 알림 설정 아이콘 `ic_bar_bell_fill`을 표시한다.
|
||||
- `isFollow == true && isNotify == true`이면 following capsule과 알림 설정 아이콘 `ic_bar_bell_colored`를 표시한다.
|
||||
- `isFollow == true && isNotify == false`이면 following capsule과 알림 해제 아이콘 `ic_bar_bell`을 표시한다.
|
||||
- 더보기 버튼은 항상 표시한다.
|
||||
- 팔로우/팔로우 취소/알림 설정/알림 설정 취소 mutation은 기존 `UserProfile`에서 사용하는 `UserRepository.creatorFollow(creatorId:follow:notify:)` 흐름을 그대로 사용한다.
|
||||
- 팔로우 action은 `creatorFollow(follow: true, notify: true)`를 호출한다.
|
||||
- 팔로우 취소 action은 기존 `UserProfile`의 `CreatorFollowNotifyDialog.onClickUnFollow`와 동일하게 `creatorFollow(follow: false, notify: false)`를 호출한다.
|
||||
- `ic_bar_bell` 터치 시 알림 설정 action으로 `creatorFollow(follow: true, notify: true)`를 호출한다.
|
||||
- `ic_bar_bell_fill` 터치 시 알림 설정 취소 action으로 `creatorFollow(follow: true, notify: false)`를 호출한다.
|
||||
- `ic_bar_bell_colored` 터치 시 알림 설정 취소 action으로 `creatorFollow(follow: true, notify: false)`를 호출한다.
|
||||
- 알림 상태 변경용 신규 API는 만들지 않는다.
|
||||
- title bar에 사용하는 아이콘은 `ic_new_bar_back`, `ic_new_follow`, `ic_new_following`, `ic_new_more`, `ic_bar_bell`, `ic_bar_bell_fill`로 고정하고, 다른 back/follow/more/bell asset으로 대체하지 않는다.
|
||||
- title bar에 사용하는 아이콘은 `ic_new_bar_back`, `ic_new_follow`, `ic_new_following`, `ic_new_more`, `ic_bar_bell`, `ic_bar_bell_colored`로 고정하고, 다른 back/follow/more/bell asset으로 대체하지 않는다.
|
||||
|
||||
### 7.4 크리에이터 프로필 헤더
|
||||
|
||||
@@ -189,12 +188,13 @@ Figma 참조:
|
||||
- 큰 배경 이미지 영역은 OS status bar까지 확장되도록 top safe area를 무시한다.
|
||||
- `creator.nickname`, `creator.followerCount`를 Figma 위치와 계층에 맞게 표시한다.
|
||||
- `creator.characterId`가 있는 경우 캐릭터/AI 대화 연결 여부를 판단하는 데이터로 사용한다.
|
||||
- 대화하기 액션 영역은 최신 코드 기준처럼 `CreatorChannelHeaderSection` 내부에 속한다.
|
||||
- 이미지 로드 실패 시 기존 프로젝트의 이미지 placeholder 패턴을 따른다.
|
||||
- 텍스트가 길어도 이미지/버튼/탭 영역과 겹치지 않도록 한 줄 말줄임 또는 기존 nickname 표시 관례를 따른다.
|
||||
|
||||
### 7.5 대화하기 액션 영역
|
||||
|
||||
- 대화하기 액션 영역은 tab-bar 아래 홈 탭 콘텐츠에 속한다.
|
||||
- 대화하기 액션 영역은 최신 코드 기준처럼 크리에이터 프로필 header 내부에 속한다.
|
||||
- `creator.isAiChatAvailable == true`이면 대화하기 버튼을 표시한다.
|
||||
- 대화하기 아이콘은 `ic_new_talk` asset을 사용한다.
|
||||
- 대화하기 버튼은 영역 중앙에 배치한다.
|
||||
@@ -319,7 +319,7 @@ Figma 참조:
|
||||
- scroll progress에 따라 black으로 변하는 overlay title bar
|
||||
- 팔로우/알림 상태별 title bar
|
||||
- sticky horizontal tab-bar
|
||||
- 공통 shell 아래 홈 탭의 대화하기 액션 영역
|
||||
- 크리에이터 프로필 header 내부의 대화하기 액션 영역
|
||||
- 홈 탭의 섹션별 summary UI
|
||||
- 홈 외 탭의 placeholder page
|
||||
- 홈 섹션 전체보기 placeholder destination
|
||||
@@ -349,7 +349,7 @@ Figma 참조:
|
||||
- `SodaLive/Sources/V2/Component/SectionTitle.swift`, `AudioContentCard.swift`, `CommunityPostCard.swift`, `CapsuleTabBar.swift` 등 기존 V2 컴포넌트 재사용 가능성을 먼저 검토한다.
|
||||
- `CreatorActivityType`은 중복 선언하지 않고 기존 enum 재사용 또는 공용 위치 이동을 검토한다.
|
||||
- 신규 asset은 프로젝트 asset catalog에 이미 존재하는 `ic_new_talk`을 사용한다. `ic_new_dm`은 추후 DM 버튼 작업에서 사용한다.
|
||||
- title bar 아이콘은 프로젝트 asset catalog의 `ic_new_bar_back`, `ic_new_follow`, `ic_new_following`, `ic_new_more`, `ic_bar_bell`, `ic_bar_bell_fill`을 사용한다.
|
||||
- title bar 아이콘은 프로젝트 asset catalog의 `ic_new_bar_back`, `ic_new_follow`, `ic_new_following`, `ic_new_more`, `ic_bar_bell`, `ic_bar_bell_colored`를 사용한다.
|
||||
- 신규 문구가 다국어 대상이면 `SodaLive/Sources/I18n/I18n.swift`에 추가한다.
|
||||
- Figma에서 제공되는 localhost asset URL은 앱 코드에 넣지 않는다.
|
||||
- 프로젝트 설정 변경은 신규 파일이 Xcode project에 자동 포함되지 않는 구조일 때만 수행한다.
|
||||
@@ -370,15 +370,15 @@ Figma 참조:
|
||||
- sticky 상태에서 OS status bar 영역도 title bar와 동일한 black 배경으로 보인다.
|
||||
- `isFollow`, `isNotify` 조합에 따라 title bar의 팔로우/알림 상태가 Figma 3개 상태와 일치한다.
|
||||
- title bar 배경 opacity가 1일 때 크리에이터 닉네임이 한 줄 말줄임으로 표시되고, 긴 닉네임이어도 우측 팔로우/알림/더보기 영역이 우선 노출된다.
|
||||
- title bar는 `ic_new_bar_back`, `ic_new_follow`, `ic_new_following`, `ic_new_more`, `ic_bar_bell`, `ic_bar_bell_fill` asset만 사용한다.
|
||||
- title bar는 `ic_new_bar_back`, `ic_new_follow`, `ic_new_following`, `ic_new_more`, `ic_bar_bell`, `ic_bar_bell_colored` asset만 사용한다.
|
||||
- 팔로우/팔로우 취소/알림 설정/알림 설정 취소 action은 기존 `UserProfile`과 동일하게 `UserRepository.creatorFollow(creatorId:follow:notify:)`를 호출한다.
|
||||
- `ic_bar_bell` 터치 시 `creatorFollow(follow: true, notify: true)`, `ic_bar_bell_fill` 터치 시 `creatorFollow(follow: true, notify: false)`가 호출된다.
|
||||
- `ic_bar_bell` 터치 시 `creatorFollow(follow: true, notify: true)`, `ic_bar_bell_colored` 터치 시 `creatorFollow(follow: true, notify: false)`가 호출된다.
|
||||
- `isAiChatAvailable`에 따라 대화하기 버튼이 조건부 표시된다.
|
||||
- 대화하기 버튼은 기존 AI 채팅방 페이지로 이동하고, 기존 본인인증 guard와 비한국 국가 분기 guard를 적용한다.
|
||||
- 대화하기 버튼이 없어도 액션 영역 높이는 유지된다.
|
||||
- DM 버튼은 표시되지 않는다.
|
||||
- tab-bar 아래 콘텐츠는 선택된 tab에 따라 교체된다.
|
||||
- 홈 tab에는 대화하기, 현재 라이브, 최신 오디오 콘텐츠, 채널 후원, 공지, 스케줄, 오디오, 시리즈, 커뮤니티, 팬Talk, 소개, 활동, SNS 섹션이 API 데이터 기반으로 표시된다.
|
||||
- 홈 tab에는 현재 라이브, 최신 오디오 콘텐츠, 채널 후원, 공지, 스케줄, 오디오, 시리즈, 커뮤니티, 팬Talk, 소개, 활동, SNS 섹션이 API 데이터 기반으로 표시된다.
|
||||
- SNS 섹션은 `ic_sns_*` asset 아이콘과 유효한 SNS URL만 사용해 표시된다.
|
||||
- 데이터가 비어 있는 섹션은 표시되지 않는다.
|
||||
- `화보` 탭, 화보 섹션, 활동의 화보 row가 표시되지 않는다.
|
||||
@@ -399,7 +399,7 @@ Figma 참조:
|
||||
- 사용자 확인 사항을 반영해 `creator.profileImageUrl`을 헤더 큰 이미지로 사용, 빈 섹션 숨김, 기존 `UserProfile` follow/notify API 사용, 대화하기의 기존 AI 채팅방 및 본인인증 guard 적용, DM 버튼 추후 작업, 홈 외 탭 제목 placeholder, 팬Talk 전체보기의 팬Talk 탭 이동, Swift `Int` 통일 정책을 확정 요구사항으로 이동했다.
|
||||
- 사용자 확인 사항을 반영해 API 실패 시 placeholder 기반으로 일부 UI를 유지하고, SNS 섹션 아이콘은 `ic_sns_*` asset을 사용하도록 확정 요구사항으로 이동했다.
|
||||
- 저장소의 `ic_sns_fancimm`, `fancimmUrl`, `I18n.ProfileUpdate.fancimm`을 확인해 Figma의 Fansim 표기를 `Fancimm(팬심M)` 기준으로 정리했다.
|
||||
- 2026-07-02: 사용자 확인 사항을 반영해 title bar, 크리에이터 프로필 header, tab-bar를 `CreatorChannelView` 공통 shell로 두고, tab-bar 아래 홈 탭 콘텐츠만 `CreatorChannelHomeView`가 담당하도록 구조를 변경했다.
|
||||
- 2026-07-02: 사용자 확인 사항을 반영해 title bar Figma URL 3종과 사용할 아이콘 asset(`ic_new_bar_back`, `ic_new_follow`, `ic_new_following`, `ic_new_more`, `ic_bar_bell`, `ic_bar_bell_fill`)을 확정 요구사항으로 추가했다.
|
||||
- 2026-07-02: 사용자 확인 사항과 최신 코드 기준을 반영해 title bar, 크리에이터 프로필 header, tab-bar를 `CreatorChannelView` 공통 shell로 두고, tab-bar 아래 홈 탭 콘텐츠는 `CreatorChannelHomeView`가 담당하며 대화하기 액션은 `CreatorChannelHeaderSection` 내부에 유지하도록 구조를 정리했다.
|
||||
- 2026-07-02: 사용자 확인 사항과 최신 코드 기준을 반영해 title bar Figma URL 3종과 사용할 아이콘 asset(`ic_new_bar_back`, `ic_new_follow`, `ic_new_following`, `ic_new_more`, `ic_bar_bell`, `ic_bar_bell_colored`)을 확정 요구사항으로 추가했다.
|
||||
- 2026-07-02: 기존 `UserProfile` 동작을 확인해 title bar의 팔로우/팔로우 취소/알림 설정/알림 설정 취소를 `UserRepository.creatorFollow(creatorId:follow:notify:)`로 처리하도록 확정했다.
|
||||
- 2026-07-02: 사용자 확인 사항을 반영해 HeaderView는 `CreatorChannelHomeResponse.creator` 데이터로 채우고, 별도 프로필 이미지 없이 큰 배경 이미지만 표시하며, title bar는 기본 투명 배경으로 header 위에 overlay되도록 요구사항을 정리했다.
|
||||
|
||||
Reference in New Issue
Block a user