프로젝트/Digital Twin Bootcamp

[Team 6] Edukit(공장 기기 kit) 디지털 트윈 프로젝트

Ail_ 2022. 3. 23. 13:59

프로젝트 개요

프로젝트 명

에듀키트 디지털 트윈 모니터링 시스템 구축

구성원

멘토 @허재준

팀장 @김채은

팀원 @김희선 @진아영 @백동기

프로젝트 기간

프로젝트 총 기간 2022-03-16 ~ 2022-04-28


프로젝트 기획

기획 목적

기획 아이디어

산업 분야로 옮겨진 메타버스 및 디지털 트윈을 통해 기존의 자동화된 기기 관리를 웹 UI UX로 구현하고, 구현한 기기의 실시간 데이터 확인 및 불량품 판독을 가능하게 하여 기기 관리자로 하여금 기기제어 및 생산품 관리가 용이하도록 함.

프로젝트 방법 및 과정

기능 정의

불량품 확인 및 체크

  • edukit의 실시간 데이터를 three.js로 웹에서 확인 가능
  • 웹에서 기기 클릭 후 방향키로 움직임을 조작 가능
  • 비전인식으로 불량품 판별(주사위) 시 웹에서 체크 가능

실시간 데이터 확인 대시보드

  • 실시간 데이터들을 three.js로 디지털 트윈된 3D 오브젝트와 함께 실시간 연동 그래프로 표시
  • 지정한 주사위 숫자일 경우 불량품으로 간주
  • 마이페이지는 사용자 정보 확인 및 수정이 가능하며 모달로 생성
  • 그래프 항목 예시
    • 3호기 좌표값 숫자 카드
    • 비전센서 : 주사위 숫자 값 막대 그래프
    • 주사위 홀짝 비율 값 도넛 그래프
    • 불량 비율 값 도넛 그래프
    • 하루 생산량 그래프 (이전 데이터는 가짜로 넣기) 꺾은선 그래프 선 2개(양품 수량 데이터 하나, 불량품 수량 데이터 하나)

기능 구현 방법

프론트엔드

  • 프론트 화면은 Vue.js로 구현
  • 3D 모델은 three.js로 구현
  • 대쉬보드 그래프는 chart.js로 구현

백엔드

  • 백엔드 서버는 Node.js로 구현

IoT/PLC

  • 데이터 수집은 mqtt로 구현

Infra

  • 코드 버전은 GitHub Repository로 관리
  • discord 및 게더타운을 이용하여 소통 및 내용 기록
  • notion을 통해 일정 및 문서 관리

프로젝트 상세

계획

요구사항 리스트

  1. 사용자 회원가입 및 로그인 기능
  2. 에듀키트의 실시간 데이터를 연동하여, 웹 기반으로 모니터링 할 수 있는 기능
  3. 에듀키트 가상 3D 모델이 디지털 트윈된 모습을 웹 화면으로 보고싶음

요구사항 분석

  1. 사용자 회원가입
    1. 사용자 회원가입 및 로그인은 심플한 UI를 통해서 빠르게 개발해낸다.
    2. 회원가입 할 때, 비밀번호는 암호화 한다.
  2. 사용자 로그인
    1. 로그인 할 때는 로컬 스토리지의 토큰을 통해서 세션을 유지한다.
  3. 에듀키트 실시간 데이터
    1. 에듀키트 실시간 데이터는 SmartConnector.exe를 실행하여 실시간 데이터를 MQTT로 받아 개발해낸다.
    2. 받아온 실시간 데이터를 대시보드 및 그래프를 통해 구현한다.
    3. 불량품이 생긴 경우 대시보드 화면 내부에서 발생한 수량을 표시한다.
  4. 에듀키트 가상 3D 모델
    1. 에듀키트 가상 3D 모델은 three.js를 사용해 웹에 표시한다.

작업 리스트

  1. 프론트엔드 관련 개발 리스트
    1. 각 기능 화면 화면구성 & 퍼블리싱
    2. 회원가입 및 로그인 화면 & 로직 구현
    3. 에듀키트 three.js 가상 모니터링 화면 & 로직 구현
    4. 실시간 데이터 대시보드 화면 & 로직 구현
  2. 백엔드 관련 개발 리스트
    1. 회원가입 및 로그인 기능을 위한 데이터 모델링 / API 설계 및 개발
    2. 실시간 데이터 모니터링 관련 데이터 모델링 / API 설계 및 개발
    3. MQTT로 수신한 정보 데이터베이스에 저장
  3. IoT/PLC 관련 개발 리스트
    1. SmartConnector.exe 사용하여 MQTT로 실시간 데이터 수신하기
    2. SmartConnector.exe 사용하여 MQTT로 웹에서 조작한 정보 전송하기
  4. 인프라 구축
    1. 도커 컴포즈로 vue, node.js, mqtt 실행하는 도커파일 만들고 공유하기
    2. github 레포지토리 만들고, 팀원들 콜라보레이터 추가하기