dd

1. 구성 요소 범위
색상 0°(빨강) ~ 360°(빨강)
채도 0%(무채색) ~ 100%
명도 0%(검정) ~ 100%(흰색)
영상처리를 이용한 손인식 마우스 제작
Design of Hand Recognition Mouse using Image Processing
백형진, 이종호
(Hyengjin Baek and Chongho Lee)
Abstract: This article describes a design of hand recognition mouse using image processing. Microsoft VX-1000 webcam
is used for image acquisition, openCV is used for hand recognition. We take images from the webcam and we can detect
skin area and convert these images to binary images including only skin area. In this images, we can detect central point
of hand and top point of finger using angle and distance from central point. This top point is used to find a point of
mouse. And we can count the number of fingers using contour function supplied from openVC. The number of fingers is
used for function of mouse. Finally, we can obtain hand recognition mouse.
Keywords: hand recognition, central point, top point of finger, the number of fingers, contour
I. 서론
현재 영화, 의학 분야 등 여러 분야에서 영상 처리
기술이 사용되고 있다. 영상 처리의 대표적인 컨텐츠인
가상현실(Virtual Reality)은 어떤 특정한 환경, 상황
을 컴퓨터를 이용하여 사용자가 마치 실제 주변 상황과
상호작용을 하고 있는 것처럼 만들어 주는 인간과 컴퓨
터 간의 인터페이스이다.
본 논문에서는 인간과 컴퓨터 간의 입출력 인터페이
스 구현을 위해 손인식 마우스를 제작하고자 하였다.
피부색 추출을 위해 HSV 색 공간을 이용하였고, 손등의
중심점으로부터의 거리와 각도를 이용하여 손가락 끝점
을 구하였다. 그리고 손가락 개수를 세기위해 openCV에
서 제공하는 contour 함수를 사용하였다. 마지막으로
손가락개수에 따라 메시지처리를 하여 마우스기능을 구
현하였다.
II. 본론
1. 피부색 추출
(1) HSV 색 공간
HSV 색 공간이란 색을 표현하는 하나의 방법이자,
그 방법에 따라 색을 배치하는 방식이다. 색상(Hue),
채도(Saturation), 명도(Brightness, Value)의 좌료를
써서 특정한 색을 지정한다. HSB로 불리는 경우도 있
다. 이는 표 1에서 나타내었다.
표 1. HSV 색 공간
(2) 영상내의 피부색 추출
Independent한 Hue값을 추출하기 위해 그림 1과 같
이 피부색의 Hue값을 먼저 입력받는다. 그 다음 웹캠으
로부터 입력받은 RGB영역 기반의 Skin Color값을 HSV
영역 기반의 Skin Color값으로 변환하여 피부색의 Hue
값과 일치하는 영역을 피부색 영역으로 추출하게 된다.
(a) Hue값 입력 (b) 히스토그램
그림 1. Hue값 입력과 히스토그램
(3) 이진영상
피부색 영역으로 추출된 Hue값 영역의 imageData값
으로 1로 setting 하고, 피부색 영역이 아닌 부분을 0
으로 setting 하면 그림 2와 같이 이진영상을 구할 수
있다.
(a) Hue 영상 (b) 이진영상
그림 2. Hue값과 피부영역의 이진영상

2. 2. 침식과 팽창 연산
(1) 침식 연산
물체에 대해 배경을 확장시키고 물체의 코기를 축소
하는 역할을 하며, 침식 마스크를 이용하여 연산시 흰
물체의 둘레로부터 한 픽셀을 없애는 효과를 갖는다.
아래 수식(1)을 openCV에서는 cvDilate 함수로 제공한
다.
⊗         (1)
(2) 팽창 연산
물체의 최 외곽 픽셀을 확장하는 역할을 한다. 따라
서, 물체의 코기는 확장 되고 배경은 축소 된다. 팽창
마스크는 흰색 물체의 둘레에 한 픽셀을 더하는 역할을
하는데 3 * 3 마스크와 똑같은 영역을 가지는 영역에
대해서는 값을 바꾸지 않으며 1개 이상의 서로 다른 픽
셀이 존재할 경우 마스크의 가운데 픽셀에 흰색 값을
할당 하는 역할을 한다. 아래 수식(2)를 openCV에서는
cvErode 함수로 제공한다.
⊕   
⊖  
(2)
(3) 채움연산
팽창 연산 후 침식 연산 수행을 함으로써 영상의 외
곽선 부분을 부드럽게 만들며, 객체의 형태와 크기는
보존되고 작은 구멍이나 틈을 채우는 역할을 한다.
이진영상을 취득하면 잡음이 많이 발생하는데 이는
contour 함수에서 치명적인 오류를 발생시키는 원인이
될 수 있기 때문에 채움연산을 이용하여 이를 제거 하
였다.
그림 3. 채움연산 수행전의 이진 영상
그림 4. 채움연산 수행후의 이진 영상
3. 손가락 끝점
(1) 손의 중심점
손가락 끝점을 구하기 위해서는 손의 중심점부터 구
해야 한다. 손의 중심점은 이진영상의 무게 중심을 이
용해서 구할 수 있다. 이진 영상에서 손영역의 모든 좌
표의 합을 손영역의 픽셀의 수로 나누면 무게 중심을
구할 수 있다. 이는 수식(1)과 같이 x, y좌표에 각각
적용한다.
     

  
  
  
    
