눈코입 맞추기 게임 만들기 3편

눈코입 맞추기 게임 만들기 2편

---

문제점

2편에서는 얼굴을 제대로 찾지 못하는 이슈를 고치면서, 사진에 있는 모든 얼굴을 인식해서 퍼즐을 만들도록 변경했다.

하지만 아래와 같이 고개를 갸울인 얼굴 사진은 결과가 원하는 대로 나오지 않았다.

따라서 아래의 빨간 네모처럼 얼굴이 회전한 각도를 새로 구하고, 그에 맞게 다시 face landmark를 찾아야한다.

얼굴 회전시키기

정확한 출처는 모르겠으나 주로 face landmark를 추출할 때 68개의 점을 찾는다.

68 face landmarks

지금까지의 결과 역시 위 68 face landmark 를 찾고하여 눈, 코, 입을 이루는 각 점의 (x, y) 좌표를 사용했다.

처음에는 얼굴의 테두리의 가장 끝인 1번, 17번 랜드마크를 사용해봤으나, 고개를 살짝 측면에서 찍은 경우에는 턱선이 돌아간 것처럼 보여서 얼굴 회전이 잘 되지 않았다.

그래서 떠올린 것이 양쪽 눈 끝점인 37번, 46번을 사용해보기로 했고, 어차피 눈코입을 회전시키는 게 목적이니 이렇게 하는 쪽이 확실해보였다.

두 눈의 끝 점을 연결하는 직선

직선의 기울어진 정도는 피타고라스의 정리를 떠올리면 쉽게 구할 수 있다.

직각삼각형에서 직각을 이루는 쪽의 꼭짓점을 \(B\) 라고 했을 때, \(tan \theta = \frac{\overline{AB}}{\overline{BC}} \) 이다.
그렇다면 \( \theta = tan^{-1} ( \frac{\overline{AB}}{\overline{BC}} ) \) 로 라디안 각도를 구할 수 있다.

이미지를 회전시킨 모습

잘린 이미지를 그대로 회전 시키면, 원본 이미지에서 잘린채로 회전되기 때문에 위처럼 빈 부분이 생긴다.
복사하려는 영역을 적당히 크게 잡아서 이미지를 복사하면 아래와 같이 깔끔하게 보정한 얼굴 이미지를 얻을 수 있다.

얼굴 회전을 보정한 이미지

결과

얼굴이 하나인 경우

아이브 단체사진으로 만들어본 결과

코드

전체 코드는 아래에서 확인할 수 있다.

GitHub - joonas-yoon/face-quiz

직접 해보기

위 코드를 GitHub Pages 로 배포하고 있어서 직접 이미지로 만들어 볼 수 있다.

Face Quiz