AI 도안 생성부터 AR/3D 시뮬레이션, 커버업 추천, 타투이스트 매칭까지. 타투를 새기기로 결심한 순간부터 실제로 새기는 순간까지 전 과정을 하나로 연결하는 플랫폼

• 서비스 URL: https://stattoo.duckdns.org
• 서비스 소개 영상: https://youtu.be/6rRotlTOfq4
• 개발 기간: 2026.07 ~ 2026.08 (SSAFY 15기 공통 프로젝트)

---

👥 Team (D201 백두산 호랑이)

팀장	팀원1	팀원2	팀원3	팀원4	팀원5
신지환	박범준	이한준	양혜림	심재훈	이효주
AI/INFRA	BE	AI	FE	FE	FE

✨ 주요 기능

1. AI 타투 도안 생성

한국어 프롬프트를 번역·보강해 원하는 스타일의 타투 도안을 생성

프롬프트 입력	생성 결과

PC	Moblie

2. AR 시뮬레이션

카메라로 내 몸에 타투를 실시간으로 얹어보고, 인물 분할 기반 마스크로 자연스럽게 합성

소개 화면	QR 연결 전	QR 연결 후	AR 결과

3. 3D 이미지 시뮬레이션

신체 사진을 올려 도안을 얹고, 몸의 굴곡을 따라 휘어진 모습으로 합성

신체 사진 선택	도안 선택	도안 정리	도안 합성

PC	Moblie

4. 커버업 도안 추천

기존 타투 사진 위에 직접 그려보고, 커버업 도안을 미리 확인

기존 타투	드로잉	커버업 결과

PC	Moblie

5. 탐색 & 피드 & 메시지 & 타투이스트 페이지

포트폴리오 탐색, 게시글·검색, 타투이스트와 1:1 실시간 상담

피드	탐색	메시지	타투이스트

피드

---

PC	Moblie

탐색

---

PC	Moblie

메시지

---

PC	Moblie

타투이스트 페이지

---

PC	Moblie

6. 마이페이지 & 내 컬렉션

마이페이지	내 컬렉션	내 컬렉션 수정

PC	Moblie

🛠 기술 스택

영역	기술
Frontend	React 19, TypeScript 5.8, Vite 7, React Router 7, Tailwind CSS 4, Zustand 5, TanStack Query 5
Browser Vision	MediaPipe Tasks Vision, Transformers.js, OpenCV.js
Backend	Java 21, Spring Boot 3.5, Spring Security, Spring Data JPA, STOMP/WebSocket, Flyway
AI	Python 3.11, FastAPI, PyTorch, Diffusers, Transformers, Stable Diffusion 1.5, SigLIP2, OpenCV
Data	PostgreSQL 16, Redis Stack, MinIO
Infra	Docker, Docker Compose, Nginx, Jenkins, GitLab
External	Kakao·Google OAuth, Firebase Cloud Messaging

🏗 시스템 아키텍처

• Nginx가 SPA, REST API, WebSocket, AI 요청을 단일 진입점에서 라우팅합니다.
• Spring Boot가 인증·사용자·게시물·컬렉션·DM·알림·미디어 도메인을 담당합니다.
• AI 서비스는 도안 생성·추출·분류 API와 커버업 전용 검색 엔진으로 분리되어 있습니다.
• PostgreSQL은 영속 데이터, Redis Stack은 캐시·검색·세션성 데이터, MinIO는 이미지 객체를 관리합니다.

📂 프로젝트 구조

S15P11D201/
├── frontend/    # React 기반 사용자 웹 애플리케이션
├── backend/     # Spring Boot REST API 및 WebSocket 서버
├── ai/          # AI 추론 API와 커버업 도안 검색 엔진
├── nginx/       # 리버스 프록시 및 라우팅 설정
├── relay/       # 외부 GPU 머신 연결용 AI 릴레이
├── jenkins/     # Jenkins 실행 환경
├── docs/        # 컨벤션 및 README 이미지
├── exec/        # 빌드·배포·환경 변수 문서
├── docker-compose.yml
└── Jenkinsfile

ERD

📄 산출물

구분	링크
기획/요구사항	https://brief-vase-0fa.notion.site/39cb65bd273280c28e32f5d204fc897c
화면 설계 (Figma)	https://www.figma.com/design/lD3bqI5XAELh9rtrzzViLx/starttoo-%EC%99%80%EC%9D%B4%EC%96%B4%ED%94%84%EB%A0%88%EC%9E%84?node-id=0-1&t=7weNZHSoUT14mlQs-1
API 명세	https://brief-vase-0fa.notion.site/API_-3a4b65bd2732805bbe93cf1a066ba523?source=copy_link
팀 컨벤션	docs/CONVENTIONS.md