(3)
수식(3)에서 n은 손영역 픽셀의 수를 의미한다.
(2) 손가락 끝점
마우스 포인터 역할을 하는 손가락 끝점은 손의 중
심점으로부터의 거리와 각도를 이용하여 구한다. 입력
영상에서 검지 손가락은 3사분면인 240° ~ 275°와 중심
점으로부터 140픽셀 이하에 위치하게 된다. 그래서 이
영역에 존재하는 손부분을 모두 스캔하여 Y좌표가 가
장 작은 좌표점을 구하여 손끝점으로 지정하였다.
그림 5. 거리와 각도를 이용한 끝점 찾는 코드
그림 5에서의 TRANS2RAD값은 0.01745329이고.
definedValue값은 255로 setting 되었다. 초기에 ceta
값을 270°로 테스트하였는데 인식률을 높이기 위해
275°로 수정하게 되었다.
이렇게 두 점을 찾아 실시간으로 영상처리가 이루어
지고 있다는 것을 확인하기 위해 cvCircle 함수를 이용
하여 그림 6과 같이 원을 그려주었다.

3. Step1
순차탐색하면서 Labeling된 Object
를 만나면 큐에 넣는다.
Step2
5-방향 탐색을 하여 같은 Label 번
호의 픽셀을 만나면 큐에 넣는다.
Step3
Step2를 반복하면서 시작점을 만나
면 Object로 인식하고 시작점을 만
나지 못하면 제거 한다.
그림 6. 중심점과 끝점
4. 손가락 개수
(1) 부분 이미지
손중심점과 손끝점을 찾는 과정이 끝나면 손가락의
개수를 추출하는 작업을 하게 된다. 손가락의 개수를
추출하기 위해서는 중심점으로부터 90픽셀 떨어진 곳
에서부터 100픽셀까지의 영역중 손영역인 부분을 임의
의 영상 포인터에 저장하게 된다. 이를 부분 이미지라
한다. 부분 이미지에는 손가락 개수 만큼의 이미지가
저장 되게 된다. 이 부분 이미지를 openCV에서 제공
하는 contour 함수를 이용하여 contouring 하면서
Object를 찾을 때마다 count를 1씩 증가시킴으로써 손
가락의 개수를 구할 수 있다.
(2) Contour
contour 함수는 윤곽 정보를 얻기 위해서 Edge
Tracing 또는 Boundary Flowing 이라고도 불리는 알
고리즘을 수행한다. Labeling된 Object가 n개가 존재
한다면 각각의 해당하는 Label 별로 Edge를 찾는다.
픽셀을 찾는 방법에는 CW(시계방향)과 CCW(시계반대
방향)이 있는데 이 두 방법은 전혀 다른 contour 정보
를 전달한다. 본 프로젝트에서는 그림 7과 같이 CW방
법으로 진행 방향의 왼쪽으로 90°꺽인 방향에서부터
45°씩 5-방향이다. Contouring 하는 과정은 표 2와 같
고 Pseudo Code는 그림 8과 같다.
표 2. Contoring 과정
그림 7. 시계방향 Search
그림 8. Contour Pseudo Code
openCV의 contour함수는 CvMemStorage에 메모
리를 할당하고 CvSeq라는 배열에 contour정보를 저장
한다. 그다음 cvFindcontour함수를 이용하여 labeling
된 객체를 하나씩 찾으면서 손가락 개수를 셀 수 있다.
그림 9는 이번 프로젝트에 사용된 contour 코드이고,
그림 10은 부분 이미지이다.
그림 9. Contour source code
그림 10. 부분 이미지

4. 그림 11. 입력영상과 결과 영상
그림 11은 RGB값의 입력 영상을 웹캠으로부터 받
아와 HSV값으로 변환하여 현재까지의 모든 영상처리
과정을 수행한 후의 결과 영상이다. 피부색을 추출하여
이진화 하였고, 이 영상에 채움연산을 수행하여 노이즈
를 제거 하였다. 손 중심점과 끝점을 구하여 원으로 표
현 하였으며, contour 함수를 이용하여 손가락 개수를
세어 이를 숫자로 표기 하였다.
5. 마우스 기능 구현
(1) 포인터 구현
손가락 끝점의 좌표를 이용하여 마우스 포인터의 좌
표를 구현한다. 현재 입력 영상의 크기기 320 * 240
픽셀이기 때문에 출력 화면의 크기에 맞게 적용시키기
위해서 그림 12와 같이 상대좌표를 이용한다.
그림 12. 상대좌표를 이용한 좌표값
(2) 포인터 보정
실시간으로 취득하는 손끝 좌표를 이용한 마우스 포
인터는 많은 떨림이 있기 때문에 사용자가 어색함을 느
끼게 된다. 이를 개선하기 위하여 포인터 보정을 하였
다. 포인터 보정이란 포인터의 이전 값과 현재 값이 같
은 평균과 표준편차를 갖도록 하는 것을 뜻한다.
그림 13. 포인터 보정 코드
그림 13에서 alpCenter값은 0.6이다.
(3) Move와 Click 구현
손가락 개수 정보를 가지고 있는 finger_count 변수
의 값이 1일 때에는 MOVE이벤트를 발생시키고, 값이
1에서 2가 될 때 LEFTDOWN이벤트를 발생시키며 값
이 2에서 다시 1이 될 때 LEFTUP이벤트를 발생시켜
마우스의 Click 기능을 그림 14와 같이 구현할 수 있
다.
그림 14. MOVE와 CLICK 이벤트 구현 코드
이처럼 손가락 개수에 따른 마우스 이벤트를 발생시
켜 기존에 사용해 오던 마우스의 기능을 구현 할 수 있
음을 알 수 있다. 우 클릭도 같은 방법으로 구현 할 수
있음을 알 수 있고, MOVE와 CLICK 기능을 조합하여
DRAG 기능 역시 구현 할 있다.

