Things I Made

푸쉬온 (Push On) 썸네일

App

얼굴 인식으로 푸쉬업을 자동으로 세고, 기록·통계·리더보드로 꾸준한 루틴을 돕는 모바일 앱

  • React Native
  • TypeScript
  • ARCore
  • Supabase

푸쉬온 (Push On)App

  • React Native
  • TypeScript
  • ARCore
  • Supabase

어떤 앱인가요

폰을 앞에 두고 푸쉬업을 하면 전면 카메라가 얼굴을 인식해 횟수를 자동으로 세어 줍니다. 손으로 세거나 별도 기기를 찰 필요 없이, 운동에만 집중하면 됩니다. 세트마다 횟수와 시간이 기록되고, 달력·통계·리더보드로 꾸준함을 이어갈 동기를 만듭니다.

주요 기능

  • 얼굴 인식 자동 카운트 — 카메라 앞에서 내려갔다 올라오는 동작을 인식해 실시간으로 횟수를 셉니다. 카메라와 너무 멀면 “가까이 오세요!“처럼 자세를 안내합니다.
  • 세트 기록 — 세트별 횟수·소요 시간을 저장하고, 일시정지·종료 흐름으로 운동을 관리합니다.
  • 히스토리 달력 — 운동한 날이 달력에 표시되고, 날짜를 누르면 그날의 푸쉬업 수·세트 수·총 시간과 세트별 상세 기록을 볼 수 있습니다.
  • 통계 — 주간/월간 푸쉬업 수·세트 수·운동 시간을 차트로 보고 총합·평균·최고 기록을 확인합니다.
  • 리더보드 — 일일·월간·연간 순위로 다른 사용자와 경쟁할 수 있습니다.
  • 소셜 로그인 — Google, Kakao 계정으로 간편하게 시작합니다.

어떻게 만들었나

  • : React Native 0.79 (bare) + TypeScript. 화면 상태는 Jotai, 서버 상태는 TanStack Query, 내비게이션은 React Navigation, 차트는 react-native-chart-kit.
  • 얼굴 인식: Android 네이티브 모듈(Java)을 직접 작성했습니다. ARCore Augmented Faces로 얼굴을 추적하고, 푸쉬업 동작을 판정한 결과를 NativeEventEmitter로 JS에 전달해 UI가 실시간으로 반응합니다.
  • 백엔드: Supabase — 인증(Google/Kakao), 운동 기록 저장, 리더보드는 RPC 함수로 서버 측에서 집계해 네트워크 트래픽을 줄였습니다.
  • 운영: 온보딩 2단계 간소화, 앱 내 업데이트 확인, Android 16KB 페이지 크기 대응 등 출시 후 1.5.x까지 꾸준히 업데이트했습니다.

출시

  • Google Play 출시 (v1.5.3)
  • App Store 출시 예정

스크린샷

홈 화면 — Start 버튼과 오늘의 순위 얼굴 인식 카운트 화면 히스토리 달력과 세트별 기록 주간 푸쉬업 통계 차트 오늘의 순위 리더보드