맥주 한캔 마시면서 생각난 나의 포트폴리오 앱 제작 2편 입니다. 이전편에서 앱에 어떤 기술을 담아 사용할 것인지 기술하긴 했었습니다. 실은 이런 순서는 좋아하지 않는 제작 방식입니다. 기획을 먼저 정하고 기획과 컨벤션에 맞는 기술 도구들을 찾는게 일반적인 순서라 생각하는데 포트폴리오 제작은 보여주기 위함이라서 순서가 거꾸로 됬습니다.
흔히 회바회, 사바사, 팀바팀이라는 말이 있듯이 이 프로젝트도 케바케의 원칙에 따라서 이번만은 예외로 생각하고 어떤 라이브러리를 사용할지 정하고 그 후에 기획에 들어갔네요. 의외로 먼저 무엇을 사용할지 정하고 기획을 하니까 술술 잘 진행이 됬습니다.
이전에 사용할 도구들이
아키텍쳐 (데바,aac) + Service,BroadCastReceiver,ContentProvider + CorutineScope + FireBase FireStore+ Retrofit2 + Room + FCM + DiffUtil....
이렇게 있었습니다.
개인적으로 상황에 맞지 않는 설계를 싫어하는데, 예를 들어 VIEW화면 4~5개로 끝나고 유지보수나 확장성 없을 앱에서 MVVM으로 제작한다고 vm,repository,db 열심히 나누는 경우나 백그라운드 서비스 위주로 사용하고 VIEW 는 1개만 들어가는데 ViewBinding만 써도 좋을 것을 DataBinding 을 쓴다는 것 등등.. 이런 경우를 기피할려고 합니다.
(물론 연습을 위해 적은 VIEW 화면 앱에서도 MVVM을 연습하거나 기업 면접 과제로 MVVM 을 적용해서 만들어라 한 경우는 예외 입니다. 언제나 플바플,팀바팀,회바회,케바케)
그래서 관심사 분리 아키텍쳐를 적용하기로 마음 먹은 이상.. 어쩔 수 없이 개인앱 치고 앱의 규모를 어느정도 크게 만들어야 된다는 고집이 발동되버렸습니다.
(그래봤자 기업에서 서비스 되는 앱보단 작겠지만)
기획.
앱을 키면 스플래쉬 -> 튜토리얼 -> 메인 -> 메인 도착시 구글/카카오톡 로그인 요청-> 메인 하단에 바텀네비게이션 바를 사용할 예정입니다. 5개의 아이콘이 있습니다. 각각 아이콘마다 클릭시 다른 화면들을 보여줍니다. 이제 하단 탭마다 각각 어떠한 기능들을 보여줄지 정의하기만 했습니다.
Bottom App Bar vs BottomNavigation Bar
Bottom App Bar는 작업 관련 아이콘 및 탐색 기능이 포함됩니다. (예를 들어 아이콘 클릭시 검색 UI가 등장한다던가, 혹은 다이얼로그가 띄워진다던가)
BottomNavigation Bar는 그야말로 목적지를 탐색한다는 의미이기 때문에 해당 화면만을 보여줍니다. 제 기획 정의 상 BottomNavigation이 맞다고 생각해서 사용하게 되었습니다.
아이콘 1. 에피소드
에피소드 아이콘에서는 내가 만들었던 주요 앱들을 보여줍니다. 상세 설명을 보고 싶은 아이콘의 타이틀을 클릭하면 디테일한 화면으로 이동하고 여러 화면을 거쳐서 상세하게 앱 기획 과정, 앱을 만든 과정, 사용한 기술 등등 볼 수 있습니다.
- 뷰페이저로 각 아이템마다 설명문을 두기
- 권장 머트리얼 디자인과 다양한 애니메이션 효과와 커스텀뷰들을 사용해서 설명하기
- 동영상 플레이는 ExoPlayer를 사용하기
만든 앱의 설명마다 Navigation Component 를 이용해서 각각 navGraph 흐름 들을 이용, 머트리얼 디자인 참고, 애니메이션 효과 등등을 활용할 예정입니다.
아이콘2. 응원 게시판 (파이어베이스 + Room(캐싱처리),FCM, BroadCastReceiver)
응원 게시판에서 제 지인 개발자들에게 제가 어떤 사람이었는지 평가를 남기고 댓글을 다는 인스타형식의 게시판을 만들 예정입니다.
- 글 적기 기능, 글을 적으려면 소셜 로그인 요구, 최소 이미지 1장
- 이미지 1개이상 첨부 필수
- 인스타 디자인
- 게시글 수정기능, 댓글 수정 기능
- 글을 적는 순간 스낵바 띄우고 알림 보내기
- 글을 받는 순간 스낵바 뛰우고 알림 받기
- 댓글 다는 순간 스낵바 뛰우고 알림 보내기
- 댓글 받는 순간 스낵바 뛰우고 알림 보내기
- 알림 클릭하는 순간 해당 게시물로 이동하기
게시판의 CRUD를 모두 사용할 예정이고 각 상황에 맞게 FCM 을 보낼 예정입니다. 콜백을 받으면 BroadCastReceiver에 전달되서 Notification과 동시에 스낵바를 뛰울 예정, 잠깐 네트워크가 끊겨도 UI가 그려지도록 레포지토리에서 캐싱 처리도 할 예정입니다.
아이콘3. 대화하기 (자연 언어처리, Room ,http통신)
대화하기 탭에서 나의 안드 개발 생각을 가진 봇을 만들어서 내가 직접 채팅하지 않고도 대화를 할 수 있게끔 할겁니다. 만약 이슈 해결로 질문 할시 제가 아는 문제면 해결해주지 않을까요?
-Diff Utill 을 사용하기
-레포지토리에서 http 통신의 답변을 Room에 계속 인서트 시키기
-룸에 담고 룸의 대화내역을 조회해서 뷰에 뿌려주는 방식
-http 통신으로 사용자 응답 가져와서 대답해주기
일반 채팅화면으로 만들어서 리사이클러뷰 Diff Utill 을 사용할 예정입니다. 채팅 내역은 앱 내부 db에 계속 담을 예정입니다.
아이콘4. 틱택톡 (Room CRUD)
메모리 게임이란 부제로 만들 생각 입니다. 틱택톡의 난이도 조절 및 라운드 조절이 가능하며 마지막 라운드 후에 최종 결과 및 랭킹이 나옵니다. 현재 구글 마켓에서 서비스 중인 알라미 라는 앱의 메모리 게임을 카피할 예정입니다.- view와 viewModel 역활 잘 나눠보기
- 결과 내역 삭제 할 수 있게 하기 (Delete)
- 게임 결과 화면에서 닉네임, 프로필 이미지 설정 유도, 전체 게임 랭킹이 표시됨
- 게임 결과 화면에서 ResultItem 마다 유저 이미지 등록(INSERT) 시키거나 수정 하는 기능(UpDate)
아이콘5. 뮤직 플레이어 (Service(+BindServie),ContentProvider,Notification)
내 폰에 내장된 음악들을 가져오는 음악 플레이어를 만들고 음악 추천란을 하나 넣을 생각입니다. 화면을 나가도 상단 푸쉬 알림창에 컨트롤러를 둬서 음악을 컨트롤 할 수 있게끔 할 예정입니다.- Service를 활용해서 백그라운드에서도 음악이 끊기지 않게끔 할 예정, BindService를 통해서 음악을 계속 컨트롤 할 것-안드로이드 정책상 ForgroundService를 사용해야 BackGround가 죽지 않을 바에 차라리 Notification을 음악플레이어 컨트롤러로 이용. -유투브 검색기능 api 사용하기 (http)
다음은 UI 디자인을 하면서 상세 기획을 잡아갈 생각입니다.
'포트폴리오 Portfoilo' 카테고리의 다른 글
| 포트폴리오 앱 제작(4) - 머트리얼 디자인에 맞게 재 수정 (0) | 2021.05.11 |
|---|---|
| 포트폴리오 앱 제작(3) - UI 만들기, 머트리얼 디자인을 참고하며.. (2) | 2021.05.11 |
| 포트폴리오 앱 제작(1) - 개발에 사용할 것들. (0) | 2021.05.10 |
| 포트폴리오 앱 제작(0) - 최악의 PPT를 삭제하다. (0) | 2021.05.10 |
