> ## Documentation Index
> Fetch the complete documentation index at: https://dripart-feat-openapi-i18n.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# ComfyUI 앱 모드 가이드

> ComfyUI에서 앱 모드를 구축하고 사용하는 방법을 알아보세요. 맞춤형 입력/출력 인터페이스를 정의하여 워크플로우 상호작용을 간소화할 수 있습니다.

앱 모드는 맞춤형 입력/출력 인터페이스를 정의함으로써 워크플로우 상호작용을 간소화하며, 노드를 편집하지 않고도 워크플로우를 더 쉽게 공유하고 사용할 수 있게 해줍니다.

<iframe className="w-full aspect-video rounded-xl" src="https://www.youtube.com/embed/MR6CmStFoWA" title="ComfyUI 앱 모드 가이드" allow="accelerometer; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowFullScreen />

<Note>
  앱 모드는 ComfyUI 프론트엔드 버전 1.41.13부터 공식적으로 지원됩니다. 이전 버전은 초기 테스트 단계에 있습니다.
</Note>

## 앱 모드 진입하기

앱 모드로 들어가는 방법은 두 가지가 있습니다: 왼쪽 상단 아이콘(**1**)을 클릭한 후 드롭다운 메뉴에서 **앱 모드 진입**을 선택하거나, 인터페이스 상단의 브레드크럼 탐색 드롭다운(**2**)을 이용하는 것입니다.

<img src="https://mintcdn.com/dripart-feat-openapi-i18n/WhcZZG9iKeTIiBLb/images/interface/app_mode/app_mode_1.png?fit=max&auto=format&n=WhcZZG9iKeTIiBLb&q=85&s=4a03b2841123b3a26a59e1ef0d630279" alt="왼쪽 상단 메뉴를 통한 앱 모드 진입" width="2400" height="1446" data-path="images/interface/app_mode/app_mode_1.png" />

1. 왼쪽 상단 아이콘(표시된 **1**)을 클릭해 드롭다운 메뉴를 열고 **앱 모드 진입**을 선택하세요.
2. 또는 상단의 브레드크럼 탐색 드롭다운(표시된 **2**)을 사용해 앱 모드로 진입하세요.

## 앱 모드 워크플로우 구축하기

<iframe className="w-full aspect-video rounded-xl" src="https://www.youtube.com/embed/tqLY-vjY-3I" title="앱 모드 워크플로우 생성 방법" allow="accelerometer; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowFullScreen />

워크플로우가 앱 모드로 설정된 적이 없다면, 앱 모드로 진입하면 자동으로 앱 모드 빌더가 열립니다.

<img src="https://mintcdn.com/dripart-feat-openapi-i18n/WhcZZG9iKeTIiBLb/images/interface/app_mode/app_mode_2.png?fit=max&auto=format&n=WhcZZG9iKeTIiBLb&q=85&s=0f74d720be1728f8cb5ba7af1cc9e5aa" alt="앱 모드 빌더 진입 화면" width="2404" height="1450" data-path="images/interface/app_mode/app_mode_2.png" />

1. 워크플로우에 기존 앱 모드 설정이 없다면 기본적으로 앱 모드 빌더가 열립니다.
2. **앱 빌드**를 클릭해 앱 빌더로 들어가서 구성하기 시작하세요.

### 1단계: 입력 선택하기

빌더 인터페이스 상단에는 네 개의 안내 단계(표시된 **1**, **2**, **3**, **4**)가 표시됩니다. 하단 바에서는 빌더를 종료하거나 단계 간 이동할 수 있습니다.

<img src="https://mintcdn.com/dripart-feat-openapi-i18n/WhcZZG9iKeTIiBLb/images/interface/app_mode/app_mode_3.png?fit=max&auto=format&n=WhcZZG9iKeTIiBLb&q=85&s=a23c48a0bf43c0fd160117ed9d81d0e4" alt="앱 빌더 인터페이스 개요" width="2398" height="1448" data-path="images/interface/app_mode/app_mode_3.png" />

1. 상단의 숫자 **1 2 3 4**는 네 개의 빌드 단계에 해당합니다: 입력 선택, 출력 선택, 미리보기, 기본 보기 설정.
2. 하단의 버튼들은 빌더를 종료하거나 단계 간 이동할 수 있도록 합니다.
3. 캔버스에 표시된 영역들은 선택 가능한 입력/출력 파라미터입니다.
4. 오른쪽 패널은 현재 구성의 실시간 미리보기를 보여줍니다.

상단의 **입력** 단계를 클릭하세요. 캔버스는 선택 가능한 입력 노드를 강조합니다. 노드를 클릭해 입력 파라미터로 선택하세요—옵션으로는 이미지 업로드, 텍스트 프롬프트 입력, 모델 선택 등이 있습니다. 선택된 파라미터는 오른쪽 사이드바에 나타납니다.

### 2단계: 출력 선택하기

