ANOTHER

나 또는 다른 사람의 과거에 도전하여 더 나은 나를 만들어가는 러닝 어플.

🍀 Another 팀의 개발자들을 소개합니다!!

박종호-리더	곽승엽	왕현석	임범규	박진성	이기용
Data & Infra & FrontEnd	Data & Infra & Backend	Backend	Frontend	Frontend	Frontend

서비스 배경

혹시 매일 러닝하고자 마음먹고 포기하신적이 있으시지 않으신가요?

바뀌기 위해 마음을 먹어도 힘들고 고된 삶에 부딪히다 보면 목표를 잊고 다시 원래의 일상으로 돌아가게 됩니다.

저희는 사람들에게 더욱 동기부여를 제공하고자 ”Another”를 서비스하게 되었습니다.

주요기능

나와의 러닝, 다른 사람과의 러닝

• 과거의 나 또는 다른 사람과 러닝을 하며 성장 비교
• 과거의 데이터와 현재 러닝 결과를 비교하며 성장 체험 가능.
• TTS를 통해 상대와 어느정도 거리 차인지 알 수 있음.

러닝 기록 분석

• 오늘, 이번주, 이번달, 전체 데이터를 비교하며 성장치를 그래프로 분석 가능
• 뛰었던 날짜를 달력에서 쉽게 파악 가능.

피드

• 오늘 운동 완료를 게시하여 뿌듯함을 자랑할 수 있음.
• 어떤 루트로 뛰었는지 지도를 통해 파악가능.
• 피드에 러닝 기록 그래프 게시.

웨어러블

• 러닝시 불편함을 없애기 위해 스마트 워치 사용 가능.
• 거리 및 시간 등 간단한 정보 제공.

특장점

• 타 어플과 다르게 상대방 또는 나의 과거 데이터와 비교 가능.
• 웨어러블 장비를 통해 편의성 제공.
• 인터벌 제공.

화면

로그인/회원가입

• 실시간 validation check
• 수정 필요한 입력에 대한 시각적인 표시 제공

• 구현
  • 로그인 UI : 임범규, 이기용
  • 회원가입 UI : 임범규, 박종호
  • 로그인 기능구현 : 이기용
  • 회원가입 validation check: 박종호, 임범규

 

피드

• 시간순 피드 제공

• 디테일 정보(시간, 거리, 칼로리, 페이스) 제공

• 시간순으로 따른 패이스 선 그래프로 제공
  

• 구현

  • 전체피드, 나의피드, 디테일 UI : 이기용
  • 전체피드, 나의피드, 디테일 기능구현 : 이기용
    

 

러닝

• 상대 기록과의 거리 차이 제공

• tts를 통한 동기 부여

• 루트 기록
  

• 구현

  • 러닝 UI : 박진성, 이기용
  • 러닝 기능 구현 : 박진성, 박종호
    
   

목표 및 인터벌 설정

• 거리별, 시간별 목표 제공
• 인터벌 설정을 통한 페이스 조절 기능
  
• 구현
  • 목표 및 인터벌 설정 UI : 박진성
  • 목표 및 인터벌 설정 기능 구현 : 박진성, 박종호
    

과거의 나/ 다른 사용자와 러닝

• 과거의 나의 데이터(시간, 거리, 칼로리, 페이스) 제공
  
• 구현
  • 과거의 나 / 다른 사용자와 러닝 UI : 이기용, 박진성
  • 과거의 나, 다른 사용자와 러닝 : 박진성, 박종호
    

 

오운완 저장

• 사진 저장 가능(5장)
• 루트 기록 및 러닝 데이터 저장
  
• 구현
  • 오운완 UI : 박진성
  • 오운완 기능구현 : 박진성
  
   

기록페이지

• 막대그래프를 통한 일별, 주차별, 월별 분석 가능

• 총 기록을 통한 성과 확인 가능

• 달력 마커 기능을 통해 출석 확인

• 달성 뱃지 확인 및 레벨, 경험치 확인 가능
  

• 구현

  • 기록페이지 UI : 임범규, 박진성
  • 달력 마커 UI : 임범규
  • 달력 마커 기능 구현 : 임범규
  • 기록페이지 기능 구현 : 임범규
    
  

챌린지페이지

• 사용자의 경험치와 챌린지 달성도 체크
  

