Open Generative AI — 200+ 이미지·비디오 모델을 한 UI에서 다루는 오픈소스 생성형 미디어 스튜디오

캡션: public/banner.png에서 수집한 프로젝트 배너. 저장소의 제품 아이덴티티를 나타내며, 본 리포트의 대표 이미지로 사용했다.

 

Open Generative AI는 Higgsfield AI, Freepik AI, Krea AI, OpenArt AI류의 생성형 미디어 플랫폼을 오픈소스·셀프호스팅 가능한 형태로 대체하려는 프로젝트다. 핵심은 텍스트-투-이미지, 이미지-투-이미지, 텍스트-투-비디오, 이미지-투-비디오, 립싱크, 시네마 프리셋, 워크플로, 에이전트 UI를 하나의 웹/데스크톱 스튜디오로 묶는 것이다.

 

분석 범위는 README, project_knowledge.md, package.json, app/, components/, packages/studio/, electron/, docs/assets/, public/assets/, 공개 Issue 목록이다. 별도 Wiki는 메인 저장소로 리다이렉트되어 독립 문서가 확인되지 않았고, Discussions URL은 404로 확인되었다. 따라서 Wiki/Discussion 기반의 추가 아키텍처 해설은 본 문서에 포함하지 않았다.

---

Quick Links

항목	링크/상태
GitHub 저장소	https://github.com/Anil-matcha/Open-Generative-AI
Hosted Demo	https://dev.muapi.ai/open-generative-ai
MuAPI	https://muapi.ai
Releases	https://github.com/Anil-matcha/Open-Generative-AI/releases
Medium technical overview	https://medium.com/@anilmatcha/
관련 서브모듈: Vibe Workflow	https://github.com/SamurAIGPT/Vibe-Workflow
관련 서브모듈: Open Poe AI	https://github.com/SamurAIGPT/Open-Poe-AI
논문 링크	저장소 README 기준 별도 논문 링크 없음
Wiki / Discussions	Wiki 별도 페이지 미확인, Discussions 404

 

---

Key Features

1. 통합 크리에이티브 스튜디오

프로젝트의 최상위 가치는 여러 생성형 미디어 작업을 단일 UI에 통합하는 데 있다. StandaloneShell.js는 Image, Video, Lip Sync, Cinema, Marketing, Workflow, Agents 탭을 구성하고, packages/studio/src/index.js는 각 스튜디오 컴포넌트를 외부에서 재사용 가능하도록 export한다. 즉, 이 저장소는 단순 데모 페이지가 아니라 재사용 가능한 스튜디오 컴포넌트 패키지 + Next.js 호스트 앱 + Electron 데스크톱 앱의 조합으로 볼 수 있다.

 

캡션: README의 docs/assets/studio_demo.webp에서 추출한 UI 프레임. 모델 선택, 프롬프트 입력, 이미지 생성 탭이 한 화면에 결합되어 있어 프로젝트의 통합 스튜디오 방향성을 보여준다.

2. Image Studio: Text-to-Image와 Image-to-Image 이중 모드

README는 Image Studio가 Text-to-Image와 Image-to-Image를 모두 지원한다고 설명한다. 모델 카탈로그는 packages/studio/src/models.js에 자동 생성된 형태로 들어 있으며, UI는 모델별 스키마를 읽어 필요한 입력 필드와 파라미터를 구성한다. 저장소 설명 기준으로 Text-to-Image는 50개 이상, Image-to-Image는 55개 이상의 모델 계열을 지원한다.

캡션: docs/assets/generated_example.webp에서 추출한 이미지 생성 예시 UI. 프롬프트, 모델 선택, 생성 결과, 히스토리성 결과 표시가 Image Studio의 핵심 경험이다.

3. Multi-Image Input

호환 모델에서는 최대 14개 참조 이미지를 입력으로 사용할 수 있다. 이는 단일 이미지 편집보다 복잡한 캐릭터 일관성, 제품 레퍼런스, 장면 합성, 스타일 참조 작업에 유리하다. 의료·바이오 분야로 확장할 경우에는 여러 이미지 레퍼런스를 한 번에 다루는 기능이 교육용 시각 자료, 프로토콜 설명 이미지, 합성 데이터 스토리보드 제작에 활용될 수 있다. 다만 실제 진단·연구 데이터로 오인되지 않도록 합성 여부를 명확히 표기해야 한다.

