PhotoLabs는 제품 사진을 만들고 고치는 AI 편집 플랫폼입니다. 프론트엔드를 맡아 생성 요청부터 진행 상태, 결과 확인과 부분 수정까지 이어지는 화면을 구현했습니다.
AI 편집 기능
배경 생성과 교체, Inpaint, 가상 착용, 얼굴 편집, 제품 분리·합성, 업스케일 흐름을 Stable Diffusion API에 연결했습니다. 사용자가 Fabric Canvas에서 편집 영역을 고르면 선택한 범위만 다시 요청하는 기능을 구현했습니다.
WebSocket 작업 상태
이미지 생성은 결과가 바로 나오지 않습니다. WebSocket으로 진행 상태와 결과를 받아 대기, 성공, 실패 화면을 분리하고 다시 시도할 경로도 함께 보여 줬습니다.
Canvas와 다국어
Fabric Canvas에 레이어, 마스크, 선택 영역 도구를 구성해 AI 결과를 웹에서 이어서 편집하도록 했습니다. 번역 키와 locale 전환은 UI 코드와 분리해 한국어와 영어 화면을 같은 구조로 유지했습니다.