YepBuddy - (1) 운동 좀 하는 개발자, 나를 위한 헬스 페이지를 만들어보려 한다!

원본링크: https://velog.io/@wngns9807/YepBuddy-1-%EC%9A%B4%EB%8F%99-%EC%A2%80-%ED%95%98%EB%8A%94-%EA%B0%9C%EB%B0%9C%EC%9E%90-%EB%82%98%EB%A5%BC-%EC%9C%84%ED%95%9C-%ED%97%AC%EC%8A%A4-%ED%8E%98%EC%9D%B4%EC%A7%80%EB%A5%BC-%EB%A7%8C%EB%93%A4%EC%96%B4%EB%B3%B4%EB%A0%A4%ED%95%9C%EB%8B%A4

사이트: https://www.yepbuddy.co.kr/
점점 기능을 붙이려고 한다. 지금은 템포밖에 없지만 많아지면 기대해 달라. 많은 방문을 해주면 압도적 감사.

운동앱은 많은데, '진짜 운동하는 사람'을 위한 앱은 없었다

템포 조절, 신장성 수축과 단축성 수축을 구분해야 하지 않을까?

헬스를 한 지 벌써 5년 차다. 운동하다 보면 이런 생각이 든다.

"왜 이건 아직 안 만들어졌을까?"

운동할 때마다 템포를 맞추는 것이 제일 중요하다. 수축 2초, 이완 3초 — 이 리듬이 깨지면 자극이 달라진다. 그런데 시중 운동앱들은 대부분 '횟수 세기'에만 초점을 맞춘다. 누가 몇 개 했는지는 세지만, '어떻게 했는지'는 모른다.

게다가 켜면 바로 운동이 시작되는 게 아니라, 회원가입부터 루틴 선택, 장비 등록, 신체정보 입력까지 초기 설정이 너무 많다. 운동하려고 폰을 켰는데 운동보다 귀찮다.

"그냥 바로 운동하면 안 되나?"

그래서 정말 필요한 기능만 남겼다. 운동할 때마다 비프음으로 템포를 조절해 주는 시스템을 만들었다. 시계도, 폰 화면도 볼 필요 없이 "삐-" 한 번이면 수축, "삑-" 한 번이면 이완. 단순하지만, 운동 루틴의 '감'을 살려 주는 구조다. 회원가입도, 복잡한 루틴 설정도 없이. 앱을 켜면 곧바로 운동이 시작된다 — 그게 원하던 방향이었다.

처음엔 React Native로 만들었다

모바일에서 바로 쓸 수 있는 앱이 필요하다고 생각했다. 그래서 처음엔 React Native로 프로토타입을 만들었다. 하지만 곧 한계에 부딪혔다. 배포 절차가 지나치게 복잡했고, 앱스토어 정책마다 다른 규정을 맞추는 데 시간을 더 썼다. "나는 웹 개발자인데, 왜 정책에 막혀야 하지?" 개발보다 스토어 배포 과정이 더 어렵다는 걸 깨달았다. 결국, 하고 싶은 속도로 만들 수 있는 환경을 다시 선택해야 했다.

결국 웹으로 돌아왔다

결국 YepBuddy는 웹 기반 피트니스 플랫폼으로 방향을 전환했다. 모바일 정책을 피하면서도, 브라우저에서 동일한 인터랙션을 구현할 수 있다고 판단했다.

단, 모바일 환경에서는 사용자 이벤트(터치, 클릭 등)가 없을 때 비동기 오디오 실행이 제한된다. 수축·이완 구간별로 템포를 정교하게 맞추는 건 불가능했다. 그래서 로직을 단순화했다. 수축/이완 템포 대신, 3초마다 카운트 사운드가 반복되는 음성 파일 구조로 바꿨다. "1, 2, 3" 템포 카운트를 들으며 사용자가 스스로 동작 템포를 맞추는 방식이다.

로직 구조

PC 버전

사용자가 설정한 수축(concentric) / 이완(eccentric) 시간에 맞춰 각 구간별로 다른 사운드를 순차 재생한다. 반복(reps)마다 "수축 → 이완 → 카운트" 단계를 거치며, 운동 템포를 자동으로 제어한다. 세트가 끝나면 자동으로 휴식 구간에 진입하고, 휴식 타이머가 끝나면 다음 세트를 실행한다. 실시간 오디오 제어가 가능해 정확한 템포 유지에 유리하다. (수요와 사용자가 생기면 앱 버전으로 출시할 계획이다.)

