-
Notifications
You must be signed in to change notification settings - Fork 0
Home
Ju YunGyeom edited this page Dec 12, 2024
·
36 revisions
위치 기반 노래 공유 및 플레이어 서비스
“지금 무슨 노래 듣고 계세요? 뉴진스의 하입보이요”
길거리에서 지나치는 수많은 사람들이 어떤 노래를 듣고 있는지 궁금한 적 있으신가요?
Music Road는 주변 사람들이 어떤 노래를 듣고 있는지, 더 나아가 내가 어떤 노래를 듣고 있는지 손쉽게 공유할 수 있으면 어떨까 라는 생각에서 출발했습니다.
내가 Pick한 음악을 길거리에 남기고, 지도의 Pick을 통해 다른 사람들은 이 장소에서 어떤 음악을 들었는지 둘러보세요.
- 음악 취향을 공유하고 싶은 사람
- 다른 사람들은 지금 이 장소에서 어떤 노래를 들었는지 궁금한 사람
- 새로운 노래를 찾고 싶은 사람
- 현재 위치에 나의 픽 등록
- 현재 위치 주변의 픽 확인
- 다른 사람의 픽을 담아 보관하기
- 픽의 음원 감상하기(프리뷰 30초)
- 픽의 뮤직비디오 감상하기(프리뷰 30초)
- 백그라운드 상태에서 주변 노래 알림 받기
주차 | 개발내용 |
---|---|
1주차 (10.28~11.01) | 프로젝트 기획, 디자인, 화면 흐름도, 백로그 작성, 일정 예측 |
2주차 (11.04~11.08) | Firebase 연동, Spotify API 연동, Firestore 데이터 구조 정의, 지도 화면 UI 구현, 스플래시 화면 구현 |
3주차 (11.11~11.15) | 음악 검색, 픽 등록, 픽 정보 화면, 커스텀 마커, 애플 뮤직 API 전환, 영상ㆍ음원 기술 검토 |
4주차 (11.18~11.22) | 음원 재생, 뮤비 재생 구현, 픽 불러오기 최적화, 기능 개선 |
5주차 (11.25~11.29) | 유저정보 저장, 음원, 뮤비 Configuration Change 대응, 지도화면 셔플재생, 음원 시각화, 뮤비 컨트롤러, 픽 삭제 구현, 마커 클러스터링 |
6주차 (12.02~12.06) | 음원 백그라운드 재생, 유저별 프로필 화면, 프로필 수정 구현, 피드백 반영, QA, 발표준비 |
프로젝트 설정, Firestoreㆍ지도ㆍ음악API 등 외부 서비스 연동, 픽 등록, 마커 생성, 픽 정보 등 기반 기능 구현
마커 클러스터링, 음원 재생, 영상 재생 등 기술적 도전
- ExoPlayer로 음원재생하기
- Visualizer + Compose 오디오 시각화
- 백그라운드 플레이어(1) - MediaSession
- 백그라운드 플레이어(2) - Notification
- 백그라운드 플레이어(3) - MediaService모듈
- 백그라운드 플레이어(4) - 구현
- Swipe 제스처로 자연스럽게 영상 재생하기
- 뮤직비디오 오버레이와 컨트롤러구현
- Configuration Change 발생 시 플레이어 상태 유지하기
- 사용자의 눈에 잘 띄도록 뮤직비디오 UX 개선
K002 강민주 | K009 김승규 | K050 주윤겸 |
---|---|---|
@meanjoo | @miler198 | @yuni-ju |
- 음원 재생 - 기술 검토 및 기획
- ExoPlayer로 음원재생하기
- Visualizer + Compose 오디오 시각화
- 백그라운드 플레이어(1) - MediaSession
- 백그라운드 플레이어(2) - Notification
- 백그라운드 플레이어(3) - MediaService모듈
- 백그라운드 플레이어(4) - 구현
- 1. 영상 재생 - 기술 검토 및 기획
- 2. 뮤직비디오 정보 가져오기
- 3. Swipe 제스처로 자연스럽게 영상 재생하기
- 4. 뮤직비디오 오버레이와 컨트롤러 구현
- 5. 화면 회전 시 플레이어 상태 유지하기
- 6. 사용자의 눈에 잘 띄도록! 뮤직비디오 UX 개선
- 모든 버전에 대응하는 Splash 화면
- 동적으로 색상이 변경되는 그라데이션 배경화면
- 반응형으로 만드는 InfoWindow UI
- Paging을 사용해 검색 결과 무한 스크롤
- CloudFunction 사용하기
- Firestore vs RealtimeDB 비교
- Coil vs Glide 비교
- GeoFire와 GeoHash를 이용한 Firebase 위치 데이터 쿼리
- NavBackStackEntry와 컴포즈에서의 ViewModel 공유
- CompositionLocal
- viewModel()과 hiltViewModel()
- FocusRequester
- debounce와 sample