이 글 요약
- 아침 체중 위젯부터 주말 분석까지, 운동하는 하루를 따라가며 지금의 PowerUp 화면을 소개한다
- 한 손으로 끝나는 +/− 입력, 브랜드까지 고르는 종목, 지난번 같은 자리와 견주는 표
- 통계는 깃허브 잔디와 주식 히트맵을 빌렸다. 익숙한 화면은 설명이 필요 없다
1편에서 PowerUp을 만든 이유를 정리했다. 기존 앱이 불편해서가 아니라, 점진적 과부하를 돕고 동기부여를 더하고 싶어서였다.
이번 편은 그 결과물이다. 다섯 달 동안 만들고 지운 끝에 남은 화면들을, 운동하는 하루의 순서대로 따라간다. 만들었다 지운 기능 이야기는 3편에서 한다.
아침: 체중은 위젯에서
하루는 체중계에서 시작한다. 내려와서 앱을 열 필요는 없다. 홈 화면 위젯의 +/− 버튼으로 숫자를 맞추고 기록을 누르면 끝이다. 어제, 이번 주 평균, 지난주 평균과의 차이도 같이 보인다. 기록은 애플 건강에도 같이 들어간다.

체중 위젯 목업. 앱을 열지 않고 +/−와 기록 버튼으로 끝난다
예전에는 운동은 운동 앱, 체중은 건강 앱, 몸 사진은 사진 앨범에 흩어져 있었다. PowerUp은 이걸 한곳에 모았다.
헬스장: 운동 시작
운동 탭에는 템플릿과 지난 운동이 있다. 루틴이 정해진 날은 템플릿으로, 아니면 비어 있는 운동으로 시작한다.

운동 탭. 템플릿과 지난 운동
종목을 고를 때는 부위 → 장비 → 브랜드 순서로 좁힌다. 1편에서 말한, Strong에서 유일하게 걸렸던 부분이다. 같은 체스트 프레스라도 NewTech, M-Torture, Panatta 머신은 따로 기록된다. 기본 종목은 145개, 브랜드는 7개가 들어 있다.

종목 고르기. 가슴 → 머신을 고르면 체스트 프레스가 브랜드별로 나뉜다
세트: 지난번 같은 자리와 견주기
운동 화면이 이 앱의 중심이다.

운동 화면. 가운데 '10월 9일' 칸이 지난번 같은 자리 세트다
- "이전" 칸: 표 가운데 칸에 지난번 같은 자리 세트가 나온다. 2세트를 치고 있으면 지난번 2세트다.
- 오르면 알려 준다: 무게나 횟수가 지난번보다 오르면 세트 줄에 "+5kg" 같은 표시가 남고, 위에 "지난번보다 +5kg" 알림이 뜬다.
- 비교할 날짜 고르기: 바로 앞 기록이 컨디션 나빴던 날이면, 그날 말고 다른 날과 견줄 수 있다.
입력은 한 손으로 끝나게 했다. 세트 사이에는 숨이 차고, 한 손에는 덤벨이 있다. 지난 기록이 미리 채워져 있으니 보통은 조금만 바꾸면 된다. 그래서 키패드 대신 +/− 버튼을 뒀다. 무게는 −5, −0.5, +0.5, +5, 횟수는 −5, −1, +1, +5. 워밍업(W), 드롭(D), 실패(F) 같은 세트 종류와 RPE(얼마나 힘들었는지)도 한 줄에서 고른다.

입력 카드. 키패드 없이 +/− 버튼만으로 바꾼다
휴식: 잠금 화면에서
세트 완료를 누르면 휴식 타이머가 시작된다. 폰을 잠가도 잠금 화면과 다이내믹 아일랜드에 남은 시간이 보인다. 배달 앱의 "도착까지 5분"과 같은 방식(Live Activity)이다.

휴식 타이머 목업. 위부터 다이내믹 아일랜드(작게·크게), 잠금 화면
지하 헬스장처럼 신호가 약한 곳에서 세트를 쳐도 기록은 휴대폰에 보관됐다가 연결되면 저절로 올라간다. 이 기능이 생긴 사연은 3편에 있다.
끝: 오늘의 리포트
운동을 끝내면 오늘 한 양과 지난번보다 오른 세트를 보여 준다. 리포트 탭에서는 공유용 이미지를 만들어 저장할 수 있다.

