Project/Multitouch Table2009. 6. 11. 16:11

6월9일 화요일 종합설계 최종 발표 및 시연을 하였습니다.

모두의 큰 호응과 환호 속에 저희 'Accent' 팀이 1등 최우수상을 수상하였습니다. ^^

한팀 당 주어진 시간이 5분인데 그 시간안에 발표와 시연을 모두 하려 하니 굉장히 촉박하였는데여..

시연을 못한 팀도 다수 있었지만 저희는 다행히 시간안에 시연까지 완료하였습니다.

 

그 동안 처음 다루어 보는 하드웨어라 경험이 없어 시행착오도 많고 힘이 들었지만

이렇게 발표를 하고 나니 보람됩니다.^^

3개월 시간동안 재료 구입 지연으로 2개월을 허비하고 한달 여만에 부랴 부랴 만들게 되었습니다.

그동안 지도해주신 '김병규'교수님과  조원 모두에게 감사드립니다.

 

저희 'Accent'팀은 5명으로 구성되어 있고 소프트웨어 개발 목표는 회의 시스템과 유아 교육 시스템이었지만

현재는 회의 시스템만이 완성되었습니다. 추후 유아 교육 시스템도 개발 예정입니다.

 

다음은 하드웨어모습과 영상처리 모습, 시연 하루 전 연습한 동영상입니다.

학생신분이라 저렴하게 하기 위해 하드웨어 표면을 스티로폼을 재활용하여 좀 허접합니다. ^^;

 

시연 컨셉은 의상 회의로 정하여 그에 따라 연출 하였습니다.

핸드폰으로 촬영한 것이라 화질이 좋지가 않습니다. ;;

 

다음은 프로그램을 실행하는 모습을 화면 녹화한 영상입니다.

회전 및 크기 조절할 때 마우스로 하려니 자연스럽게 되지가 않네여 ^^;

전체 화면 녹화했는데 위 아래 전체 검은 테두리는 먼지..

 

 

다음은 ppt입니다.

 

교수님과 저희 조 사진입니다. 하얀색에 무지개 티가 접니다. ^^;

 

1등 상금으로 문화상품권 20만원을 받았습니다.

5명이라 한명 당 4만원이라는 ;;

 

상장입니다. ^-^

 

 

 

 

 

Posted by 열ㅇl
Project/Multitouch Table2009. 6. 4. 22:27

드디어 프로젝트를 완성하고 최종 발표만을 남겨 놓고 있습니다.

오늘 종합 설계 수업시간에 분반 별 발표를 하였는데 교수님 및 모두의 큰 호응에 정말 기분 좋은 하루였습니다.^^

재료 구입의 지연문제로 한달도 안되는 짧은 기간에 하드웨어와 소프트 웨어를 구현하느라 힘은 좀 들었지만 굉장히 보람차네요.

아직 시연 동영상은 찍지를 못하였지만 곧 올리도록 하겠습니다.

 

touchlibrary를 사용하여 현재는 괜찮은 터치 인식률을 얻었지만 처음엔 둔감한 터치인식률과 현 좌표와 터치 좌표의 불일치로 적지 않은 고민을 하였습니다.

touchlibaray 홈페이지에 사용법이 있지만 저희 처럼 영어에 약한 분들을 위해 ^^;;

조금이나마 도움이 됬으면 하는 생각에 제가 알고 있는 TouchLibrary사용법을 알려드리겠습니다.

 


 

 

 

 

 

 

 

 

 

 

 

 

 

 

1. 영상처리

config.bat 파일을 실행시키면 6개의 창이 나타납니다.

위의 3개의 창은 원영상, mono, smooth를 적용한 영상을 보여주며

아래 3개의 화면은 사용자가 값을 조정해가며 영상의 질을 개선할 수 있습니다.

첫 번째 창은 경계(threshold)값을,

두 번째 창은 밝기(brightness), 명암대비(contrast) 값을,

세 번째 창은 레벨(level) 값을 조정 할 수 있습니다.

 

첫 번째 창에서 'b'버튼을 누르게 되면 배경의 화면을 나오거나 나오지 않게 할 수 있습니다. 이 threshold 값이 매우 중요합니다. 너무 크거나 작아도 터치 감도가 좋지 않습니다. 두 번째 창도 역시 어느정도 밝은 가운데 명암대비를 해야 합니다. 그 후 손가락을 누른 상태에서 이리저리 움직여가며 하얀 점이 끊기지 않고 잘 움직이는지 확인하며 세번째 창의 레벨 값을 조정해 줍니다.

 

저희는 그리하여 저희 환경에서 인식이 잘 되는 값을 찾을 수 있었습니다.
threshold: 32        30

brightness: 125    146

contrast: 208       223

level: 30                 90

 

그 후 Enter를 누르시면 화면이 변하게 되는데 x를  누르시면 현재 값이 저장이 됩니다. Esc를 눌러 종료 후 다시 실행시켜 확인합니다.

 

