AI 피부 분석 서비스 개발

$ echo "작업 개요"

ONNX Runtime을 활용한 클라이언트 사이드 AI 피부 분석 서비스를 개발했다. 서버 없이 브라우저에서 직접 AI 모델을 실행하여 사용자의 피부 상태를 분석하는 웹 애플리케이션이다.

$ echo "기술적 배경"

기존 AI 피부 분석 서비스는 서버에서 추론을 수행하여 비용과 지연 시간 문제가 있었다. ONNX Runtime Web을 활용하면 브라우저에서 직접 모델을 실행할 수 있어 서버 비용 없이 실시간 분석이 가능하다.

$ echo "구현 내용"

$ cat ./클라이언트 사이드 AI 추론

ONNX Runtime Web을 통해 사전 학습된 피부 분석 모델을 브라우저에서 로드하고 실행한다. WebAssembly 백엔드를 사용하여 다양한 기기에서 호환성을 확보했다. 사용자가 이미지를 업로드하면 전처리 후 모델에 입력하여 피부 상태 점수를 추출한다.

$ cat ./분석 결과 시각화

Chart.js와 react-chartjs-2를 활용하여 피부 상태 분석 결과를 레이더 차트와 막대 그래프로 시각화했다. 수분, 유분, 모공, 주름 등 다양한 지표를 직관적으로 표시한다.

$ cat ./반응형 UI

Tailwind CSS와 Radix UI를 조합하여 모바일과 데스크톱 모두에서 최적화된 사용자 경험을 제공한다. 이미지 업로드부터 결과 확인까지 단일 페이지에서 처리된다.

$ echo "기술적 결론"

ONNX Runtime Web의 도입으로 서버 인프라 없이도 AI 기반 서비스 구축이 가능함을 확인했다. 초기 모델 로딩 시간(약 2-3초)이 있지만, 이후 추론은 밀리초 단위로 수행되어 사용자 경험에 큰 영향이 없다.

$ echo "기술 스택"