운동을 끝내면 나오는 리포트
주말: 분석
Strong에서 가장 아쉬웠던 게 통계였다. 무게와 볼륨 그래프는 있는데, 이번 주에 어느 부위를 덜 했는지는 한눈에 안 보였다. 근비대에서는 무게보다 부위별 주간 세트 수가 중요하다. 그래서 통계를 세트 수 중심으로 만들고, 매일 보는 익숙한 화면을 빌렸다.
깃허브 잔디
개발자라면 매일 보는 그 격자다.

참고한 화면: 깃허브 기여 그래프(잔디). 출처: github.com/torvalds
주간 활성 세트는 세로가 부위, 가로가 요일이다. 많이 한 칸일수록 진하고, 빈칸이 바로 보인다.

주간 활성 세트. 부위 × 요일
운동 시간도 잔디다. 최근 4주를 하루 한 칸으로 칠하고, 칸에 운동한 분을 적었다. 30분 단위로 진해진다. 지난주가 왜 길었는지, 한 번을 길게 했는지 여러 번 나눠 했는지가 칸 모양으로 보인다.

운동 시간. 최근 4주를 하루 한 칸으로
주식 히트맵
시가총액이 큰 종목이 큰 상자를 차지하는 그 화면이다.

참고한 화면: 주식 히트맵(트리맵). 출처: TradingView Stock Heatmap
부위 비율에서는 상자 크기가 이번 주 세트 수다. 어깨와 등을 많이 한 주라면 그 둘이 화면 대부분을 차지하고, 가슴은 맨 아래 얇은 띠로 남는다. 숫자를 읽기 전에 균형이 먼저 보인다.

이번 주 부위 비율. 상자 크기가 세트 수다
그리고 몸
전체 탭의 신체 기록에는 체중, 체지방, 근육량, 허리둘레가 있다. 하루 체중은 오르내리니 7일·30일 평균과 주별 평균을 같이 본다.

신체 기록. 7일·30일 평균과 주별 평균
몸 사진은 같은 포즈로 찍는 게 핵심이다. 카메라에 지난 사진을 반투명하게 겹쳐 띄워 자세를 맞춘다. 모이면 달력으로 보고, 타임랩스로 넘겨 본다.
에이전트와 한 부분
에이전트가 한 일: 이 화면들의 코드 전부. 그리고 화면마다 3~4안씩 만든 목업. 체중 위젯만 해도 목업이 여러 벌이었다.
내가 한 일: 목업을 보고 고르는 것. 마음에 드는 안이 없으면 "A안 위쪽에 C안 버튼으로"처럼 섞어 달라고 했다. 그리고 헬스장에서 써 보는 것.
이 글의 앱 화면도 에이전트가 찍었다. 휴대폰이 아니라 웹으로 빌드한 같은 앱에 예시 데이터를 넣어 찍었다. 그래서 화면 속 기록은 내 기록이 아니다. 부위 비율 화면 하나만 내 폰에서 찍은 실제 기록이다. 가슴이 맨 아래 얇은 띠인 것도 실제다.
오늘의 교훈
익숙한 화면을 빌리면 설명이 줄어든다. 설명이 줄면 운동할 시간이 는다.
다음 편은 이 화면들 뒤에 있는 것들이다. 만들었다가 지운 기능, 그리고 헬스장에서 터진 버그.
'프로젝트' 카테고리의 다른 글
| [PowerUp 개발기 4편] 앱스토어 심사 제출 따라 하기 (캡처 31장) (0) | 2026.10.16 |
|---|---|
| [PowerUp 개발기 3편] 지운 기능과 고친 버그 (0) | 2026.10.16 |
| [PowerUp 개발기 1편] 5년 쓴 헬스 앱을 두고 내 앱을 만들었다 (0) | 2026.10.16 |
| 음성으로 대화하는 chatGPT (0) | 2026.10.15 |
| [만쥬네 동아리 가게] 5. UI/UX 설계 (0) | 2026.10.15 |