2. 터치 영역 설정

가장 중요한 부분이 터치영역을 설정해 주는 것입니다.

다시 프로그램을 실행시켜 Enter를 누르면 화면 전체에 녹색의 '+'모양이 나타납니다. 화면 좌상단에는 현재 캠의 영상이 비추어지는데 캠이 스크린 전체를 비출 수 있도록 캠을 조정합니다.

조정이 완료 되면 'c'를 누릅니다.

좌상단 모서리 '+' 부분에 빨간색 화살표가 생기게 됩니다.

이제 부터가 중요합니다.

그 '+' 부분을 누르게 되면 전체 화면의 색깔이 하얗게 변하게 되고 띄게 되면 빨간 화살표가 다음 '+'로 이동하게 됩니다. 그렇게 차례로 끝까지 누르게 되면 터치 영역 설정이 마치게 됩니다. 역시 'x'를 눌러 저장 후 종료합니다.

주의할 점은 눌렀을 때에만 빨간 화살표가 이동하여야 합니다. 그렇지 않으면 좌표가 맞지 않게 됩니다. 이제 설정된 영역안에서만 터치가 이루어지게 됩니다.

 

나머지 기능들에 대해서는 아직 잘 모르지만 혹시 아시게 되면 알려주시면 감사하겠습니다. ^^

이상 조금이나마 도움이 되셨으면 하는 바램을 가지고 마치겠습니다.

Posted by 열ㅇl
Project/Multitouch Table2009. 5. 24. 02:20

테스트

 

이제 어느 정도 하드웨어 설계가 마무리 되어 가기 때문에 소프트 웨어 구현을 위하여 터치 인식을 테스트 해보기로 하였습니다.

우선 다음과 같이 기역자 앵글을 잘 고정시키고 적외선 빛이 세어 나오지 않도록 꼼꼼하게 막아줍니다.

특히 LED 아래 부분에서 빛이 많이 세어 나오기 때문에 잘 가려주어야 합니다.

또한 LED부분과 물체가 닿으면 적외선이 반사가 되어 인식 될 수 있으므로 닿을 수 있는 부분에 절연 테이프로 감아줍니다.

 

 

Touchlib Beta v2.0

현재 여러 프로젝트에서 touch 라이브러리로 많이 쓰이고 있으며 이번 테스트에 사용하기로 하였습니다.

open cv를 사용하여 캠에서 입력받은 영상을 이진화 시켜 잡음 제거등 영상처리를 통하여 전반사된 빛의 좌표를 TUIO 프로토콜을 사용하여

통신합니다. V1.0 보다 V2.0이 더 사용하기 쉽고 성능이 좋은 것 같습니다.

 

Down: http://nuigroup.com/touchlib/downloads/ 

 

파일을 다운 받아 압축을 풀어 폴더에 들어가게 되면

Config.bat, Server.bat, Vision.bat의 3개의 배치 파일이 존재합니다. 그리고 다른 폴더에는 예제들이 포함되어 있습니다.

 

사용법은 http://nuigroup.com/touchlib/tutorials/를 참고 하시면 됩니다.

 

일단 Config.bat을 실행 시키면 캠 화면에 대한 설정 후 6개의 창이 뜨는데 영상처리 되어 지는 과정을 보여줍니다.

아래 3개의 창으로 자신의 어플리케이션에 맞게 영상을 조정할 수 있습니다.

B 를 누르게 되면 배경 화면을 제거 해줍니다. 또한 설정된 값을 저장하기 위해서는 엔터 버튼을 누른 후 X를 누르시면 저장이 됩니다.

 

테스트 영상입니다.

 

 

이제 테스트 위해서 Vision.bat를 누르시면 Listener가 작동되어 전반사 되어진 곳의 좌표를 TUIO프로토콜을 통해 통신하게 됩니다.

어플리케이션을 실행시켜 테스트 합니다.

 

테스트 영상입니다. 



 

 

아직 프로젝터와 카메라의 위치도 정확히 맞추지 않고 테스트하여 터치 좌표가 정확히 일치 않습니다.

카메라 또한 영상인식이 좀 느린 부분이 있습니다.

그래도 어느 정도 인식률이 나오기 때문에 소프트웨어 구현을 시작하며 하드웨어 보완을 진행할 계획입니다.

테이블안으로 들어오는 빛들을 제거하기 위해 합판 같은 재료로 테이블 옆면을 막기로 하였습니다.

 

빔프로젝터에서도 다량의 적외선이 나오기 때문에 적외선 차단 필름을 붙이면 좋지만 단가가 비싸기 때문에 아직 고려중에 있습니다.

