Ⅰ. 초기 앱 등록1) 구글 개발자 등록하기앱을 구글 플레이스토어에 배포하려면 먼저 Google Play Developer 계정을 만들어야 한다.개발자 등록 비용은 25달러이며, 최초 1회만 결제하면 평생 사용할 수 있다. (꽤 비싸다..)개발자 등록을 완료하면 Google Play Console에서 앱을 등록하고 관리할 수 있는 권한이 생긴다. 2) 안내에 따라 앱 정보를 등록 개발자 등록이 끝나면 Play Console에서 앱을 생성하고 기본 정보를 입력해야 한다.이 과정에서 생각보다 입력해야 할 정보가 많았다. 앱 이름, 앱 설명, 광고 ID, 연령등급, 배포 국가, 개인정보 처리방침, 그래픽 리소스 등등 3) 앱 번들(AAB) 파일 추출하기예전에는 APK 파일을 업로드했지만, 현재는 AAB(And..

Ⅰ. 둘러보기 개요 둘러보기란 다른 사용자들이 생성한 플레이리스트를 탐색할 수 있는 페이지이다. 사용ㅈ는 다양한 맥락에서 만들어진 플레이리스트를 살펴보며 새로운 음악 취향을 발견할 수 있다. 상단에는 다음과 같은 카테고리 필터가 제공된다.장소 : 카페, 이동 중, 집/실내 등목표 : 활력, 집중, 위로 등데시벨 : 조용함, 보통, 시끄러움 등사용자는 이 카테고리를 선택하여 원하는 상황에 맞는 플레이리스트를 탐색할 수 있으며, 각 카테고리 안에서도 세부 필터를 통해 플레이리스트를 좁혀볼 수 있다. 또한 둘러보기 중 맘에 드는 플레이리스트를 발견하면 Spotify 딥링크를 통해 바로 재생할 수 있으며, 내 라이브러리레 저장할 수 있는 기능도 있다. Ⅱ. 둘러보기 필터링 구현 둘러보기 페이지에서 장소', ..

Ⅰ. 라이브러리 개요 사용자가 추천받은 플레이리스트를 저장하고 다시 찾아볼 수 있는 공간인 라이브러리이다. 2열 그리드로 구성하였고, 각 플레이리스트의 커버는 최상단의 플레이리스트 앨범 커버 4개를 분할하여 보여줬다. 이를 통해 사용자는 플레이리스트 이름과 앨범 커버를 동시에 확인하면서 시각적으로 시원함을 주었다. 라이브러리의 서버 요청을 할 때에는 데이터가 많아질 가능성이 있기 때문에 페이지네이션 방식을 사용하였다. 10개 단위로 끊어서 로드했고, 스크롤 하단 도달 시 다음 페이지를 또 요청하는 방식이다. 라이브러리에 들어오면 일단 우리 서버에서 playlistId 목록을 조회한다. 처음에는 이 아이디를 다시 상세 조회 API로 호출하여 4개의 커버를 가져오는 방식으로 하였는데, 이렇게 되면 for문..

Ⅰ. 개요우리 앱은 플레이리스트 추천 결과 화면은 리스트형, 갤러리형 등 2가지 방식으로 음악을 탐색할 수 있도록 설계했다. 리스트형으로 추천된 음악을 빠르게 확인할 수 있고, 갤러리형으로 앨범 이미지가 넘어가는 애니메이션으로 보다 몰입감 있는 경험을 제공한다. 리스트형갤러리형 리스트형갤러리형사용자는 우측 맨 위에 있는 버튼을 눌러 언제든지 원하는 모드로 바꿀 수 있다.추천된 플레이리스트는 Spotify에서 바로 재생할 수 있도록 딥링크 기능을 제공한다. 화면 상단의 "Spotify 전체 듣기" 버튼을 누르면 Spotify이 실행되고(앱이 없는 경우 웹사이트로), 추천된 플레이리스트를 재생할 수 있다.하단에는 플레이리스트를 라이브러리에 저장할 수 있는 버튼이 있다. 사용자가 지금 추천된 플레이리스트가 마..

Ⅰ. 추천받기 ViewModel3단계를 거치며 수집된 데이터들을 저장하는 뷰모델이다. 이 뷰모델 덕분에 마지막에 ResultFragment에서 한 번에 서버로 요청 보낼 수 있다.class RecommendationViewModel : ViewModel() { var place: String = "" var decibel: Float = 0.0f var goal: String = "" // 서버 전송용 영문명 var englishPlace: String = "" var englishGoal: String = "" // 데이터 확인용 로그 fun checkData() { Log.d("RecResultFragment", "현재 저장된 데이터 -> 장소:..

노래 추천받기 개요홈화면에서 "시작하기" 버튼을 누르면 노래 추천을 위한 프래그먼트로 이동한다. 사용자가 노래를 추천받기 위해서는 총 3단계의 사용자 맞춤 설정 과정을 거쳐야 한다. 1 단계. 장소 선택2 단계. 데시벨 측정3 단계. 목표 설정 각 단계는 현재 사용자의 Context를 수집하기 위한 과정으로, 사용자가 마지막 단계까지 설정을 완료하면 모든 정보를 서버로 전송한다. 서버에서는 LangGraph 기반 AI Agent를 사용하여 사용자가 방금 고른 상황과 온보딩 단계에서 설정한 아티스트 취향 등을 종합적으로 분석해 맥락 기반 음악 추천을 수행한다.추천받은 노래는 사용자의 취향에 맞춰 리스트형과 갤러리형 등 2가지 모드로 볼 수 있는데, 이건 다음 포스팅에서 자세히 설명할 예정이다. Ⅰ. 장소..

온보딩 개요로그인 진행 후 최초 1회 실행되는 온보딩으로 닉네임, 아티스트 취향, 장르 취향을 설정한다. 닉네임은 한글은 1-10자 이내, 영문은 2-20자 이내로 설정하는 제한을 두었다. 프론트엔드에서 1차적으로 문자열 검사를 하고, 추가적으로 백엔드에서도 검증 로직을 한 번 더 거친다. 아티스트 취향은 Spotify API를 활용하였다. Spotify에서 제공하는 아티스트 정보를 기반으로 사용자가 선호하는 아티스트를 선택할 수 있게 구현하였다. Spotify API를 사용하는 함수와 구현 방식은 밑에서 자세히 설명할 예정이다. 장르의 경우 선택 가능한 항목이 약 10개 정도로 적기 때문에 별도의 API를 호출하지 않고 미리 장르 리스트를 정의하여 사용하였다. + 모드 설정온보딩에서 사용하는 3개의 프..

Section 07🗃️ Firebasefirebase란Google에서 제공하는 백엔드 서비스로, 서버를 직접 구축하지 않아도 로그인, 데이터 저장, 알림, 파일 업로드 등의 기능을 손쉽게 사용할 수 있게 해줌. 기능설명Authentication이메일, 구글, 카카오 등 다양한 로그인/회원가입 기능을 지원Cloud Firestore실시간으로 데이터 저장/불러오기 가능한 NoSQL 데이터베이스Realtime Database데이터가 실시간으로 동기화되는 JSON 기반 DBStorage이미지, 파일 등 대용량 데이터를 저장Cloud Messaging (FCM)푸시 알림 기능 제공Hosting웹 앱을 Firebase 서버에 바로 배포 가능 Firebase의 구조 (서버 vs 클라이언트)클라이언트 (Client)..

Section 06🎧 RecyclerViewListView vs. RecyclerView기능ListViewRecyclerViewViewHolder 패턴선택 (성능 위해 권장)필수 (구조적으로 강제)레이아웃 구조수직 스크롤만 가능LayoutManager로 자유롭게 변경 (수직, 수평, 그리드 등)아이템 애니메이션기본 미지원 (구현 복잡)ItemAnimator로 간단하게 기본 애니메이션 적용 및 커스텀 가능유연성 및 확장성낮음높음구현 복잡도상대적으로 간단초기 설정이 조금 더 복잡함기능 구현 순서아이템 레이아웃 만들기: 리스트에 들어갈 아이템 화면(rv_item.xml)을 먼저 만든다.RecyclerView 배치하기: 아이템들을 담을 전체 틀인 RecyclerView를 activity_main.xml에 배치..

Section 05🎑 폰트 적용하는 법res에 font라는 새로운 디렉토리 만들기원하는 폰트의 .ttf 파일 or .otf 파일 font 폴더 안에 저장적용을 원하는 TestView, Button, CheckBox 등에 android:fontFamily="@font/hanna_font" 와 같이 불러서 적용🎑 코틀린 리스트(Kotlin List)List란? 데이터를 순서대로 저장하는 Collection 중 하나index를 통해 각 요소에 접근할 수 있음 List의 배열 순서는 0부터 시작 e.g. listOf("A", "B", "C") → 인덱스 0은 "A", 인덱스 1은 "B"(로그로 리스트의 배열 상태를 확인한 사진)// 1. List 생성 예시val fruits = listOf("Apple",..