Skip to content

[2024-2 SW 캡스톤디자인] 모바일 개발을 위한 레포지토리

Notifications You must be signed in to change notification settings

team8901/woohakdong-mobile

Repository files navigation

📌 우학동: 동아리 관리 자동화 SaaS

GitHub READM md 메인 이미지


🔥 프로젝트 개요

'우학동'은 동아리 임원진을 대상으로 동아리 관리의 불편함을 간단하게 만들어주는 SaaS입니다. 실제로 팀원 중 한 명은 여러 동아리의 임원진을 경험해보았고, 매년 반복되는 동아리 관리에 대해 불편함을 느껴 해당 서비스를 기획하게 되었습니다. 저희가 생각해낸 $\bf{\color{#E53935}동아리\ 관리의\ 불편함}$은 다음과 같습니다.


1. 복잡한 동아리 신규 회원 등록 절차

대다수의 임원진은 신규 회원을 등록하기 위해 5단계의 절차를 수행합니다.

  • 구글 폼 생성
  • 구글 폼 배포
  • 동아리 회비 계좌 내역 확인
  • 동아리 회비 납부 회원 확인
  • 카카오톡 단체 채팅방 초대

이러한 5단계의 절차는 매 학기 신규 회원을 등록하기 위해 이루어집니다. 이 과정에서 많은 시간이 발생하며, 학업을 병행해야 하는 임원진의 입장에서 복잡한 신규 회원 등록 절차는 부담으로 이어질 수 있습니다.


2. 귀찮은 동아리 물품 관리 및 대여

각 동아리는 회비를 사용하여 운영에 필요한 동아리 물품을 구매합니다. 이때 물품 관리 체계가 잘 잡혀 있지 않은 동아리는 물품을 관리하기 위해서는 동아리 물품 종이에 수기로 작성하여 관리하거나, 엑셀, 노션 등을 이용해 직접 관리합니다. 만약 회원이 물품을 대여•반납을 희망하고자 할 때도 수기로 직접 대여•반납 상황을 업데이트해야 합니다.

만약 수기로 물품을 관리하는 경우에는 동아리의 모든 인원은 실시간으로 물품 현황을 알 수 없습니다. 그렇기에 물품 대여•반납 과정을 카카오톡으로 연락을 직접 주고받으며 이루어집니다. 이는 물품을 관리하는 임원진, 물품을 대여•반납하는 회원 양측 모두에게 귀찮은 과정입니다.


3. 불투명한 회비 사용 내역 및 일정 공유

각 대학교의 동아리들은 보통 회비를 엑셀에 기록하며, 동아리 연합회에 회비 사용 내역을 제출하여 감사를 받을 의무가 있습니다. 하지만 회비 사용 내역에 대해서는 동아리 임원진과 연합회에서만 파악이 가능하고, 일반 회원의 경우 회비 사용 내역에 대해 대부분 알 수 없습니다. 이러한 회비 사용 내역의 불투명성은 임원진과 회원 간의 오해와 갈등이 빚어질 수 있습니다.

그리고 현재 대부분의 동아리는 카카오톡 단체 채팅방을 통해 일정 및 공지를 전파하고 있습니다. 하지만 단체 채팅방의 특성상 일정 및 공지를 새로 채팅방에 입장하는 신규 회원은 쉽게 확인하기 어렵습니다. 또 채팅이 쌓이는 단체 채팅방의 내용을 잘 확인하지 않는 회원도 많이 존재합니다.

이러한 특성 때문에 임원진은 새롭게 일정 및 공지를 전파해야 하는 번거로움이 따르게 됩니다.


🚀 프로젝트 설명

이에 저희는 아래와 같은 슬로건을 가지고 $\bf{\color{#1A74E8}동아리\ 관리의\ 불편함을\ 해결}$하고자 했습니다.


$\large{귀찮았던\ 동아리\ 관리,\ 저희가\ 대신\ 해\ 드릴게요!}$


1. 신규 회원 등록 자동화

신규 회원의 회비 납부 이후 임원진이 직접 수행했던 3가지 작업을 자동화하여, 5단계였던 신규 회원 등록 절차를 2단계로 간소화합니다.

  • '우학동'을 이용한 동아리 신규 등록
  • '우학동'이 제공하는 동아리 전용 페이지 URL 및 QR 코드 배포

'우학동'이 제공하는 URL 및 QR 코드를 배포하기만 하면 동아리 신규 가입 희망자는 제공받은 URL로 이동하여 학교 구글 계정으로 로그인하고, 간단한 인적 사항을 작성하여 우학동에 회원 가입합니다. 이후 회비 납부 버튼을 통해 카카오페이로 회비를 납부하면 동아리 가입이 완료됩니다.

임원진은 기존에 5단계였던 신규 회원 등록 절차를 2단계로 간소화했으며, 신규 가입 희망자의 경우에도 기존의 동아리 가입 방식(구글 폼에 인적 사항 작성 후 회비 납부)에서 변경된 점이 없어 양측 모두에게 간편한 신규 회원 등록 절차를 제공합니다.


모바일 앱 UI

1 - 앱

모바일 웹 앱 UI

1 - 웹


2. 물품 대여 서비스 제공

임원진은 '우학동' 앱을 통해 간단한 물품 정보를 입력하여 물품을 등록할 수 있습니다. 회원은 동아리 전용 페이지에서 대여하고자 하는 물품을 찾은 후, 대여하기 버튼을 통해 물품을 대여할 수 있습니다. 물품 대여하기를 완료하면 물품이 있는 장소로 이동해 물품을 이용하고, 동일한 페이지에서 반납하기 버튼을 통해 반납하고자 하는 물품의 사진을 촬영하면 반납이 완료됩니다.

이 과정에서 임원진은 앱에서 실시간으로 물품 대여, 반납 및 연체 상황을 알 수 있으며, 회원도 전용 페이지에서 현재 물품의 대여, 반납 상태를 확인할 수 있습니다.

여기서 회원이 대여한 물품을 기간 내에 반납하지 않고, 연체할 경우 대여한 회원의 이메일로 연체 알림이 전송됩니다. 이를 임원진은 앱을 통해 연체 중인 물품과 회원을 알 수 있으며, 등록된 회원 정보를 이용해 곧바로 연락이 가능합니다.

임원진은 이 외에도 필터를 이용해 현재 물품 상태(대여 중, 보관 중, 연체)와 대여 가능 여부(대여 가능, 대여 불가)를 단독으로 확인할 수 있어 물품 관리에 도움을 줍니다.

이를 통해 임원진과 회원 양측 모두에게 간편한 물품 대여 서비스를 제공합니다.


모바일 앱 UI

2 - 앱

모바일 웹 앱 UI

2 - 웹


3. 회비 사용 내역 및 일정 공유 절차 간소화

임원진이 '우학동'에서 동아리를 등록하면서 입력한 동아리 회비 계좌를 통해 회비 사용 내역을 앱에서 동기화합니다. 회장 및 총무는 앱을 통해 회비 사용 내역을 업데이트할 수 있으며, 업데이트된 회비 사용 내역은 회원도 동아리 전용 페이지를 통해 확인할 수 있습니다.

이를 통해 투명한 회비 사용 내역을 제공하며, 임원진과 회원 간의 오해나 갈등을 최소화해 줍니다.

또 임원진은 앱을 통해 일정 및 공지를 등록할 수 있으며, 등록하면서 이메일 전송 여부를 결정할 수 있습니다. 만약 이메일 전송을 체크하면 등록하면서 회원들의 이메일로 등록된 일정 및 공지를 전송합니다. 중요한 일정 및 공지의 경우 이미 등록한 후에도 이메일 전송이 가능합니다.

이렇게 단체 채팅방과 분리되어 일정 및 공지를 전파할 수 있어 반복적인 전파를 줄여줍니다.


모바일 앱 UI

3 - 앱

모바일 웹 앱 UI

3 - 웹


💥 모바일 상세 UI

동아리 등록
등록 전 안내사항 기본 정보 입력 추가 정보 입력 입력 정보 확인
계좌 입력 등록 완료 전용 페이지 공유

회원 관리
목록 정렬 옵션 학기 선택 바텀시트
상세 정보 역할 변경 검색

물품 관리
목록 정렬 옵션 필터 옵션
필터링된 목록 생성 상세 정보
대여 내역 전체 물품 대여 내역 검색

회비 관리
목록 날짜 필터 내역 필터 검색

일정 관리
캘린더 Month 뷰 캘린더 Day 뷰 목록(Month 뷰)
생성 상세 정보 회원들에게 이메일 전송

내 동아리
내 동아리 상세 정보 회원들에게 이메일 전송 전용 페이지 정보
가입된 동아리 목록 회장 위임 위임할 회원 선택

모임 관리
목록 상세 정보 공유 생성

설정
설정 테마 변경


📝 사용 기술

구분 내용
상태 관리 Riverpod
이미지 업로드 S3 Presigned URL
HTTP 통신 Dio, Dio Interceptor
로그인 Firebase, JWT
패턴 MVVM
결제 PortOne 테스트 결제
배포 Fastlane 및 Firebase App Distribution으로 QA용 배포

🧐 소개

이름 학과 이메일 역할
강동우 소프트웨어학과 [email protected] Front-end (임원진 App, UI/UX 설계)

✅ 규칙

코드 컨벤션
구분 규칙
Name • 클래스 이름은 Pascal Case를 사용
• 변수 및 함수 이름은 Lower Camel Case를 사용
• 상수 이름은 대문자와 언더스코어(_)를 사용
Format • 라인의 길이는 120자로 제한
• 위젯 사용 시 마지막에 콤마(,)를 사용해 자동 코드 정렬에서 줄 바뀜 적용
• 들여쓰기는 2칸 사용
주석 • 문서에는 /// 사용
• 간단한 주석에는 // 사용

브랜치 규칙

설명

구분 규칙
Name WHD-지라이슈번호_태그-브랜치 제목의 규칙으로 작성
• 이슈를 해결하기 위한 브랜치를 만드는 것을 기본으로 함
Tag type feat : 새로운 기능 추가
chore : 사소한 코드 수정
fix : 에러 및 버그 수정
docs : 문서 수정
design : 디자인 관련 코드 추가 및 수정
refactor : 코드 리팩토링
cicd : 배포 관련 설정 추가 및 수정

예시

WHD-1_feat-add_member_list_page

WHD-12_fix-fix_overflow_in_login_page

커밋 규칙

설명

구분 규칙
Name [WHD-지라이슈번호] 태그: 커밋 제목의 규칙으로 작성
• 작은 단위로 커밋을 작성하는 것을 기본으로 함
Tag type Init : 프로젝트 생성
Feat : 새로운 기능 추가
Chore : 사소한 코드 수정
Fix : 에러 및 버그 수정
Docs : 문서 수정
Design : 디자인 관련 코드 추가 및 수정
Refactor : 코드 리팩토링
CI/CD : 배포 관련 설정 추가 및 수정

예시

[WHD-1] Init: Create project
- 프로젝트 생성
...

[WHD-2] Feat: Add login page
- 로그인 화면 추가소셜 로그인 연결
...

풀 리퀘스트(PR) 규칙

설명

구분 규칙
Name [WHD-지라이슈번호] 태그: PR제목
• 태그는 브랜치의 태그와 동일하게 사용
• 내용에는 자신이 작업했던 작업 상세하게 기록
• 모바일 및 웹의 경우 작업한 UI 캡쳐본 업로드
Tag type feat : 새로운 기능 추가
chore : 자잘한 코드 수정
fix : 에러 및 버그 수정
docs : 문서 수정
design : 디자인 관련 코드 추가 및 수정
refactor : 코드 리팩토링

예시

[WHD-1] Feat: Add member list page

[WHD-12] Fix: Fix overflow in login page


🎉 수상

KakaoTalk_Photo_2024-12-05-20-14-21

2024-2 AJOU SOFTCON 최우수상(1위)

KakaoTalk_Photo_2024-12-05-19-46-25


2024-2 BM 발명 아이디어 경진대회 최우수상(2위)
SCR-20241205-rfcf

About

[2024-2 SW 캡스톤디자인] 모바일 개발을 위한 레포지토리

Resources

Stars

Watchers

Forks

Languages