• 구현

  • 챌린지페이지 UI : 임범규

  • 챌린지페이지 기능구현 : 임범규
    

    
    
    

Wear OS (갤럭시 워치 페이지)

• 앱과 Wear OS에서의 실시간 데이터 연결
  

• 구현

  • Wear OS UI : 이기용

  • Wear OS 기능구현 : 이기용
    

    
    
    

✨ Co-work tool ✨

🖥 개발환경

• 형상관리 : Gitlab
• 이슈관리 : Jira
• 커뮤니케이션 : Mattermost, Notion
• 디자인 : Figma

🛠 기타 편의 툴

• Postman
• Termius

✨ Front Component-Tree ✨

📦another_front
 ┣ 📂android
 ┣ 📂assets
 ┃ ┣ 📂font
 ┃ ┗ 📂img
 ┣ 📂build
 ┣ 📂ios
 ┣ 📂lib
 ┃ ┣ 📂constant
 ┃ ┃ ┣ 📂const
 ┃ ┃ ┃ ┣ 📜color.dart
 ┃ ┃ ┃ ┣ 📜data.dart
 ┃ ┃ ┃ ┣ 📜text_style.dart
 ┃ ┃ ┃ ┗ 📜utils.dart
 ┃ ┃ ┣ 📂layout
 ┃ ┃ ┃ ┗ 📜main_layout.dart
 ┃ ┃ ┗ 📂view
 ┃ ┃ ┃ ┗ 📜splash_screen.dart
 ┃ ┣ 📂screens
 ┃ ┃ ┣ 📂account
 ┃ ┃ ┃ ┣ 📂api
 ┃ ┃ ┃ ┃ ┣ 📜login_api.dart
 ┃ ┃ ┃ ┃ ┣ 📜nickname_check_api.dart
 ┃ ┃ ┃ ┃ ┣ 📜signup_api.dart
 ┃ ┃ ┃ ┃ ┗ 📜userinfo_change_api.dart
 ┃ ┃ ┃ ┣ 📂widgets
 ┃ ┃ ┃ ┃ ┣ 📜complete_button.dart
 ┃ ┃ ┃ ┃ ┣ 📜height_weight_picker.dart
 ┃ ┃ ┃ ┃ ┣ 📜image_picker.dart
 ┃ ┃ ┃ ┃ ┗ 📜pass_button.dart
 ┃ ┃ ┃ ┣ 📜edit.dart
 ┃ ┃ ┃ ┣ 📜login.dart
 ┃ ┃ ┃ ┣ 📜signup.dart
 ┃ ┃ ┃ ┗ 📜signup_userinfo.dart
 ┃ ┃ ┣ 📂feed
 ┃ ┃ ┃ ┣ 📂api
 ┃ ┃ ┃ ┃ ┣ 📜challenge_list_api.dart
 ┃ ┃ ┃ ┃ ┣ 📜detail_feed_api.dart
 ┃ ┃ ┃ ┃ ┣ 📜feed_api.dart
 ┃ ┃ ┃ ┃ ┗ 📜my_feed_api.dart
 ┃ ┃ ┃ ┣ 📂widgets
 ┃ ┃ ┃ ┃ ┣ 📜custom_image.dart
 ┃ ┃ ┃ ┃ ┣ 📜custom_linear_progress.dart
 ┃ ┃ ┃ ┃ ┣ 📜feed_select.dart
 ┃ ┃ ┃ ┃ ┣ 📜feed_select_two.dart
 ┃ ┃ ┃ ┃ ┣ 📜image_box.dart
 ┃ ┃ ┃ ┃ ┣ 📜image_profile.dart
 ┃ ┃ ┃ ┃ ┣ 📜line_chart_custom.dart
 ┃ ┃ ┃ ┃ ┣ 📜my_feed_result.dart
 ┃ ┃ ┃ ┃ ┣ 📜run_icon.dart
 ┃ ┃ ┃ ┃ ┗ 📜tabs.dart
 ┃ ┃ ┃ ┣ 📜all_feed_screen.dart
 ┃ ┃ ┃ ┣ 📜challenge_list.dart
 ┃ ┃ ┃ ┣ 📜detail_feed.dart
 ┃ ┃ ┃ ┣ 📜feed_screen.dart
 ┃ ┃ ┃ ┗ 📜my_feed_screen.dart
 ┃ ┃ ┣ 📂record
 ┃ ┃ ┃ ┣ 📂api
 ┃ ┃ ┃ ┃ ┣ 📜challenge_api.dart
 ┃ ┃ ┃ ┃ ┣ 📜history_record_api.dart
 ┃ ┃ ┃ ┃ ┣ 📜period_total_record_api.dart
 ┃ ┃ ┃ ┃ ┗ 📜user_level_exp_api.dart
 ┃ ┃ ┃ ┣ 📂widgets
 ┃ ┃ ┃ ┃ ┣ 📜category_title.dart
 ┃ ┃ ┃ ┃ ┣ 📜challenge_category.dart
 ┃ ┃ ┃ ┃ ┣ 📜challenge_item.dart
 ┃ ┃ ┃ ┃ ┣ 📜period_total_record.dart
 ┃ ┃ ┃ ┃ ┣ 📜profile.dart
 ┃ ┃ ┃ ┃ ┣ 📜record_chart.dart
 ┃ ┃ ┃ ┃ ┣ 📜record_running_history.dart
 ┃ ┃ ┃ ┃ ┗ 📜target_record_item.dart
 ┃ ┃ ┃ ┣ 📜challenge.dart
 ┃ ┃ ┃ ┗ 📜record.dart
 ┃ ┃ ┣ 📂running
 ┃ ┃ ┃ ┣ 📂api
 ┃ ┃ ┃ ┃ ┣ 📜feed_create_api.dart
 ┃ ┃ ┃ ┃ ┣ 📜my_history_api.dart
 ┃ ┃ ┃ ┃ ┣ 📜recommend_challenge_api.dart
 ┃ ┃ ┃ ┃ ┣ 📜run_compare_month_api.dart
 ┃ ┃ ┃ ┃ ┣ 📜under_running_api.dart
 ┃ ┃ ┃ ┃ ┣ 📜under_running_end_api.dart
 ┃ ┃ ┃ ┃ ┗ 📜versus_api.dart
 ┃ ┃ ┃ ┣ 📂widgets
 ┃ ┃ ┃ ┃ ┣ 📜before_running_map.dart
 ┃ ┃ ┃ ┃ ┣ 📜button_component.dart
 ┃ ┃ ┃ ┃ ┣ 📜detail_setting.dart
 ┃ ┃ ┃ ┃ ┣ 📜distancebar.dart
 ┃ ┃ ┃ ┃ ┣ 📜distancebar_custom.dart
 ┃ ┃ ┃ ┃ ┣ 📜LockScreen.dart
 ┃ ┃ ┃ ┃ ┣ 📜my_history.dart
 ┃ ┃ ┃ ┃ ┣ 📜running_carousel.dart
 ┃ ┃ ┃ ┃ ┣ 📜running_circle_button.dart
 ┃ ┃ ┃ ┃ ┣ 📜running_end.dart
 ┃ ┃ ┃ ┃ ┣ 📜running_map.dart
 ┃ ┃ ┃ ┃ ┣ 📜running_my_history.dart
 ┃ ┃ ┃ ┃ ┣ 📜running_small_button.dart
 ┃ ┃ ┃ ┃ ┣ 📜running_status.dart
 ┃ ┃ ┃ ┃ ┗ 📜set_running_status.dart
 ┃ ┃ ┃ ┣ 📜challenge_running.dart
 ┃ ┃ ┃ ┣ 📜feed_create_complete.dart
 ┃ ┃ ┃ ┣ 📜running.dart
 ┃ ┃ ┃ ┣ 📜timer_screen.dart
 ┃ ┃ ┃ ┣ 📜under_challenge.dart
 ┃ ┃ ┃ ┣ 📜under_challenge_end.dart
 ┃ ┃ ┃ ┣ 📜under_challenge_end_feed.dart
 ┃ ┃ ┃ ┣ 📜under_running.dart
 ┃ ┃ ┃ ┗ 📜under_running_end.dart
 ┃ ┃ ┗ 📜home_screen.dart
 ┃ ┣ 📂widgets
 ┃ ┃ ┣ 📜get_permission.dart
 ┃ ┃ ┣ 📜go_back_appbar_style.dart
 ┃ ┃ ┣ 📜intro_header.dart
 ┃ ┃ ┣ 📜record_result.dart
 ┃ ┃ ┣ 📜record_result_box.dart
 ┃ ┃ ┣ 📜target.dart
 ┃ ┃ ┗ 📜target_box.dart
 ┃ ┗ 📜main.dart
 ┣ 📜.flutter-plugins
 ┣ 📜.flutter-plugins-dependencies
 ┣ 📜.gitignore
 ┣ 📜.metadata
 ┣ 📜analysis_options.yaml
 ┣ 📜pubspec.lock
 ┣ 📜pubspec.yaml
 ┗ 📜README.md

