플러스
프로젝트 배경
동영상 플레이어 - Next.js 기반 AI 영상 자동 제작·편집 서비스 프론트엔드 개발 프로젝트 프로젝트 비용: 12,000,000원 1. 문제점 AI 영상 자동 제작 서비스를 웹 환경에서 구현하는 과정에서 브라우저에서 직접 FFmpeg을 실행할 경우, 높은 메모리 점유율과 CPU 부하로 인해 영상 렌더링 속도가 느려지고 브라우저가 멈추는 문제가 발생했다. 또한 영상 파일 크기와 해상도에 따
위시켓과 함께한 진행 과정
프로젝트 등록
Next.js 기반 AI 영상 자동 제작 서비스 프론트엔드 개발
2025.03.21.
프로젝트 완료
주식회사 크랩스프로젝트 성과
대규모 영상 처리 기능 구현
React Video Editor와 Remotion 커스터마이징을 통해 수백 개 클립을 동시에 처리 가능한 고성능 편집 환경 구현
부드러운 영상 재생 성능 확보
사전 로딩 및 구간별 버퍼링 제어를 통해 영상 전환 시 끊김 없는 연속 재생 환경을 구축
클라우드 연동 편집 기능 제공
AWS S3 등 클라우드 저장소에 업로드된 영상과 이미지를 편집기에 바로 불러와 활용할 수 있도록 구성
효율적인 개발 구조 적용
클라이언트 프로젝트의 FSD(Feature-Sliced Design) 구조에 맞춰 모듈화 및 유지보수 효율성을 극대화
안정적 렌더링 워크플로우 확보
서버 렌더링 상태에 따라 작업 부하를 조절하는 로직을 구성해, 병목 없는 인코딩 환경을 실현
핵심 기능
영상·오디오 레이어 분리 편집 기능
영상과 오디오를 별도 트랙으로 분리하여 각 레이어를 개별 조정할 수 있으며, 기본 컷 편집 및 구간별 볼륨 제어가 가능합니다.
진행 단계
요구사항 정의 및 구조 설계
2025.04.
프로젝트 기획 문서 및 디자인 시스템을 기반으로, 편집 모듈의 기술적 요구사항과 화면 흐름을 정의
프로젝트 상세
동영상 플레이어 - Next.js 기반 AI 영상 자동 제작·편집 서비스 프론트엔드 개발 프로젝트 프로젝트 비용: 12,000,000원 프로젝트 상세내용 본 프로젝트는 AI 영상 자동 제작 서비스의 프론트엔드(화면 개발)를 담당한 작업으로, 영상 편집 기능을 웹에서 구현하는 것이 주요 목표였다. 이 서비스는 사용자가 업로드한 영상이나 이미지를 기반으로 짧은 홍보용 숏폼(Shorts) 영상을 자동
