👂 VODA

💌 프로젝트 개요

2023.07.04 ~ 2023.08.18(7주)

기획 배경

시각장애인이 웹서비스 사용에 있어서 비장애인과 비교하여 불편함이 많음.

웹페이지에 있는 많은 컴포넌트로 인해 정보인지의 어려움
스크린리더기로 인식이 안되는 웹서비스 또는 이미지의 경우 정보 획득 불가

기존 서비스

설리반+ : 사진을 찍어서 이미지 분석
BeMyEyes : 봉사자와 랜덤 매칭 영상통화

VODA -> 실시간으로 지인과 영상통화

❤️ 역할

	Part	Detail
고세훈	Front-End	UX/UI 담당 / 유저 친화적 디자인
김민재	AI	프로젝트 관리 / 색상, 객체 인식, 발표
김지원	Back-End	서기 / DB 설계, 표정 인식, 영상 편집
나건	Back-End	서비스 기획 / JWT 적용, SSE 적용, Redux 관리
윤선희	Back-End	팀장 / BE Api 구현, 서비스 인프라 구축
최규헌	Back-End	일정 관리 / API 구현, 협업툴 및 문서 관리

🕹️ 기술 스택

Front

React(by TypeScript)
Redux
WebRTC(with OpenVidu)

Back

Spring Boot
JPA
MyBatis
MySql
Flask

AI Model

TF; Face-api.js
OpenCV(k-Means Clustering & k-NN algorithm)
Yolo V5

Infra

AWS EC2
Nginx
Docker

🧵 환경 설정

바로가기

🔎 서비스 소개

회원 관리

회원가입

비밀번호 변경 및 정보수정

임시 비밀번호 발급

환경설정

로그인

고객의 소리함

고객의소리함 목록 및 상세보기

고객의소리함 글 작성

고객의소리함 글 수정 및 삭제

고객의소리함 댓글 작성

화면 모드

화면 모드 토글로 변경

영상 통화

친구검색 및 추가

통화 알림

표정 인식

표정 듣기

표정 보내기

색상 인식

색상인식

프로젝트 산출물

DB ERD

요구사항 명세서

API명세서

아키텍쳐 다이어그램

📽️ UCC

유튜브 영상 - 심청전

💎 느낀 점(소감)

고세훈
- 처음 마주한 어려움으로는 팀원 중, 팀원 지인 중 아무도 시각 장애인이 존재하지 않아 당신의 입장을 헤아리기가 어려웠습니다. 그래서 타겟 유저가 확실한 프로젝트인 만큼 실제 복지관에 방문하여 피드백도 수렴하고 실제 그분들과 인터뷰를 가져 인터넷을 사용하는데 어려움을 느끼는 것이 어느것인지 의견을 들을 수 있었습니다. 후에 돌이켜 생각해보니 이것이 사용자 중심의 UI / UX 개발이었고 애자일한 개발이었다고 느꼈습니다.
  인터뷰 진행 결과 사용중이신 스크린 리더기를 안대를 착용하고 직접 사용해가며 개발을 진행해 실제 그분들의 입장에서 개발하려고 많은 노력을 기울였던 프로젝트였습니다. 이를 통해 진정한 의미의 UX가 뭔지 정말 고민해보고 생각하며 aria-label과 aria-live를 사용해 접근성을 높이기 위해 노력했습니다. 추가로 tabIndex를 사용해 컴포넌트 배치를 어떻게 할지 생각하며 개발할 수 있던 귀중한 경험이었습니다.
  훌륭한 팀원들을 만나 협업의 시너지가 어느 것인지도 배웠고, 결과물이 잘 나온 것 같아 만족했던 프로젝트였습니다. 갈등 해결의 부분에도 서로 솔직하게 자신의 의견을 말하는 대신 상대방의 의견을 무시하지 않고 경청을 했기에 더 좋은 결론으로 도출될 수 있던 프로젝트였습니다. 프로젝트를 진행하다보면 실력과는 별개로 열심히 하지 않는 팀원을 만나 고생하는 케이스도 여럿 보았는데 이번 팀원들은 모두가 할 일을 추가로 찾아가며 프로젝트의 완성도를 높이기 위해 노력해준 만큼 너무 감사하고 운이 좋았던 프로젝트였습니다.
