✨ 올택시 UI/UX 기반 앱 개발 구현 기능

[kimgoat]

이슈 설명

올택시 앱 개발

작업 상세 내용

• ✨ 공통 컴포넌트 UI 작업 #10
• 안내창
• Speak & Listening 애니메이션 버튼 (가능하다면 사용자의 음성을 감지한 애니메이션)
• 버튼

• ✨ Loading Screen 작업 #11
• 초기 화면 로딩
• 택시 매칭 로딩

• ✨ Main Screen(처음 화면) 작업 #12
• 현재 위치 기반의 지도뷰로 초기화
• "어디로갈까요" 알림창
• 마이크 버튼

• ✨ Voice Screen (목적시 설정 음성 대화 스크린) 작업 #13
• 음성 인지 애니메이션
• 사용자의 음성 화면에 실시간으로 출력
• SST API 사용하여 서버에 사용자 음성 text 전송
• TTS API 혹은 라이브러리 사용하여 서버에서 전송한 text를 음성으로 변환

• ✨ Result Screen (음성 대화를 통해 설정된 목적지 리스트 스크린) 작업 #14
• 목적지 리스트 : 위 대화를 통해 전달된 목적지 키워드를 토대로 Kakao API를 사용하여 구현

• ✨ Location + Path Confirm Screen 작업 #15
• Result 스크린에서 선택된 목적지 확인 및 설정 스크린
• Kakao Map API or Google Maps API를 사용하여 해당 장소의 상세정보 출력
• 현재 위치와 해당 위치의 거리를 기준으로 소요 시간, 예상 금액 계산

• ✨ Camera Screen 작업 #16
• 목적지 설정 후 사용자의 상반신 촬영
• 상반신에 맞게 레이아웃 (reference: 신분증 사진 촬영시 신분증 크기에 맞는 레이아웃) 구성
• 촬영한 사진 서버에 post

• ✨ Taxi Screen 작업 #17
• 택시 매칭 성공시 택시의 정보(기사이름, 차번호)와 예상 도착 시간 출력
• 사용자의 보호자로 등록된 번호로 푸시 알림 전송
• 지도로 시각적으로 택시 기사의 gps를 토대로 실시간 위치 변화 (reference: 쿠팡 이츠 배달 기사 실시간 위치 확인)
• 기사의 위치가 사용자와 가까워지면(트리거) 작동시켜서 "손을 흔들어주세요" 메시지 출력 혹은 사용자의 푸시 알림으로 전송

스크린샷