강원대학교 및 강원대학 통합 3개대학 용 키오스크 소프트웨어 제작(인생네컷, 하루필름 과 같은) AI기반 이미지 보정

📸 Node.js & DSLR 기반 무인 포토부스 시스템 개발

DSLR 제어부터 키오스크 UI, 실시간 이미지 프로세싱, QR 코드 배포 서버까지 전체 아키텍처를 설계하고 구현한 풀스택 프로젝트입니다.

---

🛠 주요 기술 스택 (Tech Stack)

• Runtime: Node.js (Express)
• Frontend: React.js / JavaScript (Chrome Kiosk Mode)
• Hardware Control: DigiCamControl (Windows Web Server API / SDK)
• Real-time: Socket.io (촬영 상태 및 이미지 프리뷰 실시간 동기화)
• Computer Vision: face-api.js (사용자 감지 및 자동 트리거)
• Image Processing: Sharp (이미지 리사이징 및 워터마크 합성)
• Deployment: Local Network Server & Nginx (QR 코드 외부 공유용)

---

🚀 주요 수행 작업 (Key Contributions)

1. 하드웨어 제어 및 안정화 (DSLR Integration)

• DigiCamControl 연동: REST API를 통해 셔터 스피드, 조리개, ISO 등 카메라 설정을 원격 제어하고 촬영 명령을 자동화함.
• 실시간 라이브뷰 구현: 카메라의 Live View 스트림을 브라우저에 지연 시간(Latency) 최소화하여 렌더링.
• 예외 처리: 카메라 연결 해제나 SD 카드 용량 부족 등 하드웨어 오류 발생 시 실시간 알림 시스템 구축.

2. 사용자 경험 중심의 UI/UX 설계 (Kiosk UI)

• 크롬 키오스크 모드: 사용자가 시스템 설정에 접근할 수 없도록 브라우저 기반의 풀스크린 키오스크 환경 구축.
• 인터랙티브 촬영 흐름: '시작 -> 카운트다운 -> 촬영 -> 필터 선택 -> QR 출력'으로 이어지는 매끄러운 UX 디자인 및 애니메이션 구현.
• 얼굴 인식 트리거: 사용자가 카메라 앞에 서면 face-api.js를 통해 인식 후 자동으로 촬영 안내 문구를 띄우는 스마트 인터랙션 도입.

3. 이미지 프로세싱 및 배포 시스템 (Backend & DevOps)

• 이미지 자동 워터마크: 촬영 직후 로고 및 프레임 이미지를 Sharp 라이브러리로 병합하여 브랜드 최적화 이미지 생성.
• QR 코드 배포 서버: 촬영된 이미지를 로컬 서버에 저장 후, 해당 경로를 암호화한 QR 코드를 생성하여 모바일 다운로드 페이지로 연결.
• 파일 시스템 감시: chokidar를 활용하여 DigiCamControl이 저장한 원본 파일을 실시간 감지하고 즉시 처리 프로세스로 진입하게 설계.

---

💡 핵심 문제 해결 및 성과 (Key Achievements)

• 딜레이 최적화: 고용량 RAW/JPG 파일을 브라우저에 띄울 때 발생하는 렉을 방지하기 위해 별도의 섬네일 생성 파이프라인 구축(로딩 시간 60% 단축).
• 멀티 디바이스 동기화: Socket.io를 활용하여 촬영 PC와 외부 모니터링 기기 간의 상태를 0.1초 내외로 동기화.
• 안정적인 공유 환경: 외부망 접속이 제한된 환경에서도 QR 코드 공유가 가능하도록 터널링 기술을 적용하여 접근성 확보.

---

📐 시스템 아키텍처 흐름도

1. User Interaction: 사용자가 키오스크 화면에서 촬영 시작 버튼 클릭 (또는 얼굴 인식)
2. Node.js Server: DigiCamControl API로 촬영 명령 하달
3. Camera: 사진 촬영 후 지정된 폴더에 저장
4. Image Worker: 폴더 감지 후 이미지 리사이징 및 QR 코드 생성
5. Kiosk UI: 완성된 결과물을 화면에 표시 및 QR 코드 노출
6. Mobile: 사용자가 QR 스캔 후 사진 저장