✨ Front End Stack ✨

• IDE : Android Studio Flamingo |2022.2.1
  
  
• language
  • Dart 3.1.0
    
    
• Framework
  • Flutter 3.11.0-6.0.pre.30
    
    
• Library
  • carousel_slider: 4.2.1
  • image_picker: 0.8.7+4
  • cupertino_icons: 1.0.2
  • carousel_indicator: 1.0.6
  • numberpicker: 2.1.2
  • google_maps_flutter: 2.2.5
  • geolocator: 9.0.2
  • table_calendar: 3.0.9
  • intl: 0.18.1
  • fl_chart: 0.62.0
  • flutter_sensors: 1.0.1
  • syncfusion_flutter_charts: 21.1.41
  • provider: 6.0.1
  • http: 0.13.6
  • permission_handler: 10.2.0
  • screenshot: 1.3.0
  • wakelock: 0.6.2
  • percent_indicator: 4.0.1
  • flutter_tts: 3.6.3
  • flutter_local_notifications: 14.0.0+2
  • flutter_secure_storage: 8.0.0
  • dio: 4.0.6
  • watch_connectivity: 0.1.5
  • is_wear: 0.0.1+1
    
    

✨ Back End Stack ✨

• IDE : Intellij IDEA 2020.3
• language : Java openjdk 11.0.15 2022-04-19 LTS
• Gradle 7.6.1
• Springboot 2.7.9
  • devtools
  • Spring Data JPA
  • Lombok
  • Spring Security
  • Spring Web

