웹기반의실시간장치관리시스템 권대건 부산대학교컴퓨터공학과 duskan@pusan.ac.kr Abstract 유조선과같은큰선박에서는배의균형을위해항해중에탱크와펌프, 벨브를관리해야한다. 선박에서는관제시스템을이용하여탱크의상태를체크하고펌프와벨브를관리한다. 이러한관제시스템은대부분 PC 환경에서이루어진다. 우리는스마트폰이라는새로운매체를통해원격관제시스템을연구하였다. 스마트폰을이용하므로써선박내어디서든쉽게장치의상태를파악할수있는장점을얻을수있엇다. 하지만스마트폰이라는환경에서는 PC 환경에비해화면의크기와같은한계점이존재하였으며, 또한스마트폰의접근성은보안문제라는새로운이슈를만들었다. 그러므로여기서는단순관제기능을가지는스마트폰과관리기능을가지는웹을분리하고그중웹의기능에대해소개하고자한다. 그리고앞으로관리용웹페이지에서나아가야할방향에대해의논하도록한다. Keywords: device, Tank, Smart phone, 1 서론 대형선박에서유수탱크모니터링시스템은매우중요하다. 앞서우리는스마트폰을이용하여선박내어디서든장치의상태를손쉽게파악할수있는원격관제시스탬을소개하였다 [1]. 스마트폰을이용한원격관제시스템을통해선박을운행하는선원들이휴대하기간편한스마트기기로선박내어디서든간편하게장치의상태를알고대처할수있다는장점을얻을수있었다. 하지만스마트기기의경우대부분화면의크기가작아값을입력하거나수정하기가불편하며, 무선네트워크를이용하므로스마트기기에서관리에관련된기능을추가하게된다면보안상에큰문제가발생하는등의단점이존재한다. 그러므로장치의상태와고장유무를확인하는모니터링기능과원격관제시스템에대한설정및관리기능을 Application 과 Web 으로분리하여앞서언급한단점을보완하였다. 여기서는그중관리기능을가지고있는 TankBoy 웹페이지이에대해자세히소개하고앞으로의진행방향을논의하고자한다. 1
Tank 센서정보보기 그림 1: Tank 센서정보에서는탱크이름, 센서정보가저장된시간, Low Middle High 위치의온도, 레벨, 압력정보를보여준다. Tank 정보검색화면 그림 2: 웹페이지가운데위치한검색기능을이용하여원하는조건의 Data 만조회할수있도록검색할수있다. 검색은날짜, 시간, Value 별로가능하며, 위의조건을섞거나생략을할수있어사용자가쉽게원하는값을검색할수있다. 2 센서정보 센서정보에서는각장치에있는센서에서측정된값을사용자에게보여준다. 센서정보는장치 의종류에따라약간의차이가있다. 2.1 Tank Tank 센서정보에서는 Tank센서와관련된항목들을보여준다. 위그림 1에서와같이탱크이름과이센서정보가저장된시간을표시하고 Low, Middle, High의온도를나타낸다. 또한현재 Level 과 Pressure 정보도제공한다. 또한그림 2에서처럼 Tank 센서정보에서는검색기능을제공한다. 검색기능은시간기준의검색과값의크기에따른검색으로나뉘며두개의조건을혼합하여검색도가능하다. 사용자는시간에따른검색을할수있다. 사용자가정보를보기원하는시간의범위를입력하면해당범위를만족하는값을사용자에게보여준다. 또한 2013년 01월 01일이후데이터전체를검색하고싶을경우앞에는 2013년 01월 01일이란값을넣고, 뒤쪽조건에는아무런조건을넣지않고빈칸으로둔다면 2013년 01월 01일이후전체 Data에대한검색이가능하다. 또한검색기능에서는시간이외에값의범위에따라검색도가능하다. 사용자가검색하고자 2
Valve 센서정보화면 그림 3: Valve 센서정보에서는벨브이름, 벨브정보가저장된시간. 벨브의게이지, 벨브개폐유무, 벨브명령상태, 명령의성공유무에대한값을보여준다. Pump 센서정보화면 그림 4: 웹페이지가운데위치한검색기능을이용하여원하는조건의 Data 만조회할수있도록검색할수있다. 검색은날짜, 시간, Value 별로가능하며, 위의조건을섞거나생략을할수있어사용자가쉽게원하는값을검색할수있다. 하는값의 type 과값의범위를지정하면웹페이지에서해당결과를보여준다. 이러한기능은앞 서언급한시간검색기능과혼합하여사용가능하며, 이를통해사용자는좀더복잡하고세밀한 검색조건을이용하여검색할수있다. 2.2 Valve 그림 3 에서처럼 Valve 센서정보에서는벨브이름, 벨브정보가저장된시간. 벨브의게이지, 벨브개폐유무, 벨브명령상태, 명령의성공유무에대한값을사용자에게보여준다. 이정보를이용하여사용자는지금현재밸브가열려있는지혹은닫혀있는지, 벨브에내린명령이정상적으로작동하는지를확인할수있다. 2.3 Pump Pump 센서정보에서는펌프이름, 펌프정보가저장된시간, 펌프작동유무, 펌프명령상태, 명령성공유무에대한값을보여준다. 사용자는이를통해해당시간에펌프가올바르게작동하였는지. 펌프에대한명령이제대로수행되었는지, 그외오류는없었는지를확인할수있다. 3
장치정보 (Device DB) 보기 그림 5: 장치조회화면에서는장치의이름과장치를설치한날짜, 장치의위치, 평균수명, 장치의관리자, 장치제조사정보를조회할수있다. 3 장치정보 장치정보 (Device DB) 에서는장치관리에대한다음과같은기능을제공한다. 장치정보에서는현재설치된장치에대한장치정보를보여주고필요한경우에는장치를추가, 수정또는삭제할수있다. 장치정보에는장치를설치한날짜. 평균적인수명, 장치의연결위치관리자, 제조회사에대한정보가입력되며, 이는추후장비설치및수명예측에관련된정보가필요할경우해당정보에대해논의를거친후추가할수있다. 3.1 장치정보조회 장치정보 (Device DB) 는센서를통해받아오는장치각각의기본적인정보를의미하며장치 정보로는장치이름, 장치설치날짜, 장치위치, 평균수명, 관리자, 제조사가있으며장치정보 4
(a) (b) 그림 6: 장치정보추가 / 수정 조회화면을통해설치된장치의정보를확인할수있다. 또한장치정보조회화면에서해당버튼을클릭하여장치를추가하거나장치정보를수정, 삭제할수있다. 3.2 장치정보추가 / 수정장치정보조회버튼에저장치추가를누를경우그림 6의 (a) 와같이장치정보를입력하는화면으로넘어가간다. 장치의이름, 타입, 위치, 평균수명, 관리자, 제조사설치날짜를입력한후확인버튼을누르면장치가성공적으로추가된다. 이때평균수명의경우초단위이며, 값을 10진수또는지수승형태로입력할수있다. 또한장치정보를수정해야하는경우수정을통해수정할수있다. 기본적인인터페이스는장치추가기능과동일하며다만각항목이빈칸이아닌수정전입력된값이쓰여져있어사용자가수정하려는장치정보만수정하면된다. 만약사용자가값을잘못수정한경우다시쓰기버튼을누르면수정하기전장치정보값으로돌아간다. 3.3 장치정보삭제 장치정보를삭제해야할경우조회화면에서삭제버튼을눌러삭제할수있다. 장치를삭제시 장치삭제를확인하는 Dialog Box 가생성되며확인을누를경우장치가성공적으로삭제된다. 4 결론및앞으로의과제 본논문에서는웹페이지와모바일어플리케이션의구분의필요성에대해설명하고그중 TankBoy 웹페이지의센서정보의확인과검색기능, 장치정보의조회와관리에필요한기능을알아보 았다. 최근 HTML5 에대한사람들의관심이증가하면서웹페이지에대한많은양의정보와 5
오픈소스를쉽게찾아서적용및응용이가능하다. 또한다른특별한환경설정이필요없고웹브라우저만있으면접속이가능하며스마트폰보다입 / 출력이간편하므로관리자가유수탱크를관리하기편하다. 하지만아직웹페이지의레이아웃및 UI에대한이해가부족하여 UI 가약간미숙하며센서정보의경우각각의 Data의값을표를통해보여주지만정보가시각화되지않고나열되어있어사용자가한눈에정보를이해하기에는많이부족하다. 그러므로향후 UI를보완하고정보를시각화하기위해 HTML5 Canvas를이용한 Graph형식의시각화에대해연구할예정이다. References [1] Hwan-Gue Cho Haesung Tak, Daegun Kwon. Water tank monitoring and visualization system with smart phones. Proceedings of the SIGCHI conference on Human factors in computing systems, 3:142 146, 2013. 6