1. SPEC 발표
IoT 기술을 활용한
스마트케어 시각화 웹 구현
Team : 이재동, 이현재, 유재민
2015. 10. 02
2. Contents
Overview
Project Approach
Goal
Requirement
Approach
Development Environment
Architecture
Basic Spec
Current Status
Further plan
Division and Assignment of work
Schedule
3. Overview
프로젝트 제목
IoT 기술을 활용한 스마트케어 시각화 웹 구현
프로젝트 주제
범용성을 가지는 웹 차트 라이브러리를 직접 구현하고
이를 웹 페이지에 시각화 한다.
요구사항
스마트 기기의 센서 값을 실시간으로 입력 받는다.
JavaScript를 이용하여 웹 차트 라이브러리를 구현한다.
사용자의 입력에 동적으로 반응하는 웹 사이트를 만든다.
4. Project Approach
• 실시간으로 Health Data를
측정하는 스마트 기기의 증가
• Health Data를 시각적으로 표시할
수 있는 웹 차트의 필요성 증가
• 다양한 스마트 기기의 등장
• 다양한 스마트 기기에서
이용 가능한 반응형
웹사이트의 필요성 증가
5. Goal
MQTT로 실시간 데이터를 입력 받는다.
JavaScript로 웹 차트 라이브러리를 구현한다.
스마트 케어를 목적으로 한 특수한 차트를 제공한다.
- 맥박 수, 수면 주기 등의 건강 상태를 실시간으로 표시
- 위험, 보통 등의 상태를 시각화 하여 표시 및 경고
여러 웹사이트에서 재사용이 가능한 구조로 개발한다.
반응형 웹 사이트를 만든다.
6. Requirement 1 Requirement 2 Requirement 3
• 스마트 기기의 센
서 값을 실시간으
로 입력 받을 수
있도록 구현.
• 3종류 이상의 차
트를 표현 가능하
도록 구현
• 차트에 애니메이
션 기능이 가능하
도록 구현
• 다양한 기기에서
사용 가능하도록
반응형 웹 구현
• 사용자의 입력에
동적으로 반응하도
록 구현
Requirement
IoT 라이브러리 웹 사이트
11. Basic spec
• [기능 1] 실시간으로 data를 입력받는다.
• MQTT를 이용하여 스마트 기기의 센서 값을 실시간으
로 받는다.
• [기능 2] 3종류 이상의 스마트케어 전용 차트를 만들 수
있는 라이브러리를 만든다
• [기능 1+2] 실시간의 데이터 변화를 차트로 나타낸다
• [기능 3] 다양한 기기, 다양한 브라우저에서 작동 가능하
도록 한다.
12. Current State
• MQTT 구축
• AWS SERVER
Front-
end
Back-
end
• WEB SITE 구상 및 제작
• Bootstrap
Study
• MQTT
• AWS SERVER
• HTML,CSS, Bootstrap
• Java Script
13. Further Plan
• MQTT 보완
• Data receiver & alarm 기능
• Node.js
Front-
end
Back-
end
• WEB SITE 보완
• Library 만들기
• 심박수 chart
• 수면주기 chart
• 체온 chart
14. Division and Assignments
분류 항목 담당자
Server 경고 전송 기능 유재민
프로토콜 변환 기능 유재민
IoT MQTT 보완 이현재
데모 shell 파일 작성 이현재
Web Web 디자인 이재동
반응형 웹 구축 이재동
Library 심박수 chart 유재민
체온 chart 이현재
수면주기 chart 이재동
Chart 애니메이션 유재민
Chart 반응형 기능 추가 이현재
위험 감지 알고리즘 이재동