버그 #582
진행중[UI수정] Contribution screen
0%
설명
- 기본으로 들어가는 프로필 이미지 원본에 라운딩이 되어 있습니다. -> 피그마 프로필 스크린에 원본 이미지를 넣어두었습니다. 이 파일로 업데이트 해주세요.
- 데일리퀘스트 상태메시지 fontsize를 16으로 수정해 주세요. 작은 해상도에서는 화면을 벗어납니다.
- 데일리퀘스트 보상 시간이 1, 3, 6, 12로 변경되었습니다. 맞게 프로그레스바를 수정해 주세요.
contribution time은 중앙으로 위치를 변경해 주세요.현재처럼 액티브 프로그레스바에 맞춰 위치 변경하는 ux 유지. - 엑시 아래 상태 메시지는 삭제해주세요.
- Tabbar 메뉴의 좌우 패딩이 상하 패딩보다 큽니다. 맞춰 주세요.
1~5번 내용은 라이언님께 구두로 전달한 내용을 기록차원에서 남겼습니다.
파일
RL Ryan Lee이(가) 3달 전에 변경
- 상태을(를) 진행에서 해결(으)로 변경되었습니다.
다섯 항목 모두 처리했습니다. dev 반영 완료 (커밋 ccf6fe3, ccc1d4a, cd48992).
1. 기본 프로필 이미지 (cd48992)¶
기존 axi.svg 는 둥근 배경이 그림 안에 구워진 60x60 에셋이라, 아바타 박스가 이미 라운딩·배경을 갖는데도 그림 자체의 라운딩이 겹쳐 보였습니다. 피그마 960:29417 원본(32x49, 배경 없음)으로 교체하고, 박스 안 배치를 원본 스펙대로 맞추는 공용 컴포넌트를 두어 홈 헤더와 Profile 화면이 함께 씁니다. 캐릭터가 박스보다 세로로 길어(49 > 40) 위에서 6 내려 놓고 아래는 박스가 잘라냅니다 — 모양은 이제 그림이 아니라 박스가 정합니다.
2. 데일리퀘스트 상태메시지 (ccf6fe3)¶
18 -> 16 으로 낮췄습니다(줄높이 24 -> 22).
3. 진행바 눈금 (ccf6fe3)¶
3H 간격 균등 분할(0/3H/6H/9H/12H)에서 실제 보상 기준 시간(0/1H/3H/6H/12H)으로 바꿨습니다. 마일스톤 점도 보상을 받는 1·3·6H 지점으로 옮겼습니다(12H 는 트랙 끝이라 점 없음). 경과 시간 라벨은 요청대로 액티브 프로그레스바 끝을 따라가는 기존 UX 를 유지했습니다.
4. 엑시 아래 상태 메시지¶
이전에 이미 처리된 항목으로 확인했습니다(현재 코드에 해당 요소가 없습니다).
5. Tabbar 여백 (ccc1d4a)¶
바 높이 70 에 활성 알약 60 이라 상하 여백은 5 인데 좌우 패딩만 10 이라, 선택된 알약이 좌우로만 더 떠 보였습니다. 패딩을 5 로 낮춰 네 방향을 같게 했습니다.
해상도가 달라져도 이 규칙이 유지되도록 테스트로 못박았습니다 — 알약 폭은 (바 폭 - 패딩)/4 로 칸을 꽉 채우므로 좌우로 남는 여백은 바 패딩뿐이고, 높이는 60 고정이라 상하 여백도 5 로 변하지 않습니다. 바 폭 340/320/300/260 에서 '좌우 여백 == 상하 여백' 을 확인합니다.
작업 중 잡은 실수 두 건 (실기기에서 발견하고 수정)¶
- 눈금을 전부 중앙 정렬했더니 고정 폭 상자끼리 겹쳐 '0' 과 '1H' 가 '01H' 로 읽혔습니다. 양 끝은 가장자리에 붙이고 가운데 눈금만 위치 중앙에 맞추도록 고쳤습니다.
- 아바타 SVG 에 style 로 absolute 를 걸었더니 크기 계산이 어긋나 캐릭터가 한쪽으로 치우쳤습니다. 래퍼 View 가 위치를 잡도록 고쳤습니다.
검증¶
typecheck 통과, 테스트 70 suites / 582 통과. 1·2·3·5번 모두 에뮬레이터에서 확인했습니다.