4. Video Studio: T2V / I2V 생성

Video Studio는 텍스트-투-비디오와 이미지-투-비디오 작업을 담당한다. README 기준으로 Text-to-Video는 40개 이상, Image-to-Video는 60개 이상의 모델 범주를 지원한다고 되어 있다. 사용자는 이미지나 텍스트를 입력하고, 모델별 duration, aspect ratio, prompt, seed 등 스키마 기반 파라미터를 선택한 뒤 MuAPI 백엔드로 작업을 제출한다.

5. Lip Sync Studio

Lip Sync Studio는 정지 이미지 또는 비디오에 오디오를 결합해 입 모양을 동기화하는 기능이다. README는 9개 전용 립싱크 모델을 언급한다. 구조적으로는 이미지/비디오 업로드, 오디오 업로드, 모델별 파라미터 구성, API 제출, 결과 폴링이라는 동일한 submit-and-poll 패턴을 따른다. 의료 교육 영상, 환자 안내 영상, 실험 프로토콜 설명 영상에 활용할 수 있지만, 실제 인물의 음성·얼굴 사용에는 동의, 저작권, 초상권, 합성 표시 정책이 필요하다.

6. Cinema Studio: 카메라·렌즈·조리개·디퓨전 프리셋

Cinema Studio는 단순 모델 호출을 넘어, 촬영 언어를 프롬프트와 파라미터로 구조화하는 기능에 가깝다. public/assets/cinema/에는 카메라, 렌즈, 조리개, 필터/디퓨전 계열의 시각 프리셋 자산이 들어 있다. 이는 사용자가 “어떤 모델을 돌릴지”뿐 아니라 “어떤 촬영 문법을 적용할지”를 선택하게 만드는 인터페이스 설계다.

 

캡션: public/assets/cinema/에서 수집한 대표 프리셋 자산을 기반으로 만든 콜라주. 카메라 프리셋, 렌즈 프리셋, 조리개 프리셋, halation/diffusion 필터가 Cinema Studio의 촬영 언어 제어 기능과 연결된다.

7. Workflow Studio와 Agent Studio

루트 package.json은 packages/Vibe-Workflow/packages/workflow-builder와 packages/Open-Poe-AI/packages/agents를 워크스페이스로 포함한다. next.config.mjs는 studio, ai-agent, workflow-builder를 transpile 대상으로 지정한다. 이는 Open Generative AI가 단순 이미지 생성 앱을 넘어, 워크플로 노드 편집과 에이전트 기반 실행 흐름을 붙일 수 있는 구조로 설계되었음을 보여준다.

8. Electron 데스크톱 앱과 로컬 추론

README는 로컬 추론이 데스크톱 앱 전용이라고 설명한다. Electron preload.js는 window.localAI API를 노출하며, main.js는 local inference IPC를 등록한다. 로컬 추론에는 두 갈래가 있다. 첫째, stable-diffusion.cpp 계열 sd-cli를 내려받아 로컬 이미지 생성을 수행하는 경로다. 둘째, 사용자가 별도로 실행한 Wan2GP Gradio 서버에 HTTP로 연결해 대형 이미지/비디오 모델을 실행하는 경로다.

캡션: 소스 분석을 기반으로 생성한 로컬 추론 경로도. sd.cpp는 데스크톱 앱 내부에서 바이너리와 모델을 관리하고, Wan2GP는 사용자가 준비한 외부 GPU 서버 또는 로컬 GPU 머신의 Gradio API에 연결한다.

9. API Key, 히스토리, 다운로드 중심의 사용성

StandaloneShell.js는 MuAPI 키를 로컬 스토리지와 쿠키에 보관하고, axios interceptor로 API 요청에 x-api-key를 붙인다. README는 업로드 히스토리, 결과 다운로드, 모델별 UI 필드 등의 사용성을 강조한다. 실제 제품 관점에서는 “생성 모델 호출 UI”가 아니라 모델별 입력 스키마, 파일 업로드, 비동기 작업 폴링, 결과 히스토리를 묶은 작업대에 가깝다.

---

Tech Stack

