https://www.youtube.com/watch?v=hRqH1I6Y3WQ
카카오 입사 예정자들, 오늘 뭐 입지..?
간절기에 일교차가 매우 심하기도 하고 옷을 입을 때 습도나 체감온도 같이 여러가지 고려해야할 사항이 많다. 우리 오뭐입? 은 날씨, 온도, 습도에 따라서 사용자에게 적절한 옷차림을 추천해준다.
정보에 따라 다른 백그라운드 화면 현재 위치 기반 날씨정보와 그에 맞는 백그라운드 애니메이션
- 위치정보 : 현재 위치의 날씨 뿐만 아니라, 타 지역 날씨정보도 알 수 있다.
- 옷 추천 : 사용자의 성별을 식별에 날씨정보를 분석하여 알맞은 옷 추천
- 백그라운드 애니메이션 : 각 상황에 맞는 눈, 비, 천둥, 안개 등 12가지의 애니메이션이 있다.
일주일 치 옷 추천 및 타지 검색 우리 놀러갈 것을 대비해보자고.
- 주간 옷 추천 : 오늘 기준 향후 6일자의 날씨 정보를 분석해 스타일리시한 옷을 추천한다.
- 타지 날씨 : 타 지역 시,구,동 단위로 검색 가능하며, 그에 따른 날씨 정보를 갖고올 수 있다.
알림 알람 기능
맞춰놓은 시간으로 알림이 슈우웅~
- 아이콘 애니메이션 : 메뉴바 애니메이션
- 다크모드 : 전 페이지 눈이 편한 커스텀 다크모드 색상 적용
-
첫 시작 : 카카오톡 어플이 깔려있다면 로그인을 사용하여 개인 정보를 불러올 수 있다. 만약 깔려있지 않다면 날씨 정보만 알 수 있다. 카카오톡 정보를 통해 남성, 여성 데이터를 얻어올 수 있게 되며 이에 따른 옷 추천을 하게 된다.
-
메인 화면 구성: 좌측 상단 (a)위치설정 버튼, 우측 상단 (b)Drawer버튼, 상단 화면에 주소 정보와 날씨정보(온도, 대기질수, 미세, 초미세먼지)가 나타난다. 화면 중앙으로 들어오면 날씨 정보에 따라 옷을 추천해주고 클릭하게 되면 일주일 분량의 (c)옷을 추천받는 페이지로 넘어간다. 가장 아래쪽에는 주별 날씨가 보여진다. 메인화면의 배경화면은 날씨 정보에 따라 다른 12가지 배경이 적용된다.
-
(a) 위치설정 버튼 : ‘주소 검색하기’ 글씨를 누르면 도로명 주소 검색을 통해 세부적인 주소를 얻어온다. 다음으로 ‘위치설정’ 버튼을 누르면 검색을 통해 얻은 주소로 위치가 설정되어 메인화면으로 이동한다. ‘현재 위치로 설정’ 버튼을 누르면 내 위치를 기준으로 적용되어 메인 화면으로 이동한다.
-
(b) Drawer버튼 : 메뉴바가 나온다. 홈버튼, 알람설정, 주간OOTD, 설정 버튼이 있다. 홈으로 버튼 : 클릭하면 메인 화면으로 넘어간다. 알람설정 : (d)알람 설정페이지로 이동한다. 주간OOTD : (c)주간OOTD페이지로 이동한다. 설정 : (e)설정페이지로 이동한다.
-
(c) 옷을 추천받는 페이지(주간OOTD페이지) : 일주일동안 온습도를 통해 옷을 추천해준다. 옆으로 스크롤을 통해 일주일 옷 추천을 확인 할 수 있다. 날씨를 고려하여 여러 스타일 추천을 받을 수 있다. (c)옷을 추천받는 페이지는 우측 상단 (b)Drawer버튼 메뉴바에서 주간 OOTD 페이지 버튼을 통해서도 들어갈 수 있다.
-
(d)알람 설정 페이지 : 알람을 on off로 설정할 수 있고, 원하는 시간을 설정할 수 있다. 알람을 적용시키면 특정 시간에 알림이 온다.
-
(e)설정창페이지 : 언어설정을 통해 한국어와 영어를 설정할 수 있다. 다크모드를 지원한다. 로그아웃을 클릭할 시 카카오톡 로그아웃을 하게 된다. 회원탈퇴를 클릭할 시 데이터베이스의 데이터를 지우게 된다.
flutter로 작업 하였지만, IOS,AOS 둘다 호환하기위해 각각의 네이티브 코드 작업을 진행함.
Name | Description |
---|---|
NAVER MAP | 좌표 정보를 입력으로 하여 주소정보 입력받거나, 주소정보로 좌표를 가져옴 |
KaKaoTalk | 정보를 읽고 사용자 성별에 맞게 옷차림을 추천해줄 수 있기 위해 카카오톡 로그인을 사용하였고, OOTD 내용 공유를 위하여 카카오톡 공유 기능을 사용 |
Current weather data | 현재 날씨 정보를 가져오는 API |
GoogleSheets | 구글스프레드 시트API로 DB구성 |
Name | Description |
---|---|
from_css_color |
다크모드 및 전체 색 통일에 사용 |
flutter_spinkit |
로딩화면에 사용 |
flutter_gif |
스플레쉬 스크린 만드는데 사용 |
flutter_animate |
아이콘 애니메이션에 사용 |
Name | Description |
---|---|
get |
상태변환에 여러군데 사용 |
firebase_messaging |
알람,알림에 사용 |
geolocator |
현재 위치 사용 |
kakao_flutter_sdk_user |
로그인 및 공유기능 위해 사용 |
gsheets |
DB생성위해 사용 |
[카카오 입사 예정자 팀장] 최지철 UI/UX 및 DB 담당
[카카오 입사 예정자] 신근재 날씨 정보 분석 담당
[카카오 입사 예정자] 이용구 지역 API 담당 및 옷 데이터 가공 담당
[카카오 입사 예정자] 이재민 날씨 API 담당 및 데이터 가공 담당