Skip to content

3. 추진내용

※ 유저시나리오, 개발 대표 이미지, 활용 기술 내용은 필수

가. 유저 시나리오

시나리오 1: 회원 고객 — 안경점 스마트미러 체험 (오프라인)

전체 시스템 아키텍처

시나리오 2: 비회원 고객 — 안경점 스마트미러 체험 (오프라인)

O2O 연동 흐름도

시나리오 3: 온라인 쇼핑 고객 — 모바일 앱 연결 경험

1. 클라렌 앱 마이페이지에서 매장 체험 기록 확인
   → 체험 순위, 구매 이력, 추천 렌즈 목록

2. 체험 사진이 제품 상세에 적용
   → 화보처럼 자연스러운 렌즈 착용 모습 확인

3. 집에서 AR 렌즈 시뮬레이션
   → 체험했던 렌즈 + 새로운 렌즈 자유롭게 비교

4. 체험 기반 유사 렌즈 추천
   → 색상·패턴이 유사한 렌즈 자동 추천

5. 구매한 제품 기반 신제품 안내
   → "지난번 구매한 브라운 계열 신제품이 나왔어요!"

6. 장바구니 담기 → 결제 또는 매장 픽업 예약

시나리오 4: 팝업스토어 방문객 (체험)

1. 팝업스토어 입장 → 대형 스마트미러 체험존
2. 인터랙티브 가상착용 체험 (엔터테인먼트 요소)
3. AI 얼굴 분석 + 렌즈/헤어/뷰티 스타일 추천
4. 착용 이미지 포토부스 촬영
5. SNS 공유 → 브랜드 인지도 확대 (바이럴 마케팅)
6. QR코드 → 온라인 구매 유도 + 이벤트 혜택 안내

나. 개발 대표 이미지 — 시안 프로토타이핑

스마트미러 / 모바일 웹앱 UX 프로토타이핑 시안

메인 화면 — 스마트미러 / 모바일 웹앱

01. 메인 화면 — 프로모션 배너, 렌즈 제품 캐러셀, 가상피팅 CTA
  • 프로모션 배너: 이벤트·할인 안내 (스크린세이버 전환)
  • CTA: "어울리는 렌즈 착용해보기" → 가상피팅 진입
  • 제품 캐러셀: 인기/신상 렌즈 카드 횡스크롤
  • 다국어 지원: 한국어 / English / 日本語 / 中国人

정보 입력 단계

02. 정보 선택 103. 정보 선택 204. 정보 선택 305. 정보 선택 완료
  • 비회원: 출생연도, 성별, 착용 목적 입력 (간편 정보)
  • 회원: QR 스캔으로 계정 연동 후 착용 목적 선택
  • 착용 목적: 일상생활 / 데이트 / 여행 / 페스티벌 등 TPO 기반 (회원·비회원 공통 수집)

AI 얼굴 촬영 및 분석

06. 얼굴 촬영07. AI 분석 진행
  • 얼굴 촬영: 타원형 가이드 프레임에 얼굴 위치 → 촬영
  • AI 분석: 얼굴형, 눈 형태, 피부 톤, 홍채 색상, 퍼스널 컬러 자동 분석
  • 분석 진행 상황 시각적 UI 안내

AI 렌즈 추천 결과

08. 렌즈 추천 결과 109. 렌즈 추천 결과 2
  • AI 추천 메시지: "따뜻한 피부톤과 동그란 눈에 어울리는 렌즈에요!"
  • 필터 탭: AI 추천 / 주기 / 컬러 / 직경 / 재질 / 착용 목적
  • 추천 카드: 순위별 렌즈 상품 + 가격 + 스펙 (도수, 재질, 개수)
  • 착용 미리보기: 렌즈 착용 눈 클로즈업 썸네일

결과 저장 및 O2O 연결

10. 결과 저장
  • QR 코드 스캔 → 체험 결과를 앱에 저장
  • 할인 쿠폰 연동: "결과 저장하고 10% 할인받기"
  • APP 다운로드 유도 → 온라인/매장 픽업 구매 연결

다. 시스템 아키텍처 도식화

전체 시스템 아키텍처

전체 시스템 아키텍처

O2O 연결 플로우 (Store → App → Purchase)

O2O 연동 흐름도

라. 활용 기술

핵심 기술 스택

영역기술용도
얼굴/안구 인식MediaPipe Face Mesh, DLIB실시간 안구 영역 탐지
이미지 세그멘테이션U-Net, SAM (Segment Anything)안구·홍채 정밀 세그멘테이션
이미지 합성MediaPipe 홍채 추적 + 알파 블렌딩 + CV 특징검출컬러렌즈 착용 이미지 합성
3D 얼굴 복원3DMM, FLAME스마트미러 AR 렌더링
AI 얼굴 분석얼굴형·피부톤·홍채·퍼스널컬러 분석 모델개인화 렌즈·뷰티 추천
추천 알고리즘Collaborative Filtering, Content-based개인화 렌즈 추천
백엔드Python (FastAPI), Node.jsAPI 서버
프론트엔드React, Next.js, Three.js웹앱·스마트미러 UI
인프라AWS/GCP, GPU 서버, CDN클라우드 인프라
모바일PWA (Progressive Web App)모바일 웹앱

2026 AI가상융합 사회기반혁신 프로젝트