MWD / 2020-02-OSS-TermProject

Mask-Wearing Discriminator!

웹캠을 이용한 실시간 마스크 착용 판별 및 출입부 작성 기능을 제공합니다.

Contents

1. About The Project
   • Built With
2. Getting Started
   • Connect to Server
   • Installation
   • Initial setting
3. Usage
4. Roadmap
5. Precautions
6. Contributing
7. Reference
8. License
9. Contact

About The Project

전례 없는 COVID-19가 창궐함에 따라 전염을 막기 위한 마스크 착용은 필수 불가결의 의무가 되었고, 출입자 통제 및 기록, 마스크 착용 여부 판별에 대한 업무가 증가하고 있다.
그래서, 우리는 인공지능을 활용해 이러한 업무를 뒷받침할 수 있는 간단한 시스템을 제작해보게 되었다.

쉽고 빠르게 머신러닝을 가능케 하는 오픈소스인 구글의 Teachable Machine 2.0을 이용한 마스크 착용 판별 프로그램입니다.
Teachable Machine 2.0을 이용해 마스크 착용을 유형별로 학습시킨 모델을 만들었습니다.
이 프로그램은 웹캠을 통해 입력되는 사람의 얼굴을 실시간으로 인식해 마스크 착용 여부를 판별합니다.
마스크 착용 판별 이외에 출입자 인적사항 기록 기능과 기록을 파일화해 저장하는 기능도 제공합니다.

Built With

• Bootstrap
• JQuery
• Nodejs
  • express
  • ejs
• python
  • selenium
• Teachable Machine
• Kakao TTS API

Getting Started

Connect to Server

• https://www.khumwd.ml:8080 에 오시면 바로 실행이 가능합니다

Installation

(배포 이전)Local 에서 실행하는 방법입니다.

1. Repository Clone 하기 sh git clone http://khuhub.khu.ac.kr/MWD/2020-02-OSS-TermProject.git
2. 모델 만들기
   1. 파이썬 모듈 설치하기(파이썬이 설치된 폴더에서) sh pip install -r requirements.txt
   2. 크롬 드라이버 설치
      https://chromedriver.chromium.org/downloads 에 접속하여 자신의 크롬 브라우져와 맞는 버전 다운받기
   3. google.py에 크롬드라이버 경로 설정하기 python chromedriver_path = "경로"
   4. google.py실행하기 sh python google.py 5.모델 만들기
      https://teachablemachine.withgoogle.com 에 접속하여 /python/model 에 저장된 크롤링된 이미지들을 넣어 모델을 만든다
      
      
3. 로컬서버 실행하기
   1. NPM 패키지 설치하기 sh npm install
   2. index.ejs에 API 넣기 JS const URL = 'Teachable Machine 모델의 Url을 입력';
   3. NPM을 이용해 서버 시작하기 sh npm start

Initial setting

1. Main page 접속
   1.1 로컬서버를 직접 열어 https://localhost:3000 으로 Main page에 접속하거나, https://www.khumwd.ml:8080 를 통해 Main page에 접속합니다.
   
   
2. 카메라 허용
   2.1 카메라 권한 요청 메시지가 표시되면 허용을 선택합니다.
   
   

Usage

사용하는 장소를 입력해 준다.

1. 마스크 착용 판별 기능
   1.1. 카메라 정면을 바라보고 서있는다.
   1.2. 마스크 착용 여부에 따라 영상 출력부 우측의 이미지가 변하고 소리가 출력된다.
   

   • 정상 착용 예시
     
     
     
     
     
   • 불량 착용 예시
     
     
     
     
     

2. 출입내역 기록 기능
   2.1. 처음 페이지에 접속하여 출입내역을 작성할 곳의 위치를 입력한다.
   2.2. 건물에 출입하는 인원들은 캠 앞에서서 이름, 전화번호, 신분을 선택하고 제출을 누른다.
   2.3. 이때 마스크를 착용하지 않았다면 작성한 내용을 제출이 불가능하다.
   
   

   • 인적 사항 입력란
     
     
     
     
     

3. 출입내역 저장 기능
   3.1 지금까지 기록한 내용들을 '저장' 버튼을 눌러 파일을 생성한다.
   3.2 생성한 파일을 '다운로드'를 통해 로컬에 저장한다.
   
   

   • 다운로드 예시
     
     
     
     
     

Roadmap

제안된 기능 및 발견된 오류는 목록은 Issues 를 참조하십시오.

Precaution

아래 주의사항에 유의해 사용해 주세요.
1. 마스크 착용 여부 판별에 웹캠의 실시간 영상 데이터를 사용. 브라우저의 웹캠 접근 권한 허용 필수. 웹캠 없이도 출입자 인적사항 기록은 가능하나 마스크 착용 여부 판별은 불가.
2. 인터넷 브라우저별로 json 및 txt 파일 생성 방법이 달라 Internet Explorer에서는 출입자 인적사항 기록은 가능하나 저장은 불가
3. Internet Explorer에서 대화 상자(Prompt)의 출력 방식이 Chrome 과는 달라 대화 상자 출력 불가. 따라서 초기에 위치 입력이 불가
4. 출입자 인적사항을 기록한 파일을 다운로드 시 반드시 로컬의 Download 폴더에 저장됨. 저장 경로 변경 불가.
5. 웹캠 앞에서의 재빠른 움직임은 마스크 착용 여부를 정확히 판별하지 못할 수 있음.
6. 크롬 브라우저의 특성상 첫 음성 출력에 소요되는 시간이 지연될 수 있음.

Contributing

해당 프로젝트에 기여하고 싶다면 아래의 절차를 따라주세요.
어떠한 기여도 환영입니다!!.

1. Fork the Project
2. Create your Feature Branch (git checkout -b feature/AmazingFeature)
3. Commit your Changes (git commit -m 'Add some AmazingFeature')
4. Push to the Branch (git push origin feature/AmazingFeature)
5. Open a Pull Request

Reference

Teachable Machine 2.0 · W3schools · Express · Node.js · selenium

Kakao TTS API

License

MIT 라이센스를 적용합니다. 자세한 정보는 License를 확인해주세요.

Contact

[Taeyoung Kim] rlaxodud9809@khu.ac.kr
[Jaeho Lee] dlwogh9344@khu.ac.kr

Project Link: http://khuhub.khu.ac.kr/MWD/2020-02-OSS-TermProject