연구노트

R&E 연구노트 ⑨ 연령 추정과 반응형 UI

3마지막 수정
R&E 연구노트 ⑨ 연령 추정과 반응형 UI

연구노트 시리즈.

화면이 사람을 알아본다

적응형 키오스크의 첫 번째 축은 연령에 따라 변하는 UI다. 사용자가 키오스크 앞에 서면 웹캠이 실시간으로 얼굴을 잡고, 추정된 연령대에 맞춰 글자 크기, 버튼 크기, 색상 대비, 가독성이 자동으로 조정된다. 별도의 설정 없이 시스템이 알아서 반응하게 하는 것이 핵심이었다. 디지털 기기에 익숙하지 않은 사용자일수록 설정하라는 요구 자체가 장벽이 되기 때문이다.

face-api.js

얼굴 인식과 연령 추정에는 face-api.js를 사용했다. XceptionNet 구조를 기반으로 한 경량 모델이라 계산 효율이 높고 웹 환경에서도 실시간 처리에 적합하다.

  • TinyFaceDetector. 경량 모델로 설계되어 웹에서도 빠른 얼굴 검출이 가능하다.
  • AgeGenderNet. 검출된 얼굴에서 연령과 성별을 동시에 예측한다.

얼굴 인식은 크게 얼굴 검출(이미지에서 얼굴 영역 찾기)과 얼굴 분석(연령·성별·표정 추정) 두 단계로 나뉘는데, 이 둘을 모두 브라우저 안에서 처리했다.

왜 CNN인가

얼굴 인식과 연령 추정은 합성곱 신경망(CNN)을 기반으로 한 대표적인 컴퓨터 비전 기술이다. CNN은 이미지에서 공간적 특징을 자동으로 추출한다. 합성곱층은 필터로 국소적 특징을 뽑는데, 같은 필터가 이미지 전체에 적용되므로 파라미터 수가 줄고 위치 변화에 유연해진다. ReLU 활성화 함수가 비선형성을 더해 복잡한 패턴을 학습하게 하고, 풀링층이 해상도를 줄여 계산량을 낮춘다. 얼굴은 눈·코·입이라는 공통 구조를 가지면서도 개인과 연령에 따라 미묘한 차이를 보이므로 이런 계층적 특징 추출이 잘 맞는다.

얼굴 검출의 발전

초기에는 Haar-like feature와 AdaBoost를 결합한 Viola-Jones 방법이 널리 쓰였다. 실시간 처리에 적합했지만 조명과 각도 변화에 취약했다. 이후 딥러닝과 함께 MTCNN(Multi-task Cascaded CNN)이 등장했다. 세 단계의 CNN을 순차 적용해 얼굴 후보 영역을 점진적으로 정제하고, 다양한 크기와 각도의 얼굴을 안정적으로 검출하며 랜드마크도 동시에 추출한다. 이 시스템도 이런 CNN 기반 검출의 장점을 살려 키오스크 환경에서 안정적으로 동작하도록 했다.

엣지 컴퓨팅

특기할 점은 AI 연산을 클라이언트(브라우저)에서 직접 수행하는 엣지 컴퓨팅 방식을 택했다는 것이다. 얼굴 영상을 서버로 보내지 않고 기기 안에서 처리하므로, 네트워크 왕복 없이 즉시 추론하고 민감한 얼굴 영상이 기기 밖으로 나가지 않는다. 실시간성과 개인정보 보호를 함께 얻었다.

4구간 연령 분류

추정된 나이는 정수 값으로 나오고, 이를 네 개의 연령대 그룹으로 변환했다. 어린이, 청소년, 성인, 노인이다. 이렇게 구간화하면 연령 추정에 약간의 오차가 있어도 UI 적용에는 큰 영향이 없다. 47세를 45세로 잘못 봐도 똑같이 성인 UI가 되기 때문이다. 각 그룹마다 버튼 크기, 색상, 명도 대비, 가독성을 다르게 설정했다.

성능: 자체 벤치마크

성능을 객관적으로 재기 위해 Web-UI 기반 벤치마크 시스템을 직접 만들었다. 실제 키오스크와 동일한 모델을 쓰고, 연령이 레이블링된 이미지로 예측값과 실제값을 비교했다.

  • 데이터셋: 20세부터 60세 이상까지 10개 연령대, 300장의 얼굴 이미지.
  • 연령 추정 정확도: 평균 78.0%.
  • 평균 오차(MAE): 2.8세.
  • 처리 속도: 웹캠 얼굴 인식과 연령 처리가 모두 1~2초 내 완료.

연령대만 맞으면 UI가 적절히 바뀌는 구조라 이 정도 정확도로도 실사용에는 충분했다.

변경 이력 (2건)
  1. gitprogam 수정feat(binaryhub-blog): tetris 위키 + SEO 정비 + hero 이미지 + 글 다수
  2. gitprogam 최초 작성init: monorepo (nsgh-tools + binaryhub-blog)

관련 글