모든 포트폴리오LUDGI / PROJECT ARCHIVE
고객 프로젝트
AI 영상 제작 서비스 — 웹 편집기와 프론트엔드 고도화
크랩스의 AI 영상 제작 서비스에서 Next.js 프론트엔드와 API 연동을 담당하고, 후속 계약으로 타임라인·자막·미리보기 등 영상 편집 기능을 고도화했습니다.
PROJECT SCOPE
- 타임라인과 자막
- 에셋과 서버 연동
- 본편집 고도화
- 구조와 인계
선택한 화면
SELECTED VIEWS
제작 노트
PROCESS & SCOPE
생성된 영상을, 직접 다듬는 제품으로.
자동 생성 이후에도 사용자가 장면과 자막을 다듬고 결과를 확인할 수 있는 웹 편집 환경을 구현했습니다. 최초 프론트엔드 개발과 후속 본편집 고도화, 두 차례의 고객 계약을 하나의 제품 개발 사례로 정리했습니다.
제공받은 기획·디자인과 API를 기준으로 Next.js·React 화면을 구현하고 Remotion 기반 편집 흐름을 연결했습니다. 프론트엔드·API 연동·편집기 고도화에 집중해 생성 결과를 사용자가 직접 다룰 수 있는 제품 경험으로 완성했습니다. 공개 화면은 당시의 편집기 작업 기록이며, 영상 속 콘텐츠는 UI 시연용 예시입니다.
- 타임라인과 자막
- 클립과 자막을 탐색하고 편집하며 결과를 미리 볼 수 있는 작업 화면을 구현했습니다.
- 에셋과 서버 연동
- 영상·이미지 등 에셋 업로드와 편집 데이터 저장을 제공된 API에 연결했습니다.
- 본편집 고도화
- 후속 개발에서 크롭, 화면 구성 조절 등 브라우저 기반 영상 편집 기능을 보강했습니다.
- 구조와 인계
- FSD 기반 프론트엔드 구조, 브라우저 테스트와 오류 대응, 소스코드 인계를 담당했습니다.
LET’S CONNECT
이 작업에서 시작할 다음 이야기.
교육·콘텐츠 협업과 사업 제휴에 관한 이야기를 기다립니다.