Files

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 원글 등록이므로 parentCheersIdnull로 전달한다.
  • 등록 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

  • 없음.