Bunny는 사용자의 근무 시간과 시급을 기반으로 실시간 수입을 시각화하고, 절약 목표를 설정하여 소비 습관을 개선하도록 돕는 모바일 앱입니다. 애니메이션을 통해 절약의 재미를 더하고, 카테고리 기반 절약 기록과 월간 목표 관리 기능을 제공합니다.
- ⏱ 실시간 수입 계산: 출퇴근 시간에 따라 실시간 누적 수입 표시
- 📈 절약 목표 설정: 월간 목표 금액을 설정하고 현재 수입과 비교하여 시각화
- 📅 달력 기반 기록 보기: 절약한 항목을 날짜별로 확인하고 관리
- 📊 카테고리 기반 절약 기록: 커피, 택시 등 사용자가 정의한 카테고리별로 기록
- 🐇 애니메이션 효과: 절약 시 토끼 점프, 당근 낙하로 피드백 제공
- 💾 로컬 데이터 저장: AsyncStorage 기반 상태 유지
- 🎨 사용자 맞춤 UI: 카테고리별 색상 유지, 일관된 UX 흐름 설계
| 영역 | 기술 |
|---|---|
| 프레임워크 | React Native |
| 언어 | TypeScript |
| 상태 관리 | React Hooks, AsyncStorage, Custom Hooks |
| UI 컴포넌트 | react-native-svg, react-native-calendars, react-native-slider |
| 날짜 처리 | moment-timezone |
| 애니메이션 | 직접 구현 (Animated 미사용) |
| API 통신 | fetch 기반 비동기 요청 + 로컬 상태 동기화 |
| 홈 랜딩 | 절약페이지 랜딩 | 홈 (수입 그래프 상) | 홈 (수입 그래프 하) |
|---|---|---|---|
 |
 |
 |
 |
| 절약 항목 (카테고리 선택) | 절약 페이지 | 절약 달력 | 절약 내역 |
|---|---|---|---|
 |
 |
 |
 |