📚 DB

• Mysql 8.0.32-0ubuntu0.20.04.2

🛰 Server

• https TLS 1.0
• Ubuntu 20.0.4
• Nginx 1.18.0
• Docker 20.10.23
• Jenkins Jenkinsci/blueocean(Image tag name)

✨ Big Data Stack ✨

📰 Big-Data

• Java open-jdk-11
• Hadoop 3.3.5
• Zookeeper 3.7.1
• Spark 3.4.0
  • scala 2.12
• Kafka 3.4.0
  • scala 2.12

💥 Data Pipeline

• 1초당 발생하는 사용자의 모든 러닝데이터를 Confluent 서버에 전송
• Confluent 서버룰 통해 Kafka topic - [러닝ID]에 메시지 전송
• 사용자 러닝 종료 시 kafka topic - [endZero / endOne / endTwo]에 메시지 전송
• 러닝 종료 메시지 수신 시 spark에서 kafka topic - [러닝ID]에 담긴 모든 메시지(사용자 러닝 데이터)를 가져와 데이터 전처리 후 HDFS에 적재

💻 시스템 아키텍쳐

기술 특이점

• Confluent Server를 이용하여 수많은 사용자가 Kafka topic에 메시지를 보내더라도 안정적으로 분산병렬처리되어 작업이 진행되어 처리 속도를 빠르게 진행하였습니다.
• Spark에서 전처리 작업을 통해 서버에서 빠르게 versus Data를 불러오도록 진행하였습니다.
• HDFS를 사용하여 대용량 데이터를 안정적으로 적재하도록 진행하였습니다.
• Flutter에서 Wear_Connectivity를 사용하여 웨어러블 기기와 실시간 통신을 하도록 진행하였습니다.
• Flutter의 크로스 플랫폼의 장점을 살려 Android, ios 모두 사용 가능하도록 진행하였습니다.
• Spring Security를 도입하여 인증/인가 처리를 진행하였습니다.
• JWT를 이용해 Stateless한 환경을 구축하고자 하였습니다.

🔊 요구사항 정의 및 기능 명세

요구사항 정의 및 명세

📺 화면 설계서

🦖 ER Diagram

---