영역	확인된 기술
프레임워크	Next.js ^15.0.0, React ^19.0.0, React-DOM ^19.0.0
번들/데스크톱	Vite ^5.4.0, Electron ^33.4.11, Electron Builder ^25.1.8
스타일링	루트 Tailwind CSS ^4.2.2, @tailwindcss/vite ^4.1.18; packages/studio 내부 dev dependency에는 Tailwind ^3.3.3도 존재
API 클라이언트	axios ^1.7.0, MuAPI REST endpoint, x-api-key 인증 헤더
워크플로/UI	workflow-builder, ai-agent, @xyflow/react ^12.10.2, reactflow ^11.11.4
Markdown/렌더링	react-markdown ^10.1.0, remark-gfm ^4.0.1, syntax highlighter 계열
데스크톱 로컬 추론	Electron IPC, window.localAI, stable-diffusion.cpp sd-cli, Wan2GP Gradio API bridge
라이선스	MIT

 

주의할 점은 README의 “Tech Stack” 설명 일부가 패키지 메타데이터와 차이가 있다는 점이다. README에는 Next.js 14, React 18, Tailwind v3 계열 문구가 남아 있지만, 루트 package.json의 실제 의존성은 Next.js 15, React 19, Tailwind 4 계열이다. 본 리포트는 구현 상태 판단에서 package.json, next.config.mjs, vite.config.mjs, 실제 소스 구조를 우선했다.

---

Architecture

캡션: README, package.json, app/, components/, packages/studio/, electron/ 소스 분석을 기반으로 생성한 구현 아키텍처 다이어그램. 저장소 원본에 포함된 공식 아키텍처 그림은 아니며, 분석자가 구조를 시각화한 것이다.

구조 요약

Open Generative AI는 다음 네 계층으로 이해하는 것이 가장 명확하다.

1. 호스트 앱 계층
   app/studio/[[...slug]]/page.js가 Studio UI를 렌더링하고, components/StandaloneShell.js가 탭, API 키, 드래그앤드롭, 설정 모달, 잔액 확인, 요청 interceptor를 담당한다.
2. Studio 컴포넌트 계층
   packages/studio/src/components/에는 ImageStudio.jsx, VideoStudio.jsx, LipSyncStudio.jsx, CinemaStudio.jsx, MarketingStudio.jsx, WorkflowStudio.jsx, AgentStudio.jsx 등이 있다. packages/studio/src/index.js는 이 컴포넌트들을 패키지 엔트리로 export한다.
3. 모델·API 계층
   models.js는 모델별 endpoint, 입력 스키마, 카테고리 정보를 제공한다. muapi.js는 파일 업로드, 작업 제출, 결과 폴링, workflow/agent API helper를 제공한다. Cloud path는 일반적으로 POST /api/v1/{endpoint}로 작업을 제출하고, 반환된 request_id를 사용해 GET /api/v1/predictions/{request_id}/result를 반복 조회한다.
4. 데스크톱 로컬 추론 계층
   Electron 앱에서는 main.js와 preload.js가 IPC bridge를 구성한다. localInference.js는 sd-cli 바이너리와 모델 파일을 관리하고, wan2gpProvider.js는 사용자가 실행한 Wan2GP Gradio 서버에 연결한다. 이 계층은 브라우저 hosted demo가 아니라 데스크톱 앱에서 의미가 있다.

캡션: muapi.js와 README의 API 설명을 바탕으로 만든 submit-and-poll 흐름도. 이미지, 비디오, 립싱크, 워크플로 요청은 모델별 endpoint에 작업을 제출한 뒤 prediction 결과를 폴링하는 비동기 구조를 따른다.

작동 원리

사용자가 Studio UI에서 모델과 파라미터를 선택하면, 컴포넌트는 모델 카탈로그의 스키마를 기준으로 입력값을 정규화한다. 이미지·비디오·오디오 파일이 필요하면 먼저 upload endpoint에 전송해 URL을 확보한다. 그 다음 선택한 모델 endpoint로 작업을 제출하고, 완료될 때까지 prediction 결과를 polling한다. 결과 URL 또는 data URL은 UI에서 미리보기, 히스토리, 다운로드 대상으로 노출된다.

 

