대부분의 AI 얼굴 분석 제품은 간단한 아키텍처로 시작합니다: 사진을 업로드하고, API로 전송하며, 서버에서 모델을 실행한 뒤 점수를 반환하는 방식입니다.

그 방식은 편리하지만 데이터 문제를 야기합니다. 얼굴 사진은 개인 데이터이며, 많은 사람들은 단순히 눈에 보이는 비율이나 얼굴 형태를 알기 위해 사진을 업로드하고 싶어 하지 않습니다. 제가 LookBlueprint를 구축할 때, 저는 다른 제약 조건에서 시작했습니다:

유용한 첫 번째 결과는 원본 사진을 서버로 보내지 않고도 가능해야 한다.

이 제약 조건은 제품의 거의 모든 기술적 결정을 형성했습니다.

첫 번째 분석을 로컬에서 실행하기

무료 분석은 MediaPipe Face Landmarker와 번들링된 WebAssembly 런타임을 사용하여 브라우저에서 실행됩니다. 모델과 런타임은 애플리케이션과 함께 제공되며, 분석 작업은 Web Worker에서 실행되므로 랜드마크(Landmarks)를 감지하는 동안에도 인터페이스의 반응성을 유지할 수 있습니다.

흐름은 대략 다음과 같습니다:

1. 사용자가 선명한 정면 사진 한 장을 선택합니다.
2. 브라우저가 이미지를 검증하고 분석을 위해 준비합니다.
3. 워커(Worker)가 얼굴 랜드마크(Facial landmarks)와 기본적인 이미지 품질 신호를 감지합니다.
4. 순수 TypeScript 분석 함수가 해당 랜드마크를 버전 관리되는 얼굴 분석 스냅샷으로 변환합니다.
5. UI가 스냅샷을 집중된 결과와 교육적인 설명으로 렌더링합니다.

무료 결과를 위해 원본 이미지는 업로드되지 않습니다. 해당 워크플로우에는 로그인 요구 사항이 없으며, 결과는 브라우저 세션에 임시로 유지됩니다.

이는 실질적인 개인정보 보호 개선 사항이지만, 엔지니어링 측면의 트레이드오프(Trade-offs)도 변화시킵니다. 모델은 다양한 기기에서 안정적으로 로드되어야 하며, 이미지 프로세싱은 브라우저 메모리 제한 내에 들어와야 하고, 오류는 머신러닝(Machine-learning) 파이프라인을 디버깅하지 않는 사람도 이해할 수 있어야 합니다.

아름다움을 측정하는 척하는 대신 구조를 측정하기

얼굴 분석 점수(face-analysis score)는 실제보다 더 객관적으로 들릴 수 있습니다. 저는 이 제품이 사람들에 대한 보편적인 순위를 매기는 방식이 아니라, 측정 가능한 참조값(measurable references)을 드러내기를 원했습니다.

LookBlueprint는 여러 유형의 출력값을 분리합니다:

• 가시적인 좌우 대칭 및 쌍의 차이 (pair differences).
• 신뢰도 백분율(confidence percentages)이 포함된 얼굴 형태 후보군.
• 수직 3등분(vertical thirds) 및 수평 5등분(horizontal fifths).
• 얼굴 가로-세로 비율 및 얼굴 너비-높이 비율.
• 눈 모양 참조값 및 외안각 경사 (canthal tilt).
• 턱선 및 하안부 구조.
• 별도의 사진 신뢰도 신호 (photo-reliability signal).

전체 등급은 과학적 사실로 취급되지 않습니다. 이는 선택된 구조적 신호들을 결합하는 반면, 카메라 신뢰도는 별도로 유지됩니다. 자연스러운 비대칭, 조명, 머리 회전, 표정, 렌즈 왜곡, 그리고 랜드마크(landmark) 품질은 모두 한 장의 사진에서 측정할 수 있는 값에 영향을 미칩니다.

이러한 구분은 중요합니다. 결과는 누군가가 눈앞에 있는 이미지를 이해하도록 도와야 하며, 그 사람의 가치를 말해주거나 복잡한 인간을 하나의 숫자로 축소해서는 안 됩니다.

가장 어려운 부분은 측정 품질입니다

얼굴 랜드마크(Face landmarks)는 정답(ground truth)과 동일한 것이 아닙니다. 카메라 각도의 미세한 변화가 겉으로 보이는 비율을 바꿀 수 있습니다. 머리카락이 턱선을 가릴 수 있습니다. 저조도는 랜드마크의 안정성을 떨어뜨릴 수 있습니다. 광각 셀카는 얼굴 중앙을 과장할 수 있습니다.