김민재
- 프로젝트를 하나부터 열까지 모든 기술 스택과 과정을 관리한 첫 번째 프로젝트였습니다. 뼈대를 만들고 디자인적 요소를 넣고, 기능을 하나씩 만들어 완벽한 발표까지 진행하여 최종 최우수 프로젝트로 선정되었습니다. 성공적인 결과를 내는 데 있어서는 일정 관리와 팀원들과의 협업이 가장 중요했습니다.
  팀장은 아니지만 테크 리더로서 기술적인 부분을 성장시켰고, 책임감 있는 팔로위쉽에 대해서 배웠습니다. 개인적으로 프로젝트 진행에 있어 가장 중요하게 생각한 것은 MVP였습니다. 서비스에서 많이 쓰는 용어이지만 애자일한 개발 관리에 있어서도 최소 기능부터 최종 목표까지 마찬가지라 생각했습니다. 내 파트 외에 다른 파트(Front - React, Back - SpringBoot)의 공부도 병행하여 기술적 부분을 이해할 수 있었던 것도 큰 이유라고 생각합니다.
  무엇보다 중요한 것은 팀원들과의 소통이었습니다. JIRA, Notion을 이용한 협업과 commit 메시지를 통해 서로의 작업 척도를 알 수 있었고 데일리 스크럼과 주간 스프린트로 업무 정리 및 향후 프로젝트 관리에 있어 효율적이었습니다. 계속해서 의견을 나누고 얘기하다 보니 갈등 상황도 적었고 업무 처리도 빠르게 할 수 있었습니다.
  프로젝트 진행 그 자체로도 경험치가 되겠지만, 무엇보다 함께 한 책임감 넘치는 사람들 덕분에 더욱 멋진 프로젝트 결과물, 값진 추억과 인연을 만들었습니다. 팀원 모두 감사합니다!! (_ _)
김지원
- VODA를 기획하고 개발하면서 사용자의 입장에서 생각하면서 서비스를 만드는 좋은 경험을 할 수 있었습니다. 그리고 이번 프로젝트를 하면서 JPA, TypeScript, AI 관련 지식 등 새로운 것들을 배울 수 있어서 좋았습니다. 특히 AI파트를 서브로 담당하면서 face-api 와 같은 오픈 소스를 분석하고 프로젝트에 맞게 적용하면서 AI에 대한 지식을 학습했을 뿐만 아니라 코드를 분석하고 필요에 맞게 변형하여 적용하는 실력을 키울 수 있었습니다. 마지막으로 7주동안 협업해서 좋은 결과물을 만들어낸 팀원들!!! 너무 고맙습니다!!
나건
- 흠.. 일단 프로젝트에 처음 참여해서 초기에는 많은 어려움이 있었지만, 그 과정에서 새로운 지식과 기술을 습득할 수 있었습니다.
  프로젝트 기간 동안 팀원들과의 의사소통과 협력을 통해, 함께 성장하는 가치를 느낄 수 있었습니다.
  훌륭한 팀원들의 도움과 협력 덕분에 놀라운 결과를 이룰 수 있었던 것 같습니다.
  이번 프로젝트가 처음이라는 점을 감안할 때, 팀원들과 함께 이룬 성과에 대해 정말로 자랑스럽게 생각합니다. 굿!
윤선희
- 실제 사용자의 피드백을 받아가며 서비스를 개발해나가는 소중한 경험이었습니다. 또한 배포를 통해서 저희 서비스의 아키택처에 대해서 깊게 고민할 수 있는 시간이어서 좋았습니다. 7주간의 짧은 개발 기간동안 탄탄한 팀워크로 좋은 결과물을 낼 수 있어서 팀원들에게 감사하다는 말을 전하고 싶습니다.
최규헌
- 우선 프로젝트 주제에 대해서 모든 팀원이 깊게 고민하고 먼저 생각하면서 진행했기 때문에 단순 프로젝트를 위한 프로젝트가 아닌 실제 서비스를 개발하고 있다는 생각이 들어 뜻 깊었습니다. 개인적인 수확으로는 Spring Boot, JPA, React에 대한 숙련도를 쌓을 수 있었고 실제 코딩을 많이 해본 것이 도움이 많이 될 것 같습니다. 또한 다른 사람에게 내가 맡지 않은 부분을 오롯이 맡겨본 경험이 이번이 처음 일만큼 팀원들이 믿음직스럽고 개발외적인 팀워크도 잘 맞았어서 좋은 인연을 맺은 것 같습니다. VODA팀 다들 고생했어!!

💾 버전 관리

ver1.0.0
- 버전 관리
- 컴포넌트 추가
ver1.0.1
- Openvidu 라이브러리 추가
- tensorflow의 Face-api.js 적용
ver1.0.2
- 영상 통화 관련 내용 추가(알림 등)
- 친구 기능들 추가
- 사용자 인증 인가 (Redux 적용)
- 최근 통화 목록 조회
ver1.0.3
- flask 서버 연결
- 색상 인식 모델 추가
ver1.0.4
- Yolo V5로 학습시킨 화장품 모델 인식 추가

ggamangcoder / voda Goto Github PK

voda's Introduction