9.8 KiB
9.8 KiB
PRD: FanTalk 글 입력
1. Overview
크리에이터 채널 FanTalk 탭에서 사용자가 응원글 입력 화면으로 진입하고, 기존 FanTalk 글 등록 API로 글을 등록할 수 있게 한다.
2. Problem
- 기존
FanTalk탭에는 우측 하단 floating 글쓰기 버튼과 empty 상태의응원 남기기버튼이 표시되지만 실제 글 입력 화면으로 연결되지 않는다. - 기존 floating button은 Fragment 높이에 묶여 있어 목록이 길어지면 사용자가 보고 있는 화면의 우측 하단이 아니라 콘텐츠 하단으로 내려간다.
- 기존 floating button 아이콘은 black으로 표시되어 Figma 의도와 다르게 보인다.
- 사용자는 FanTalk 탭에서 바로 응원글을 작성하고, 작성 중 취소 시 입력 종료 여부를 확인받아야 한다.
3. Goals
- 크리에이터 채널
FanTalk탭의 우측 하단 plus button을 스크롤과 관계없이 사용자가 보는 화면 우측 하단에 고정한다. - 우측 하단 plus button icon은
ic_plus_no_bg를 사용하고 white로 표시한다. - FanTalk empty 상태의
응원 남기기버튼과 FanTalk content 상태의 우측 하단 plus button을 글 입력 화면 진입점으로 연결한다. - 글 입력 화면 진입 시 키보드가 올라온 상태를 기본으로 한다.
- 입력값이 없으면 Figma
290:9235기준 UI를 표시하고 보내기 버튼을 비활성화한다. - 입력값이 있으면 Figma
290:9282기준 UI를 표시하고 보내기 버튼을 활성화한다. - 입력값이 있고 키보드가 내려가면 Figma
290:9290기준 UI를 표시한다. - 입력값이 있는 상태에서 취소 버튼을 터치하면 Figma
308:19046기준 입력 종료 안내 popup을 표시한다. - FanTalk 글 등록은 기존 FanTalk 글 등록 API를 재사용한다.
- 글 등록 성공 후 글 입력 화면을 종료하고 FanTalk 목록과 크리에이터 채널 홈 FanTalk 요약을 새로고침한다.
4. Non-Goals
- FanTalk 수정 화면/API는 이번 범위에서 구현하지 않는다.
- FanTalk 답글 작성은 이번 범위에서 구현하지 않는다.
- 이미지, 음성, 첨부파일, rich text 입력은 이번 범위에서 지원하지 않는다.
- 서버 API schema나 endpoint를 새로 정의하지 않는다.
- 레거시 FanTalk 화면 파일을 직접 수정하지 않는다.
- 크리에이터 채널의 다른 탭 UI나 공통 스크롤 구조를 재설계하지 않는다.
- Figma에서 제공하지 않은 별도 글자 수 제한 UI를 새로 추가하지 않는다.
5. Target Users
- 크리에이터 채널에서 FanTalk 응원글을 남기려는 로그인 사용자.
- FanTalk 탭 empty 상태에서 첫 응원을 남기려는 사용자.
kr.co.vividnext.sodalive.v2하위 크리에이터 채널 기능을 구현/유지보수하는 Android 개발자.
6. User Stories
- 사용자는 FanTalk 탭 우측 하단 plus button을 터치해 글 입력 화면으로 이동하고 싶다.
- 사용자는 FanTalk empty 상태의
응원 남기기버튼을 터치해 글 입력 화면으로 이동하고 싶다. - 사용자는 아무 내용도 입력하지 않은 상태에서는 보내기 버튼이 눌리지 않기를 기대한다.
- 사용자는 내용을 입력하면 보내기 버튼이 활성화되어 바로 글을 등록하고 싶다.
- 사용자는 작성 중 취소를 누르면 작성 내용을 버리고 나갈지 확인받고 싶다.
- 사용자는 목록을 스크롤해도 plus button이 화면 우측 하단에 계속 보이기를 기대한다.
7. Core Features
FanTalk Write Entry Points
FanTalk 탭의 두 진입점에서 동일한 글 입력 화면으로 이동한다.
Requirements
- content 상태에서는 스크롤과 관계없이 화면 우측 하단에 고정된 plus button을 표시한다.
- plus button icon은
ic_plus_no_bg를 사용한다. - plus button icon은 white로 표시한다.
- empty 상태에서는 기존 중앙
응원 남기기버튼을 표시하고, 이 버튼도 글 입력 화면으로 연결한다. - 글 입력 화면에는
creatorId를 전달한다. - 로그인 토큰이 없으면 기존 크리에이터 채널 로그인 이동 정책을 따른다.
Edge Cases
creatorId <= 0이면 글 입력 화면으로 이동하지 않는다.- loading/error 상태에서는 fixed plus button을 표시하지 않는다.
- empty 상태에서는 fixed plus button 대신 empty
응원 남기기버튼을 사용한다.
FanTalk Write UI
Figma 기준으로 입력값 유무와 키보드 표시 상태에 따라 UI를 표시한다.
Requirements
- 입력값 없음 + 키보드 있음: Figma
290:9235기준으로 표시한다. - 입력값 있음 + 키보드 있음: Figma
290:9282기준으로 표시한다. - 입력값 있음 + 키보드 없음: Figma
290:9290기준으로 표시한다. - 화면 진입 시 입력란에 focus를 주고 keyboard를 표시한다.
- 입력값 판단은
trim()결과가 비어 있는지 여부로 한다. - 입력값이 없으면 보내기 버튼은 disabled 상태다.
- 입력값이 있으면 보내기 버튼은 enabled 상태다.
- 보내기 버튼 enabled 상태의 배경색은
soda_400, 글자색은 white다. - Figma
290:9290기준으로 상단 title 텍스트는 표시하지 않는다. - 하단에는 현재 글자수와 최대 글자수
현재/500자UI를 고정 표시한다. - 글자수 UI는 keyboard가 올라오면 keyboard 위로 함께 올라와 보여야 한다.
- 입력은 최대 500자를 넘을 수 없다.
Edge Cases
- 공백과 줄바꿈만 입력한 경우 입력값 없음으로 처리한다.
- 화면 회전 또는 재생성 시 입력 중인 텍스트와 보내기 버튼, 글자수 상태를 유지한다.
- keyboard가 내려가도 입력 중인 텍스트는 유지한다.
Cancel Confirmation Popup
작성 중인 입력값이 있는 상태에서 취소하면 입력 종료 안내 popup을 표시한다.
Requirements
- 입력값이 있는 상태에서 취소 버튼을 터치하면 Figma
308:19046기준 popup을 표시한다. - popup title은
입력 종료이다. - popup desc는
입력을 종료할까요?\n지금 나가면 입력한 내용이 저장되지 않아요.이다. - popup cancel button label은
계속 작성이다. - popup confirm button label은
종료이다. - popup에서 종료를 확정하면 글 입력 화면을 종료하고 등록 API를 호출하지 않는다.
- popup에서 계속 작성 또는 취소 성격의 버튼을 누르면 popup만 닫고 입력 화면을 유지한다.
- 입력값이 없는 상태에서 좌측 상단
취소버튼을 터치하면 popup 없이 입력 화면을 종료한다. - 입력값이 있는 상태에서 Android back을 실행하면 좌측 상단
취소버튼과 동일하게 입력 종료 popup을 표시한다. - 입력값이 없는 상태에서 Android back을 실행하면 popup 없이 입력 화면을 종료한다.
Edge Cases
- popup 표시 중에는 보내기 버튼 중복 실행이 발생하지 않아야 한다.
- popup 확정 종료 시 Activity result는 성공으로 반환하지 않는다.
FanTalk Submit
기존 FanTalk 글 등록 API로 응원글을 등록한다.
Requirements
- 기존
ExplorerRepository.writeCheers(parentCheersId, creatorId, content, token)흐름을 재사용한다. - 신규 v2 코드는
CreatorChannelRepository.writeFanTalk(creatorId, content, token)wrapper를 통해 기존 API를 호출한다. - FanTalk 원글 등록이므로
parentCheersId는null로 전달한다. - 등록 content는 입력값의 앞뒤 공백을 제거한 값을 사용한다.
- 등록 중에는 보내기 버튼 중복 터치를 막는다.
- 등록 성공 시
RESULT_OK를 반환하고 글 입력 화면을 종료한다. - 등록 성공 후 크리에이터 채널은 FanTalk 목록과 홈 FanTalk 요약을 새로고침한다.
- 등록 실패 시 글 입력 화면은 유지하고 기존 toast/error 표시 정책을 따른다.
Edge Cases
- 등록 중 네트워크 오류가 발생하면 입력값은 유지한다.
- 서버가 실패 응답 message를 내려주면 해당 message를 우선 표시한다.
- 토큰이 비어 있으면 API 호출 전에 로그인 화면으로 이동한다.
8. UX / UI Expectations
- fixed plus button은 FanTalk 목록 스크롤 위치와 무관하게 viewport 우측 하단에 유지된다.
- fixed plus button은 navigation bar와 겹치지 않는다.
- 글 입력 화면은 Figma의 keyboard 있음/없음 상태를 기준으로 자연스럽게 대응한다.
- 보내기 버튼 상태는 입력값 변화에 즉시 반응한다.
- 취소 popup은 사용자가 작성 중인 내용을 잃을 수 있는 상황에서만 표시된다.
9. Technical Constraints
- Android XML View/ViewBinding 기반으로 구현한다.
- 신규 Activity/ViewModel 및 하위 코드는
kr.co.vividnext.sodalive.v2.creator.channel.fantalk하위에 작성한다. - 기존 레거시 FanTalk 파일은 직접 수정하지 않고 기존 repository/API 흐름만 호출한다.
- API 호출은 기존 RxJava3, Koin,
ApiResponse<T>패턴을 따른다. - 신규 문자열은
values,values-en,values-ja에 추가하거나 기존 문자열을 재사용한다.
10. Metrics
- 별도 분석 이벤트 추가는 이번 범위에서 정의하지 않는다.
- 기능 성공 기준은 글 등록 성공 후 FanTalk 목록에 신규 글이 반영되는 것이다.
- UI 완료 기준은 Figma
290:9235,290:9282,290:9290,308:19046의 주요 layout 구조, 버튼 상태, popup 문구가 구현 화면에 반영되었는지 확인되는 것이다. - 자동 검증 기준은 Figma에서 확정된 입력값별 보내기 버튼 enabled/disabled 상태, popup 문구, fixed plus button icon/tint/고정 배치 계약을 source/resource/ViewModel 테스트로 확인하는 것이다.
11. Open Questions
- 없음.