# **Operato Board**
---
## **소개**
* 생산/물류 각 현장의 실시간 현황을 모니터링하고 이슈 상황에 대해 선제적 대처가 가능합니다.
* 기본 개별설비 모니터링 시스템 외에 다양한 물류 데이터의 Visibility 시스템 구축이 가능합니다.
* 별도의 프로그램 설치 없이 파워포인트를 사용하듯 쉬운 인터페이스를 활용하여 복잡한 데이터를 편리하게 구현합니다.

---
![operato-board][operato-board]

[operato-board]: http://www.hatiolab.com/assets/img/operato-detail7.png#brendw1080


## **설치하기**

- **동영상은 Operato ECS기준으로 설치 가이드를 진행하고 있으며 아래 설치 스크립트로 꼭 바꾸어서 설치 필요**

[![Installation](./images/operato-youtube.jpg)](https://youtu.be/AM6LZ_NcNYM)

- 설치 대상 OS, CPU 아키텍처
   - 인텔, AMD
     - 권장 (테스트 됨) : Linux ubuntu 및 centos
     - 사용 가능 (도커-데스크톱으로 테스트) : MacOS
     - 사용 가능 (도커-데스크톱으로 테스트) : Windows
   - ARM
     - 사용 가능 (도커로 테스트 됨) : Raspberry Pi의 raspbian

- 인터넷 브라우저
   - 권장 : 구글 크롬, 사파리, 파이어 폭스
   - 사용 가능 (테스트되지 않음) : Edge
   - 지원되지 않음 : Internet Explorer

- 전제 조건
    - 'docker'및 'docker-compose'가 설치되어야 함
    - https://www.docker.com/

- Operato-Board 설치 스크립트
   - 폴더를 만들고 디렉토리를 폴더를 이동

``` sh
# 설치 스크립트
curl -fsSL curl -O https://raw.githubusercontent.com/things-factory/things-factory/master/packages/operato-board/installer/install.sh | bash -s
```

## **시작하기**
 

1. Overview
![overview]
- 1번 : 홈으로 이동 
- 2번 : 타이틀 Area
- 3번 : Group Area
- 4번 : 사용자 Board메뉴
- 5번 : Board 생성 및 기 생성된 Board list표현

2. 보드 생성 
- 3번 위치 우측의 '+' 버튼을 눌러 **_SCENE 그룹_**을 생성한다.

  ![create-scene]

- Board List에 들어 있는 Create Board를 클릭하여 Board를 생성한다.

  ![create-board-view]

- Board List내에서 보드 생성결과를 확인한다.

  ![hello-board]


[overview]: ./images/board-overview.png

[create-scene]: ./images/create-board-button.png

[create-board-view]: ./images/create-board-view.png

[hello-board]: ./images/hello-world.png

[text-style]: ./images/text-style.png

## **Board Tutorial**
### 1. Countup Board Modeling
  * Tutorial 1 - Scenario Control

    [![Add new Scenario Control UI Board](./images/operato-youtube.jpg)](https://youtu.be/-1bZg75Ao0A?t=117)
    * for data control please refer [1. scenario countup](#1.-scenario-countup)

### 2. Covid19 Status Chart Modeling
  * Tutorial 2 - Making Covid19 Status Chart

    [![Add new Scenario Control UI Board](./images/operato-youtube.jpg)](https://youtu.be/59DF3vvGgDA?t=104)
    * for data control please refer [2. http request with Covid19 API](#2.-http-request-with-Covid19-API)

## **Visualizer Tutorial**
  * Tutorial 3 - 3D Visualizer Modeling

    [![Create 3D UI Board](./images/operato-youtube.jpg)](https://youtu.be/eku1ED66DHE)

## **Senario Tutorial**
### 1. scenario countup
* Tutorial 1 - Scenario Control
  
  [![Add new Scenario Control UI Board](./images/operato-youtube.jpg)](https://youtu.be/-1bZg75Ao0A?t=6)

* Tutorial scenario

  ![Scenario Diagram](./images/operato-scenario-countup.png)   

### 2. http request with Covid19 API
* Tutorial 2 - Making Covid19 Status Chart from [Covid19 API](https://api.covid19api.com/)

  [![Making Covid19 Status Chart from Covid19 API](./images/operato-youtube.jpg)](https://youtu.be/59DF3vvGgDA?t=7)

* Tutorial scenario

  ![Scenario Diagram](./images/operato-scenario-covid19.png)


## **Samples**

| <figure>  ![][01]  <figcaption>Worldmap</figcaption> </figure>                           | <figure>  ![][12] <figcaption>Korail Map</figcaption> </figure> |
|:---:|:---:|
| <figure>  ![][03]  <figcaption>**Floor**</figcaption> </figure>                          |  <figure>  ![][21] <figcaption>**SSL 3 Floor**</figcaption> </figure>|
| <figure>  ![][05]  <figcaption>**Sort monitoring**</figcaption> </figure>                |  <figure>  ![][06] <figcaption>**Piece Sorting Monitoring**</figcaption> </figure>|
| <figure>  ![][04]  <figcaption>**SOP Procgress**</figcaption> </figure>                  |  <figure>  ![][10] <figcaption>**Equipment Monitoring**</figcaption> </figure> |
| <figure>  ![][11]  <figcaption>**Silting & Pressing**</figcaption> </figure>             |  <figure>  ![][02] <figcaption>**Mixing Process**</figcaption> </figure>|
| <figure>  ![][15]  <figcaption>**Process Rate**</figcaption> </figure>                   |  <figure>  ![][16] <figcaption>**Equipment Performance Map**</figcaption> </figure> |
| <figure>  ![][29]  <figcaption>**Dock Status**</figcaption> </figure>                    |  <figure>  ![][18] <figcaption>**QPS Integrated Monitoring**</figcaption> </figure> |
| <figure>  ![][19]  <figcaption>**Facility Operation Status**</figcaption> </figure>      |  <figure>  ![][20] <figcaption>**SMT Operation Monitoring**</figcaption> </figure> |
| <figure>  ![][07]  <figcaption>**Yield View**</figcaption> </figure>                     |  <figure>  ![][08] <figcaption>**Performance View**</figcaption> </figure> |
| <figure>  ![][22]  <figcaption>**Stock movement Event**</figcaption> </figure>           |  <figure>  ![][23] <figcaption>**Delivery Status**</figcaption> </figure>  |
| <figure>  ![][27]  <figcaption>**All Process Rate**</figcaption> </figure>               |  <figure>  ![][28] <figcaption>**Inspection status by Fleet**</figcaption> </figure> |
| <figure>  ![][30]  <figcaption>**Facility Control Monitoring**</figcaption> </figure>    |  <figure>  ![][24] <figcaption>**Fleet Efficiency**</figcaption> </figure> |
| <figure>  ![][31]  <figcaption>**Visualizer**</figcaption> </figure>                     |  <figure>  ![][14] <figcaption>**Indoor Vilsualizer**</figcaption> </figure> |
| <figure>  ![][09]  <figcaption>**3D warehouse view**</figcaption> </figure>              |  <figure>  ![][13] <figcaption>**Warehouse Visualizer**</figcaption> </figure>  |


[01]: http://www.hatiolab.com/assets/img/thingsboard-01.png
[02]: http://www.hatiolab.com/assets/img/thingsboard-02.png
[03]: http://www.hatiolab.com/assets/img/thingsboard-03.png
[04]: http://www.hatiolab.com/assets/img/thingsboard-04.png
[05]: http://www.hatiolab.com/assets/img/thingsboard-05.png
[06]: http://www.hatiolab.com/assets/img/thingsboard-06.png
[07]: http://www.hatiolab.com/assets/img/thingsboard-07.png
[08]: http://www.hatiolab.com/assets/img/thingsboard-08.png
[09]: http://www.hatiolab.com/assets/img/thingsboard-09.png
[10]: http://www.hatiolab.com/assets/img/thingsboard-10.png
[11]: http://www.hatiolab.com/assets/img/thingsboard-11.png
[12]: http://www.hatiolab.com/assets/img/thingsboard-12.png
[13]: http://www.hatiolab.com/assets/img/thingsboard-13.png
[14]: http://www.hatiolab.com/assets/img/thingsboard-14.png
[15]: http://www.hatiolab.com/assets/img/thingsboard-15.png
[16]: http://www.hatiolab.com/assets/img/thingsboard-16.png
[17]: http://www.hatiolab.com/assets/img/thingsboard-17.png#brendw1080
[18]: http://www.hatiolab.com/assets/img/thingsboard-18.png
[19]: http://www.hatiolab.com/assets/img/thingsboard-19.png
[20]: http://www.hatiolab.com/assets/img/thingsboard-20.png
[21]: http://www.hatiolab.com/assets/img/thingsboard-21.png
[22]: http://www.hatiolab.com/assets/img/thingsboard-22.png
[23]: http://www.hatiolab.com/assets/img/thingsboard-23.png
[24]: http://www.hatiolab.com/assets/img/thingsboard-24.png
[25]: http://www.hatiolab.com/assets/img/thingsboard-25.png
[26]: http://www.hatiolab.com/assets/img/thingsboard-26.png
[27]: http://www.hatiolab.com/assets/img/thingsboard-27.png
[28]: http://www.hatiolab.com/assets/img/thingsboard-28.png
[29]: http://www.hatiolab.com/assets/img/thingsboard-29.png
[30]: http://www.hatiolab.com/assets/img/thingsboard-30.png
[31]: http://www.hatiolab.com/assets/img/thingsboard-31.png