Next.js + MediaPipe로 브라우저 전용 얼... 노트

Next.js + MediaPipe로 브라우저 전용 얼굴 평가 앱을 구축한 방법 (업로드 없음, 스캔당 $0)

저자는 기존 "rate my face" 도구들이 셀카를 업로드하거나 스캔당 API 비용이 발생하는 문제점을 해결하기 위해 PSLRate를 만들었습니다. PSLRate의 핵심 원칙은 사용자의 브라우저 내에서 전적으로 얼굴 매력도 점수를 계산하여 서버 업로드나 반복적인 요금 발생의 필요성을 없애는 것입니다. 이러한 클라이언트 측 접근 방식은 대칭, 얼굴의 삼등분 및 오등분, 내안각 경사, 얼굴 너비 대 높이 비율과 같은 얼굴의 측정 가능한 기하학적 특징에 중점을 둡니다. 이러한 기하학적 계산은 결정론적이며 외부 모델이나 클라우드 처리가 필요하지 않습니다. 이 도구는 MediaPipe의 FaceLandmarker를 활용하여 사용자의 기기에서 직접 478개의 3D 얼굴 랜드마크를 추출합니다. 이러한 랜드마크는 이상적인 비율에 대한 근접성을 기반으로 0에서 1까지의 척도로 각 기하학적 측정값을 계산하는 데 사용됩니다. 이러한 기하학적 점수들의 가중 평균이 10점 만점의 최종 매력도 점수를 생성하는 데 사용됩니다. 이 무료 티어는 완전히 클라이언트 측에서 작동하므로 사용자의 사진이 브라우저를 벗어나지 않아 진정으로 무료이며 개인 정보를 보호합니다. 유료 티어도 제공되며, 이는 사진을 한 번 비전 LLM으로 보내 성격 및 "glow-up" 판독을 수행하며 사용자 크레딧을 통해 API 비용을 충당합니다. 결정론적 작업을 클라이언트로 푸시하는 이러한 아키텍처 결정은 가치 있고 신뢰할 수 있는 무료 제품을 만드는 데 핵심적인 것으로 강조됩니다.
CdXz5zHNQW_aMuaI1O3m7.webp