데스크톱 앱에서는 일부 작업이 MuAPI cloud path를 우회할 수 있다. 사용자가 로컬 모델을 설치하면 sd.cpp 경로로 로컬 이미지 생성을 수행하고, Wan2GP URL을 설정하면 외부 GPU 서버에서 대형 모델 작업을 실행한다. 따라서 “셀프호스팅”은 두 층으로 구분해야 한다. UI 자체는 셀프호스팅 가능하지만, 기본 모델 실행은 MuAPI cloud path에 의존할 수 있으며, 완전한 로컬/자체 인프라 실행은 데스크톱 로컬 추론 또는 Wan2GP 구성에 의해 달라진다.

---

Usage & Setup

Hosted Demo 사용

# 브라우저에서 접속
https://dev.muapi.ai/open-generative-ai

Hosted demo는 가장 빠른 체험 경로다. MuAPI 계정 또는 API key가 필요한 작업이 있으며, 모델 호출은 MuAPI cloud path를 따른다.

로컬 웹 개발 환경

git clone --recurse-submodules https://github.com/Anil-matcha/Open-Generative-AI.git
cd Open-Generative-AI
npm install
npm run dev
# 기본 개발 서버: http://localhost:3000

서브모듈까지 한 번에 준비하려면 루트 package.json의 setup script를 사용할 수 있다.

npm run setup
npm run dev

Production build

npm run build
npm run start

Electron 데스크톱 앱

# macOS 빌드
npm run electron:build

# Windows 빌드
npm run electron:build:win

# Linux 빌드
npm run electron:build:linux

# 전체 플랫폼 빌드 script
npm run electron:build:all

macOS Gatekeeper 관련 안내는 README에 별도 검증 커맨드로 언급되어 있다.

xattr -cr "/Applications/Open Generative AI.app"

로컬 추론 설정 요약

# sd.cpp 계열
# 1. Electron 앱 실행
# 2. Settings → Local Models
# 3. engine install
# 4. 모델 다운로드
# 5. Image Studio에서 local mode 활성화

# Wan2GP 계열: 개념적 흐름
# 1. Wan2GP 저장소를 별도 머신 또는 로컬 GPU 환경에 설치
# 2. Python/PyTorch 환경 준비
# 3. Gradio 서버 실행
python wgp.py --listen --server-name 0.0.0.0

# 4. Open Generative AI 데스크톱 앱에서 Wan2GP URL 등록
# 5. 해당 provider를 통해 이미지/비디오 작업 실행

저장소에는 docs/assets/demo.mp4가 존재하지만, 본 아카이브는 이미지 기반 figures 구성으로 정리했다. README에는 터미널 실행 결과 스크린샷이 포함되어 있지 않아, Usage 섹션에는 원본 명령어와 실행 경로를 중심으로 요약했다.

---

소스 코드 구조 분석

Open-Generative-AI/
├── app/
│   ├── agents/
│   ├── api/
│   ├── studio/[[...slug]]/
│   ├── workflow/[id]/
│   ├── globals.css
│   ├── layout.js
│   └── page.js
├── components/
│   ├── ApiKeyModal.js
│   └── StandaloneShell.js
├── packages/
│   ├── studio/
│   │   └── src/
│   │       ├── components/
│   │       ├── index.js
│   │       ├── models.js
│   │       ├── muapi.js
│   │       └── tailwind.css
│   ├── Vibe-Workflow/
│   └── Open-Poe-AI/
├── electron/
│   ├── main.js
│   ├── preload.js
│   └── lib/
│       ├── localInference.js
│       ├── modelCatalog.js
│       └── wan2gpProvider.js
├── docs/assets/
├── public/assets/cinema/
├── package.json
├── next.config.mjs
└── vite.config.mjs

핵심 파일별 역할

