Born to Gym App
헬스장 및 PT 구독 예약 앱
Born to Gym은 헬스장과 락커, 퍼스널 트레이닝을 유연하게 구독하고 예약할 수 있는 통합 헬스장 구독 앱이에요.
기존의 번거로운 상담 과정, 아날로그 예약 방식에서 벗어나, 인앱 결제를 통해 원하는 기간 동안, 원하는 트레이너와의 PT를 자유롭게 예약할 수 있어요. 이를 통해 유연하고 편리한 피트니스 경험을 누릴 수 있어요.
Client:
Born to Gym
Year:
2025
Design:
Framer, Illustrator
Development:
Next.js, React, TypeScript, PostgreSQL, Supabase, Drizzle ORM, TanStack React Query, Tailwind CSS, Shadcn/ui, Zustand, Zod, Framer Motion, Firebase, Suprema, Toss Payments, PASS
Service
본 프로젝트에서는 가장 먼저 기존 서비스의 구조를 면밀히 분석한 뒤, 사용자 경험을 근본적으로 개선하기 위해 전체적인 디자인 시스템을 새롭게 정의했어요. 브랜드 아이덴티티 강화를 위한 로고 리디자인부터, 전체적인 UI 톤앤매너를 새롭게 정의했죠.
기존 앱은 사용성과 시각적 완성도 모두 아쉬움이 많았기 때문에, 로그인 흐름, 버튼 인터랙션, 콘텐츠 구조까지 전반을 다시 설계했어요. 앱의 첫인상을 좌우하는 로그인 화면 역시 소셜 로그인 도입과 함께, 로그인 과정을 단계별로 나누어 사용자 피로도를 줄이고 진입 장벽을 낮췄어요.
서비스는 크게 홈, 찾기, 일정, 채팅, 마이페이지로 구성되어 있어요.
홈 탭에서는 헬스장 출석 일정과 헬스장 혼잡도를 한눈에 확인할 수 있어요. 헬스장 혼잡도는 QR 입장 데이터를 바탕으로 시간대별로 시각화돼서, 사용자들이 덜 붐비는 시간에 운동할 수 있도록 안내해줘요.
찾기 탭에서는 트레이너나 헬스장을 검색하고 탐색할 수 있어요.
일정 탭은 캘린더 뷰로 구성돼 있어 내가 예약한 PT나 출석 일정을 직관적으로 확인할 수 있고, 일정 변경도 앱 내에서 간편하게 할 수 있어요.
채팅 탭은 트레이너와 PT 전에 안내를 주고받거나 운동 관련 피드백을 나누는 데 사용돼요.
마이페이지에서는 구독 상태, 결제 내역, 리뷰 작성, 계정 설정 등 개인화된 기능들을 제공하고 있어요.
트레이너 PT 예약 구조는 정교하게 설계되었어요. 앱 내에서 바로 PT 상품을 결제하고, 예약 시에는 트레이너의 휴무일이나 이미 예약이 찬 시간대는 자동으로 비활성화되어요.
예약이 확정되면 캘린더에 자동으로 반영되고, 리마인드 알림도 제공돼요. 사용자는 앱 하나만으로 탐색부터 결제, 일정 관리까지 모든 흐름을 해결할 수 있는거죠.
서비스 구조는 사용자, 트레이너, 어드민 세 가지 역할에 맞게 분리되어 있어요. 사용자 사이드에서는 운동 일정 관리와 PT 예약에 최적화되어 있고, 트레이너 사이드에서는 상품 수정과 예약 관리, 스케줄 조정 등이 가능해요.
기술적으로는 Next.js 15 기반의 풀스택 웹 애플리케이션으로 구현되었고, Supabase를 통해 안전한 인증과 데이터 관리가 가능해요. 서버는 Next.js API Routes로 구축됐고, Drizzle ORM과 PostgreSQL을 통해 데이터 안정성을 확보했어요. 실시간 채팅 기능과 PT 예약 알림 처리에는 Firebase와 WebSocket을 활용했고, 결제는 토스페이먼츠 SDK를 통해 안전한 인앱 결제가 가능해요. QR 출석 체크 기능은 Suprema API를 연동해 실제 헬스장 도어락과 연결되며, 출입 데이터를 수집해 혼잡도 분석에 활용돼요. PT 예약 시스템은 트레이너별 가용 시간을 동적으로 관리하고, 실시간 예약 현황 확인과 변경/취소가 유연하게 처리되도록 설계했어요. 헬스장 구독권과 PT 수강권을 분리한 티켓팅 시스템으로 다양한 요금제와 할인 정책을 효율적으로 관리할 수 있어요.