5. 6. 제작된 마우스 테스트
그림 15. Move 테스트
그림 16. Click 테스트
마우스 포인터 이동 후 손가락 개수를 2개로 만들
어 LEFTDOWN 이벤트를 발생시키고, 다시 1개로 만
들어 LEFTUP 이벤트를 발생시켜 마우스 Click 기능
을 테스트 할 수 있다.
III. 결론
영상처리의 가장 흥미로운 분야 중 하나인 영상인식
의 응용 기술로는 얼굴 및 표정 인식, 제스처인식, 가
상현실 등이 있으며 근래에 들어서 개인의 독특한 신체
적 특징이나 습관 등을 이용하여 개인의 신원을 확인하
는 방법인 생체인식(Bio metrics)에 대한 관심과 중요
성이 더욱 증대되고 있다.
본 논문에서는 openCV를 이용하여 손인식 마우스를
제작해 보았다. 손인식 마우스를 제작하면서 영상처리
과정을 이해할 수 있었다. 또한 사용자 마다 다른 피부
색을 인식하기 위해 Independent한 Hue값을 이용하여
조금 더 효율적인 프로젝트를 구현 할 수 있었다. 그리
고 손가락 개수를 찾는 부분에서 많은 테스트 시간이
필요 했다. 미세한 각도와 거리를 테스트와 함께 구현
해 가면서 손가락을 찾는데 최적화된 각도와 거리를 구
했기 때문에 높은 인식률을 확인할 수 있었다.
본 논문의 연구는 저가의 장비를 사용하였으며 특정
한 입력 영상을 요구하지 않았고, 누구나 쉽게 테스트
하고 이해할 수 있도록 구현 되어 있으므로 영상처리
분야에서 손인식 기초 자료로서 활용될 수 있을 것이라
생각된다.
IV. 참고문헌
[1] T.Kondo and H.Yan, "Automatic human face detection
and recognition under non-uniform illumination,"
Patern Recognition Letter, vol. 32, pp.1707-1718,
1999.
[2] M. Yagi and T. Shibata, "Human-Perception-Like
Image Recognition System Based on the Associative
Processor Architecture," in the Proc. of 11th European
Signal Processing Conference (EUSIPCO 2002), pp.
I-103-I-106, Sep. 2002
[3] A. Albiol, C.A. Bouman, and E.J. Delp, "Face
detection for pseudo-semantic labeling in video
database," in IEEE Int. Conference on Image
Processing, Kobe, Japan, October 1999
[4] M-H Yang and N. Ahuja, "Detecting human faces in
color images," in IEEE International Conference on
Image Processing, Chicago, IL, October 4-7 1998, pp.
127-130.
[5] V.Vilaplana, F. Marques, P. Salembier, and L. Garrido,
"Region-based segmentation and tracking of human
faces," in European Signal Processing, Rhodes,
September 1998, pp. 593-602.
[6] S. Beucher and F. Meyer, Mathematical Morphology
in Image Processing, chapter 12. The morphological
Approach the Segmentation: The Watershed
Transformation, pp. 433-481, Marcel Dekker Inc.,
1993.
[7] R. Brunelli, T. Poggio, "Face Recognition : Features
vs. Templates", IEEE Trans. on PAMI, vol. 15, no.
15, pp. 1042-1052, 1993.
[8] Rama Chellappa, Charles L. Wilson, Saad Sirohey, "
Human and Machine Recognition of Faces : A
Survey". Proceedings of The IEEE, vol. 83, no. 5,
1995
[9] B. Takacs, H. Wechsler, "Face Recognition Using
Binary Image Metrics", Automatic Face and Gesture
Recognition, 1998. Proceedings. Third IEEE
International Conference on, 14-16 pp. 249-299 April
1998

6. 백 형 진
2001년 거창대성고등학교 졸업.
2001년∼현재 인하대학교 정보통신공
학부 재학중. 관심분야는 영상처리,
게임프로그래밍, 임베디드소프트웨어