모바일 버전

모바일 웹에서는 사용자 이벤트(클릭)가 있어야만 오디오 재생이 허용된다. 수축/이완 구간을 세밀하게 제어하는 대신, 일정 주기(3초 단위)로 카운트 사운드를 반복 재생하는 구조로 바꿨다. 사용자가 반복 횟수 라디오 버튼을 선택하면, 해당 횟수만큼 MP3 카운트 사운드가 순차 실행된다. "운동 시작" 버튼 클릭 후 운동이 진행되면 버튼이 비활성화되고, 세트가 끝날 때마다 자동으로 다음 세트로 넘어간다. 모든 오디오는 사전 생성된 MP3 파일을 사용해, 브라우저 정책 제한 없이 안정적으로 재생된다.

프로틴, 지금 사면 고점일까 저점일까?

3개월마다 프로틴을 정기적으로 산다. 그런데 가격이 들쑥날쑥하다. 쿠팡, MyProtein을 번갈아 보며 비교하다 보면 결국 이렇게 된다.

"지금 사면 손해보는 거 아닌가?"

24년부터 지금까지는 세일할 때마다 직접 노션에 기록해 가며 가격을 비교했다. 하지만 매번 찾아보고 정리하는 게 너무 비효율적이었다.

"차라리 이걸 자동으로 돌리면 안 될까?"

그래서 이 과정을 자동화하기로 했다.

매일 아침 8시에 크롤러와 API가 자동으로 실행된다.

• MyProtein: 직접 크롤링(puppeteer-stealth)으로 가격 정보를 수집한다. MyProtein 세일은 매월 '월과 일이 같은 날(예: 3월 3일, 4월 4일)'이나 공휴일 시즌에 집중된다. 크롤러는 평소에는 가격만 수집하고, 세일 여부는 직접 확인 후 DB에 반영하기로 했다. 불필요한 요청을 줄이면서 실제 할인 타이밍 데이터를 정확히 관리할 수 있다.
• 쿠팡: 파트너스 API로 제한된 범위 내에서 상품 가격과 링크 정보를 가져온다. (쿠팡은 크롤링 제약이 심해 공식 API만 사용하도록 구성했다.)

이렇게 모인 데이터를 Supabase에 저장하고, 최근 180일간의 가격 분포를 분석해 지금 가격이 고점인지 저점인지 시각화한다. 그래프 아래에는 바로 구매할 수 있는 쿠팡 파트너스 링크도 자동으로 붙는다.

결국 매번 계산기를 두드릴 필요가 없어졌다. "이 가격이 싸다/비싸다"가 아니라, **"지금이 살 타이밍인지 아닌지"**를 데이터가 알려 주는 시스템이다.

헬스장, 내부 머신은 아무도 안 알려준다

새로운 헬스장을 등록할 때 가장 불편한 건 "안에 뭐가 있는지 모른다"는 거다. 사진 몇 장, 런닝머신 몇 대 정도는 있지만, 실제로 어떤 머신이 있는지, 스미스머신은 몇 개나 되는지, 내가 쓰는 브랜드 머신이 있는지는 가기 전엔 알 수가 없다.

그래서 YepBuddy에서는 헬스장 내부 머신 정보를 직접 DB에 등록하기로 했다. 일단은 내가 다니는 헬스장, 지인 헬스장부터 시작하지만, 장기적으로는 사용자가 직접 머신 정보를 추가하고 평가할 수 있도록 확장할 계획이다.

이 기능이 있으면, 새 헬스장을 찾아갈 때마다 직접 방문해 확인해야 하는 수고를 크게 줄일 수 있다. 가기 전에도 "이 헬스장에는 내가 원하는 머신이 있구나"를 미리 알 수 있고, 운동 루틴을 끊김 없이 이어갈 수 있는 정보 기반의 선택이 가능해진다.

결국, YepBuddy는 '운동하는 사람'을 위한 프로젝트다

운동할 때 비프음이 나고, 프로틴 가격이 떨어지면 알려 주고, 내가 다니는 헬스장 안의 머신이 데이터로 정리되어 있다면, 그게 진짜 운동하는 사람의 플랫폼이 아닐까.

YepBuddy는 거기서 시작됐다. 단순히 앱 하나를 만든 게 아니라, **"운동하는 사람의 생활 전체를 데이터로 묶는 시스템"**을 만든 것이다.