**출력** 단계를 클릭하세요. 미리보기 노드나 이미지 저장 노드와 같이 앱에 표시할 출력 노드를 선택하세요.

<img src="https://mintcdn.com/dripart-feat-openapi-i18n/WhcZZG9iKeTIiBLb/images/interface/app_mode/app_mode_4.png?fit=max&auto=format&n=WhcZZG9iKeTIiBLb&q=85&s=4f5e79c70da75b14e8c5a739214ca18c" alt="오른쪽 패널 미리보기와 함께 출력 노드 선택" width="2402" height="1448" data-path="images/interface/app_mode/app_mode_4.png" />

1. 앱에 표시할 출력 노드를 선택하세요.
2. 입력과 마찬가지로 오른쪽 사이드바는 선택한 출력 노드의 실시간 미리보기를 보여줍니다.

### 3단계: 미리보기

**미리보기** 단계를 클릭해 최종 앱 레이아웃을 확인하세요. 선택한 입력은 오른쪽 패널에 나타나며, 출력 영역은 캔버스에 표시됩니다.

<img src="https://mintcdn.com/dripart-feat-openapi-i18n/WhcZZG9iKeTIiBLb/images/interface/app_mode/app_mode_5.png?fit=max&auto=format&n=WhcZZG9iKeTIiBLb&q=85&s=47a7f990fbd37d26519217941a2e84fc" alt="입력 및 출력 레이아웃을 보여주는 미리보기 모드" width="2464" height="1434" data-path="images/interface/app_mode/app_mode_5.png" />

1. 이것이 미리보기 모드입니다—모든 입력 및 출력 구성이 예상대로 나타나는지 확인하세요.
2. 조정이 필요하다면 **뒤로**를 클릭해 이전 단계로 돌아가세요.

### 4단계: 기본 보기 설정하기

**기본 보기 설정** 단계를 클릭하세요. 워크플로우가 기본적으로 **앱** 모드로 열릴지, 아니면 **노드 그래프** 모드로 열릴지 선택하세요. **적용**을 클릭해 확인하세요.

<img src="https://mintcdn.com/dripart-feat-openapi-i18n/WhcZZG9iKeTIiBLb/images/interface/app_mode/app_mode_6.png?fit=max&auto=format&n=WhcZZG9iKeTIiBLb&q=85&s=e6598f470abe2582ec03f020088ad63d" alt="앱/노드 그래프 옵션을 포함한 기본 보기 설정 단계" width="2464" height="1432" data-path="images/interface/app_mode/app_mode_6.png" />

1. 워크플로우가 열릴 때 기본적으로 **앱** 모드로 열릴지, 아니면 **노드 그래프** 모드로 열릴지 선택하세요.
2. **앱**을 선택하고 **적용**을 클릭해 확인하세요. 그러면 워크플로우가 기본적으로 앱 모드로 열립니다.

적용 후, 확인 메시지가 나타납니다.

<img src="https://mintcdn.com/dripart-feat-openapi-i18n/WhcZZG9iKeTIiBLb/images/interface/app_mode/app_mode_7.png?fit=max&auto=format&n=WhcZZG9iKeTIiBLb&q=85&s=59c1748fdcfc190ffdd8e1e070f7da34" alt="뷰 앱 버튼이 있는 확인 메시지" width="2462" height="1436" data-path="images/interface/app_mode/app_mode_7.png" />

**뷰 앱**을 클릭해 앱 모드로 진입하고 워크플로우를 사용하세요.

## 앱 모드 사용하기

앱 모드에서는 오른쪽 패널에 모든 구성된 입력 옵션이 표시됩니다. 필요에 따라 입력을 조정한 다음, **실행**을 클릭해 워크플로우를 실행하세요.

<img src="https://mintcdn.com/dripart-feat-openapi-i18n/WhcZZG9iKeTIiBLb/images/interface/app_mode/app_mode_8.png?fit=max&auto=format&n=WhcZZG9iKeTIiBLb&q=85&s=9828b3e79bfc8fdbaa39f6ffd02700be" alt="입력 패널과 실행 버튼이 있는 앱 모드 인터페이스" width="2491" height="1438" data-path="images/interface/app_mode/app_mode_8.png" />

1. 오른쪽 **입력** 패널에서는 실행 전에 입력 파라미터를 조정할 수 있습니다.
2. **실행**을 클릭해 워크플로우를 실행하세요.
3. 왼쪽 사이드바에서는 앱 재구성, 자산 보기, 워크플로우 패널 열기 등 추가 컨트롤을 제공합니다.

앱 모드는 모바일 및 좁은 화면 레이아웃에도 최적화되어 있습니다. 인터페이스는 탭 기반 뷰로 변환되어, 입력 패널, 출력 뷰, 미디어 자산 패널 간에 전환할 수 있습니다.