그렇기 때문에, 인터페이스는 한계점을 법적 고지 페이지에 숨기는 대신 결과 옆에 직접 설명합니다. 신뢰도를 보고하고, 해석에 영향을 미치는 사진 조건을 식별하며, 사용자가 출력을 해당 이미지에 대한 참조값으로 취급하도록 권장합니다.

이는 오류 상태(error states)를 처리하는 방식도 중요하게 만듭니다. 사진에 사용할 수 있는 얼굴이 포함되어 있지 않은 경우, 사용자에게는 명확한 다음 단계가 필요합니다: 예컨대, 얼굴이 가려지지 않은 더 밝고 정면을 향한 이미지를 시도해 보라는 식입니다. 일반적인 "분석 실패" 메시지는 기술적으로는 정확하지만 유용하지는 않습니다.

명확한 경계를 가진 작은 아키텍처

이 애플리케이션은 Next.js 프론트엔드, 브라우저 분석 파이프라인을 위한 Web Worker, 그리고 랜드마크(landmarks)를 타입이 지정된 버전 관리형 FaceAnalysisSnapshot으로 변환하는 순수 분석 모듈을 사용합니다.

해당 스냅샷은 탐지(detection)와 표현(presentation) 사이의 경계 역할을 합니다. 워커(worker)는 결과 카드가 어떻게 렌더링되는지 알 필요가 없으며, UI는 모델이 어떻게 랜드마크를 찾아내는지 알 필요가 없습니다. 이를 통해 핵심 계산 로직을 테스트 가능하게 유지할 수 있으며, 탐지 파이프라인을 중복 구현하지 않고도 특정 목적에 집중된 도구들을 추가할 수 있습니다.

현재 제품에는 등급(rating), 대칭성(symmetry), 얼굴형(face shape), 비율(proportions), 캔슬 틸트(canthal tilt), 턱선(jawline), 눈 모양(eye shape), 그리고 중립적인 구조 뷰(neutral structure view)를 위한 전용 뷰가 포함되어 있습니다. 또한 방법론, 연구 참조, 정확도, 편향(bias), 한계점, 개인정보 보호, 그리고 실질적인 스타일 질문을 다루는 가이드도 포함되어 있습니다.

사용자가 보고서를 원할 때는 어떤 일이 일어나나요?

무료 분석은 브라우저 내에 머뭅니다. 선택 사항인 개인 맞춤형 Face Blueprint 보고서의 경우, 브라우저는 원본 소스 파일을 전송하는 대신 보고서 워크플로를 위해 제한된 분석 복사본을 준비합니다. 이 복사본은 크기와 해상도가 제한되며, 보고서는 페이지 내 결과, 다중 페이지 PDF, 또는 소장용 이미지 형태로 제공될 수 있습니다.

중요한 제품 결정 사항은 이러한 경계를 사용자에게 명확히 보여주는 것입니다. 사용자는 어떤 워크플로가 로컬(local)에서 실행되는지, 어떤 워크플로가 선택 사항인지, 그리고 어떤 종류의 이미지 복사본이 사용되는지 알아야 합니다.

왜 이런 방식으로 구축했나요?

제1원리(first-principles)에 기반한 답변은 간단합니다. 제품이 무료 결과 도출을 위해 얼굴 랜드마크와 비율만을 필요로 한다면, 원본 사진을 업로드하는 것을 필수적인 시작 가정으로 둘 필요가 없습니다.

로컬 처리(Local processing)가 모든 개인정보 보호나 정확도 문제를 해결해 주는 것은 아닙니다. 하지만 불필요한 전송을 줄이고, 사용자에게 더 명확한 멘탈 모델(mental model)을 제공하며, 사진 한 장이 우리에게 알려줄 수 있는 것과 알려줄 수 없는 것에 대해 제품이 정직하게 다루도록 강제합니다.

lookblueprint.com에서 무료 브라우저 기반 분석기를 사용해 볼 수 있습니다. 이 프로젝트의 목표는 확정적인 판단을 내리는 것이 아닙니다. 사람들이 사진 속의 가시적인 패턴 (visible patterns)을 탐색할 수 있는 사적이고 이해 가능한 방법을 제공하는 것입니다.