파일/폴더	역할
components/StandaloneShell.js	Studio 탭, API key 저장, axios interceptor, 설정 모달, 드래그앤드롭, 잔액 확인 등 앱 shell 담당
packages/studio/src/components/ImageStudio.jsx	이미지 생성·편집 UI
packages/studio/src/components/VideoStudio.jsx	T2V/I2V 비디오 생성 UI
packages/studio/src/components/LipSyncStudio.jsx	이미지/비디오 + 오디오 기반 립싱크 UI
packages/studio/src/components/CinemaStudio.jsx	카메라·렌즈·조리개·시네마 프리셋 UI
packages/studio/src/models.js	모델 endpoint와 입력 스키마의 단일 카탈로그 역할
packages/studio/src/muapi.js	MuAPI 업로드, submit, polling, workflow/agent helper 함수
electron/preload.js	renderer에서 window.localAI를 사용할 수 있도록 안전한 bridge 노출
electron/lib/localInference.js	stable-diffusion.cpp 바이너리·모델 관리 및 로컬 이미지 생성
electron/lib/wan2gpProvider.js	Wan2GP Gradio 서버 probe, 모델 조회, generation call, SSE/결과 처리

---

Image & Asset Mapping

저장 파일	원본 위치	설명/기능 매칭
figures/project_banner.png	public/banner.png	프로젝트 대표 배너 및 앱 아이콘 계열 자산
figures/studio_demo.png	docs/assets/studio_demo.webp	통합 Studio UI, 모델 선택, 프롬프트 입력, 결과 패널 설명
figures/image_studio_ui.png	docs/assets/generated_example.webp	Image Studio 생성 예시 UI 설명
figures/cinema_modular_camera.png	public/assets/cinema/modular_8k_digital.webp	Cinema Studio 카메라 프리셋
figures/cinema_70s_prime_lens.png	public/assets/cinema/70s_cinema_prime.webp	Cinema Studio 렌즈/시네마 룩 프리셋
figures/cinema_aperture_f14.png	public/assets/cinema/f_1_4.webp	Cinema Studio 조리개·심도 프리셋
figures/cinema_halation_diffusion.png	public/assets/cinema/halation_diffusion.webp	Cinema Studio halation/diffusion 필터 프리셋
figures/cinema_controls_collage.png	위 cinema 자산 기반 생성	Cinema Studio의 카메라·렌즈·조리개·필터 제어를 한 장으로 설명
figures/architecture_diagram.png	소스 분석 기반 생성	구현 아키텍처 설명
figures/api_submission_polling_flow.png	muapi.js와 README API 설명 기반 생성	MuAPI submit-and-poll 흐름 설명
figures/local_inference_paths.png	Electron 소스 분석 기반 생성	sd.cpp와 Wan2GP 로컬 추론 경로 설명

---

Personal Insights

의료 AI 관점

Open Generative AI는 임상 의사결정 지원 도구가 아니라 생성형 미디어 스튜디오다. 따라서 환자 안내 이미지, 의료 교육 영상, 임상 워크플로 설명 자료, 수술 전후 교육용 스토리보드 같은 커뮤니케이션 보조 도구로 보는 것이 타당하다. README가 “no content filters”와 “unrestricted”를 강조하는 만큼, 의료 영역에서는 그대로 사용하기보다 PHI 보호, 사용자 권한, 합성 콘텐츠 워터마크, 승인 워크플로, 로그 감사, 금지 프롬프트 정책을 별도로 얹어야 한다.

셀프호스팅 UI만으로는 의료 데이터 보호가 충분하지 않다. 기본 cloud path에서는 이미지·비디오·오디오가 MuAPI 업로드 endpoint를 거칠 수 있다. 환자 이미지, 음성, 의료기록 기반 프롬프트를 다룰 경우에는 cloud path 사용을 제한하거나, 데스크톱 로컬 추론 또는 기관 내부 GPU/Wan2GP 서버로 경로를 통제해야 한다.

Bioinformatics 관점

바이오인포매틱스에서 이 프로젝트는 분석 알고리즘 자체라기보다 결과 설명·교육·시각화 파이프라인에 가깝다. 예를 들어 세포 이미지 분석 결과를 대중 설명용 그래픽으로 변환하거나, 실험 프로토콜을 영상화하거나, 연구 발표용 schematic을 빠르게 생성하는 데 유용할 수 있다.

단, 합성 microscopy-like 이미지나 실험 결과처럼 보이는 생성물은 연구 데이터와 명확히 분리해야 한다. 실제 wet-lab 결과, 조직 이미지, 현미경 이미지, sequencing 결과를 대체하는 방식으로 사용하면 안 된다. 필요한 통제는 provenance metadata, synthetic label, 생성 프롬프트 기록, 모델 버전 기록, 원본 데이터와 합성 결과의 분리 저장이다.