<img src="https://mintcdn.com/dripart-feat-openapi-i18n/WhcZZG9iKeTIiBLb/images/interface/app_mode/app_mode_15.png?fit=max&auto=format&n=WhcZZG9iKeTIiBLb&q=85&s=d3cc23773ec61048347e8772907c8fee" alt="앱 모드 모바일 레이아웃과 입력, 출력, 자산 탭" width="2494" height="1545" data-path="images/interface/app_mode/app_mode_15.png" />

실행 중에는 상단에 **이번 실행 취소** 버튼이 나타나 현재 실행을 중지할 수 있습니다.

<img src="https://mintcdn.com/dripart-feat-openapi-i18n/WhcZZG9iKeTIiBLb/images/interface/app_mode/app_mode_9.png?fit=max&auto=format&n=WhcZZG9iKeTIiBLb&q=85&s=2c7cc400d4b2fc8eb653b73d28792631" alt="실행 상태와 취소 옵션 및 결과 패널" width="2490" height="1438" data-path="images/interface/app_mode/app_mode_9.png" />

1. 상단의 **이번 실행 취소**를 클릭해 현재 실행을 중지하세요.
2. 하단 패널에서 대기열 뷰와 결과 뷰 간에 전환하세요.
3. 관련 영역을 클릭해 자산 패널을 열어보세요.

## 워크플로우 저장 및 공유하기

### 워크플로우 저장하기

`Ctrl + S`(Mac에서는 `Cmd + S`)를 사용해 워크플로우를 저장해 미래에 다시 사용하세요.

왼쪽 사이드바 버튼을 클릭해 저장된 워크플로우 패널을 열어보세요.

<img src="https://mintcdn.com/dripart-feat-openapi-i18n/WhcZZG9iKeTIiBLb/images/interface/app_mode/app_mode_11.png?fit=max&auto=format&n=WhcZZG9iKeTIiBLb&q=85&s=f176c906bf597e4eaead633c37ad5636" alt="저장된 앱 워크플로우를 보여주는 왼쪽 사이드바" width="2495" height="1441" data-path="images/interface/app_mode/app_mode_11.png" />

1. 왼쪽 사이드바 버튼을 클릭해 패널을 열면, 저장된 모든 앱 워크플로우가 표시됩니다.
2. 이 패널에서 저장된 앱 워크플로우 간에 전환하세요.

### 워크플로우 공유하기

<iframe className="w-full aspect-video rounded-xl" src="https://www.youtube.com/embed/-JEDHJktsr0" title="워크플로우 공유 방법" allow="accelerometer; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowFullScreen />

앱 모드에서 왼쪽 사이드바의 **공유** 버튼을 클릭하세요. 워크플로우가 아직 저장되지 않았다면, 링크를 만들기 전에 먼저 저장하라는 대화상자가 나타납니다.

<img src="https://mintcdn.com/dripart-feat-openapi-i18n/WhcZZG9iKeTIiBLb/images/interface/app_mode/app_mode_12.png?fit=max&auto=format&n=WhcZZG9iKeTIiBLb&q=85&s=de5c33e44aeeb3a67770af6cbf6f41b6" alt="워크플로우 저장을 요구하는 공유 대화상자" width="2494" height="1436" data-path="images/interface/app_mode/app_mode_12.png" />

1. 왼쪽 사이드바의 공유 버튼을 클릭해 공유 대화상자를 열어보세요.
2. 워크플로우가 저장되지 않았다면, 워크플로우 이름을 입력하고 **워크플로우 저장**을 클릭해 계속 진행하세요.

저장된 후, 공유 대화상자는 링크 생성 옵션을 보여줍니다.

<img src="https://mintcdn.com/dripart-feat-openapi-i18n/WhcZZG9iKeTIiBLb/images/interface/app_mode/app_mode_13.png?fit=max&auto=format&n=WhcZZG9iKeTIiBLb&q=85&s=7bea2865233b83f1aaaece6603e7253b" alt="링크 생성 버튼이 있는 공유 대화상자" width="2494" height="1436" data-path="images/interface/app_mode/app_mode_13.png" />

**링크 생성**을 클릭해 워크플로우의 공유 가능한 URL을 생성하세요.

<img src="https://mintcdn.com/dripart-feat-openapi-i18n/WhcZZG9iKeTIiBLb/images/interface/app_mode/app_mode_14.png?fit=max&auto=format&n=WhcZZG9iKeTIiBLb&q=85&s=34c848512c70f06ed2b467612cceca53" alt="생성된 링크를 보여주는 공유 대화상자와 복사 버튼" width="2494" height="1438" data-path="images/interface/app_mode/app_mode_14.png" />

**복사**를 클릭해 링크를 복사하세요. 수신자는 이를 열어 바로 워크플로우를 실행할 수 있으며, 링크에는 전체 워크플로우 구성이 포함됩니다.

<Note>
  공유 링크는 Comfy Cloud에서만 지원됩니다.
</Note>