Posted by 열ㅇl
Project/Multitouch Table2009. 5. 23. 17:50
FTIR 방식의 Multi Touch Screen의 주요 부품인 적외선 카메라 제작하는 방법을 알아 보겠습니다.
적외선 카메라를 직접 구매하여 할수도 있겠지만 적외선 카메라의 경우 비교적 고가이기 때문에 학생 신분에서 저렴하게 구입 할 수 있는 캠을 사용하여 개조하는 방법을 썻습니다.


T9T9 Research Center 블로그를 통해
여러 캠들 중  V-GEAR TALKCAM TRACER CCD 모델이
개조가 쉽다는 정보를 얻어, 캠을 구매 하였습니다.



일반적인 캠에는 적외선을 차단하는 렌즈가 있습니다. 우리는 적외선을 받아들이는 적외선 카메라를 제작해야 하기 때문에 적외선 차단 렌즈를 제거 해야 합니다.  또한 가시광선을 받아들여서는 안되기 때문에 가시광선 차단 필터를 부착해야 합니다.

적외선 차단 렌즈 제거

캠의 렌즈부분을 손으로 돌리면(시계 반대방향) 쉽게 좌측과 같이 분리가 됩니다.
잘 보이지 않지만 맨 윗부분 적색으로 보이는 부분적외선 차단 렌즈입니다.
렌즈 제거는 속에 있는 다른 렌즈가 다치지 않도록 렌즈에 압력을 가해 깨면 됩니다.
렌즈위에 투명테잎을 붙이면 렌즈 파편을 쉽게 제거 할 수 있습니다(T9T9 블로그 참조)



가시광선 차단 필터 장착
가시광선을 차단하기 위하여 일반인도 쉽게 구할 수 있는 카메라의 필름을 사용 할 수 있습니다.
적외선 차단 렌즈를 제거한 자리에 필름을 알맞은 크기로 잘라 넣어 줍니다.
주의하실 점은 필름은 새필름이 아닌 '현상'한 필름을 써야 합니다.(요즘 필름을 안써서 현상한 필름 구하는것도 쉽지 않더군요;;) 사진관에서 현상하고 남은 걸 얻어오시거나 새 필름을 그냥 현상해 달라고하셔야 합니다.

     
        필름을 붙여서 테스트를 해보고, 가시광선 양에 따라 
        2장을 곂쳐 붙이셔도 됩니다.
        저희 같은 경우는 필름을 두장 곂쳐 붙였더니 그제서야
        잘 되는 것을 확인 하였습니다.
                                                                                                 
- 필름을 카메라 렌즈에 붙인 모습 -                                       
최종 완성된 적외선카메라로 본 영상

 
팔에 있는 핏줄이 다 보여서 좀 징그럽습니다; 아마도 적외선의 영향이겠죠?
Posted by 열ㅇl
Project/Multitouch Table2009. 5. 3. 15:20

최근 사용자의 경험 UX(User Experience) 분야가 화두가 되고 있습니다.
몇년전가지만 해도 UX보다는 제품의 용량이나 속도같은 양적인 측면이 강조되었지만
이미 용량이나 속도가 많고 빨라진 만큼 양적인 측면은 그렇게 중요하지 않다고 생각합니다.

UX라고 하면 사용자가 제품을 사용하는 UI로 이루어 지는 경우가 많이 있습니다.
그중 우리는 최근 많이 사용되는 멀티 터치를 사용하여 흥미와 좀더 조작하기 쉬운직관적인 인터페이스로 사용자들의 참여를 유도해 보려고 합니다.

현재 우리가 만들려고 하는 멀티 터치형 테이블탑(?) 형식의 컴퓨터는 이미 작년에 MS사에서 Surface 라는 제품을 상용화 하였구요.(대략 1000만원), 터치 방식은 ipot이나 각종 휴대폰에도 많이 적용되어 친숙해진 상태입니다.

터치를 인식하는 방법은 적외선의 전반사를 이용한 FTIR(Frustated Total Internal Reflection) 현상을이용할 생각이구요.

아직 구체적인 하드웨어 스펙은 정해지지 않았지만 800*600정도의 대형 스크린으로 구현할 생각입니다.

앞으로 6월 중순까지(약 3개월)간 진행할 프로젝트이고 하드웨어나 소프트웨어 구현 중간중간 진행사항을 포스팅하도록 하겠습니다.

이미 FTIR 방식은 많이 알려진 방식이지만 구체적인 하드웨어 스펙(저는 소프트웨어만 다뤄보아서)에 대한 정보는 얻기 힘들더군요..

그리고 소프트웨어로는 구체적으로 정하지는 않았지만 멀티 터치를 활용할 수 있는  좀 실용적인 컨텐츠로구현해 보려고 합니다.

지금은 자료 수집 중이고요 각 부품들의 자세한 스펙은 다음주에 부품들을 구입하여 만들어 보는대로다시 포스팅 하겠습니다.  

 밑에는 MS의 Surface 동영상입니다.

 

 

동영상 출처: ( http://blog.naver.com/clover0513/58078413 )

 

Posted by 열ㅇl