Autonomous Agent 개발 관점

이 저장소는 에이전트 친화적인 구조를 갖고 있다. 이유는 세 가지다. 첫째, models.js가 모델별 endpoint와 입력 스키마를 제공해 에이전트가 “어떤 모델에 어떤 인자를 넣을 수 있는지”를 파악하기 쉽다. 둘째, muapi.js가 submit, upload, poll을 함수 단위로 분리해 도구화하기 쉽다. 셋째, workflow-builder와 ai-agent 패키지를 워크스페이스로 포함해 노드 기반 실행과 에이전트 기반 실행이 같은 제품 안에 들어갈 여지가 있다.

다만 실서비스 에이전트로 확장하려면 다음 보강이 필요하다.

• 모델 호출 권한을 작업별로 제한하는 scoped credential
• 프롬프트, 모델, seed, 입력 파일, 출력 파일, API response를 남기는 reproducible job log
• 실패/재시도/취소 정책을 명시한 async job controller
• 모델별 capability schema와 금지 입력 정책
• 로컬 추론과 cloud 추론을 분리하는 data routing policy
• 의료·바이오 작업에서는 합성 콘텐츠 표기와 human review gate

기술적 리스크와 개선 방향

1. 문서-구현 버전 불일치
   README의 Tech Stack 표기와 루트 package.json의 실제 버전이 다르다. 향후 릴리스마다 README의 stack section을 자동 갱신하거나, package.json 기반으로 문서화하는 것이 좋다.
2. API key 저장 방식
   브라우저 localStorage와 cookie 기반 key 저장은 프로토타입에는 단순하지만, 엔터프라이즈·의료 환경에서는 secret storage, server-side token exchange, organization policy가 필요하다.
3. Electron 보안 설정
   contextIsolation: true, nodeIntegration: false는 긍정적이다. 다만 Electron 설정에 webSecurity: false가 있어, 배포형 데스크톱 앱에서는 origin policy, preload surface, URL allowlist, IPC input validation을 강화해야 한다.
4. Cloud path와 local path의 UX 분리
   사용자는 “셀프호스팅”과 “로컬 추론”을 혼동하기 쉽다. UI에서 각 모델이 cloud 실행인지, 로컬 실행인지, 외부 Wan2GP 서버 실행인지 명확히 표시하면 데이터 거버넌스 측면에서 유리하다.
5. 워크플로/에이전트의 감사 가능성
   Workflow Studio와 Agent Studio는 강력한 확장 지점이다. 향후에는 각 노드의 입력·출력·모델 버전·에러 상태를 저장하는 provenance graph가 필요하다. 이는 바이오인포매틱스와 의료 AI에서 특히 중요하다.

---

결론

Open Generative AI는 “생성형 이미지/비디오 모델 모음집”이라기보다, 모델 카탈로그, 스키마 기반 UI, MuAPI 비동기 호출, 데스크톱 로컬 추론, 시네마 프리셋, 워크플로/에이전트 확장성을 결합한 오픈소스 생성형 미디어 작업대다. 강점은 폭넓은 모델 범주와 빠른 UI 통합이며, 한계는 cloud execution 의존성, 문서-구현 버전 불일치, 보안·거버넌스 보강 필요성이다.

의료 AI와 바이오인포매틱스에서는 실제 임상·연구 판단이 아니라 교육, 설명, 시각화, synthetic storyboard 제작 용도로 접근하는 것이 안전하다. Autonomous Agent 관점에서는 모델 스키마와 submit/poll API가 도구화하기 쉬우므로, 향후 agent-driven creative pipeline의 기반으로 확장 가능성이 있다.

---

참고한 주요 원본 경로

• README.md
• project_knowledge.md
• package.json
• next.config.mjs
• vite.config.mjs
• app/studio/[[...slug]]/page.js
• components/StandaloneShell.js
• packages/studio/src/index.js
• packages/studio/src/models.js
• packages/studio/src/muapi.js
• packages/studio/src/components/
• electron/main.js
• electron/preload.js
• electron/lib/localInference.js
• electron/lib/wan2gpProvider.js
• docs/assets/
• public/assets/cinema/