버그 #578
진행중[UI 수정] 리워드 스크린
0%
설명
- 작은 해상도의 경우 버튼이 커서 잘리는 현상이 있습니다. -> 버튼에서 포인트 숫자를 삭제하고, 리워드제목 아래에 포인트를 넣는 UI로 수정했습니다. 피그마 파일을 참조하세요.
- active invitees는 모두 Active today로 label을 통일
- 초대자 코드 배너의 이미지에 배경이 들어가 있어요. 투명 버전으로 다시 넣어주세요.
- Header의 좌우 버튼의 style을 다른 스크린의 header와 동일하게 통일하겠습니다. bg="FFFFFF", stoke="gray/200"
2번과 3번은 라이언님께 구두로 전달한 내용입니다.
파일
RL Ryan Lee이(가) 3달 전에 변경
- 상태을(를) 진행에서 해결(으)로 변경되었습니다.
네 항목 모두 처리했습니다. dev 반영 완료.
1. 작은 해상도에서 버튼 잘림 (커밋 0b4d9af)¶
금액을 버튼에서 빼 제목 아래로 옮기고 버튼은 'Claim' 만 남겼습니다.
Active inviter bonus [ Claim ]
500 Points
제목·금액 영역이 남는 폭을 쓰고 버튼은 줄어들지 않게 해서, 화면이 좁아지면 텍스트가 먼저 접히고 버튼은 온전히 남습니다. 수령 완료 칩도 같은 이유로 'Claimed' 로 줄였습니다. 화면에서 금액이 빠진 자리는 accessibilityLabel 이 유지해 스크린리더에는 종전대로 'Claim 500 Points' 로 읽힙니다.
2. 라벨 통일 (커밋 0b4d9af)¶
'Active invitees' -> 'Active today' (레벨 카드 진행바, Network rewards 헤더).
한 곳은 그대로 뒀습니다 - 레벨 카드의 안내 문장 'N more active invitees to claim ...' 은 라벨이 아니라 문장이라 바꾸면 어색해집니다. 이것도 변경이 필요하면 알려주세요.
3. 초대자 코드 배너 이미지 배경 (커밋 5c8d766)¶
기존 png 에 좌상단 노랑 -> 우하단 흰색 그라데이션 사각형이 불투명하게 구워져 있었습니다. 캐릭터 본체도 흰색·크림색이라 색 기준으로는 배경만 떼어낼 수 없어, 피그마 324:384 원본을 다시 받아 교체했습니다. 원본은 본체와 가슴 큐브가 별도 레이어라 큐브를 원본 위치에 얹어 합친 뒤 82x100 의 3배 해상도 투명 png 로 내보냈습니다.
4. 헤더 좌우 버튼 스타일 (커밋 0b4d9af)¶
이 화면만 배경과 테두리가 뒤바뀌어 있었습니다(#F4F4F4 배경 + 흰 테두리). 다른 스크린(Network·PointHistory·DailyQuest) 기준인 흰 배경 + gray/200 테두리 + 약한 섀도로 좌측 버튼과 우측 포인트 칩 모두 맞췄습니다.
검증¶
typecheck 통과, 테스트 68 suites / 548 통과.
2·3·4번은 에뮬레이터에서 확인했습니다. 1번은 초대자가 있어야 보이는 카드라 테스트 계정으로는 실기기 확인을 하지 못했고 테스트로만 검증했습니다 - QA 시 초대자가 있는 계정으로 확인 부탁드립니다.