프로토타입 모드로 전환합니다.
- Adobe XD 사용 안내서
- 소개
- 디자인
- 아트보드, 안내선 및 레이어
- 모양, 오브젝트 및 패스
- 텍스트 및 글꼴
- 구성 요소 및 상태
- 마스킹 및 효과
- 레이아웃
- 비디오 및 Lottie 애니메이션
- 프로토타입
- 공유, 내보내기 및 검토
- 디자인 시스템
- 클라우드 문서
- 통합 기능 및 플러그인
- iOS 및 Android용 XD
- 문제 해결
- 알려진 문제 및 해결된 문제
- 설치 및 업데이트
- 실행 및 충돌
- 클라우드 문서 및 Creative Cloud Libraries
- 프로토타이핑, 게시 및 검토
- 다른 앱 가져오기, 내보내기 및 작업
음성 명령, 음성 재생 및 오디오 재생을 사용하여 프로토타입을 제작하고 디자인하는 방법을 알아봅니다.
음성 명령을 사용하여 아트보드 또는 구성 요소 상태 간 인터랙션을 트리거하거나 음성, 오디오, 비디오 또는 Lottie를 재생할 수 있습니다.
음성을 트리거로 설정한 다음 음성 명령을 입력합니다. 전환, 자동 애니메이트, 오버레이, 스크롤 위치, 이전 아트보드, 오디오 재생, 음성 재생, 비디오 재생 또는 Lottie 재생 등을 액션 유형으로 선택합니다. 예를 들어 모바일 앱에서 음성 검색을 통합하는 경우 음성 및 음성 재생을 사용하여 아트보드 사이를 자동으로 전환할 수 있습니다.
프로토타입에 음성 명령 추가
-
-
인터랙션을 정의하려면 소스 오브젝트, 구성 요소 상태 또는 아트보드에서 파란색 커넥터를 클릭합니다. 속성 관리자에서 다음 옵션을 설정합니다.
- 트리거: 음성으로 설정합니다.
- 명령: 텍스트로 음성 명령을 입력합니다.
- 액션: 전환으로 설정합니다.
- 대상: 대상 아트보드 또는 구성 요소 상태를 설정합니다.
- 애니메이션: 사용 가능한 옵션을 기반으로 애니메이션을 설정합니다.
- 이징: 사용 가능한 옵션을 기반으로 이징 효과를 설정합니다.
- 지속 시간: 지속 시간을 초 단위로 설정합니다.
A. 트리거를 음성으로 설정 B. 음성 명령을 텍스트로 입력
A. 트리거를 음성으로 설정 B. 음성 명령을 텍스트로 입력 C. 대상을 구성 요소 상태로 설정
-
오브젝트, 구성 요소 상태 또는 아트보드에 대해 둘 이상의 인터랙션을 정의하려면:
- 선택한 다음 +를 클릭할 수 있습니다. 또는 속성 관리자에서 +를 클릭하십시오.
- 속성 관리자에서 속성을 설정합니다.
탭, 드래그, 마우스 가져다 대기 및 시간 트리거는 한 번만, 음성, 키 및 게임패드는 여러 번 적용할 수 있습니다.
-
업데이트된 변경 내용을 보려면 데스크탑 미리보기 버튼()을 선택하십시오.
-
다음 아트보드 또는 구성 요소 상태로의 전환을 미리 보려면 스페이스 바를 누른 상태에서 음성 명령을 반복합니다.
프로토타입에 재생 추가
오디오 재생 추가
오디오 재생 작업을 사용하여 프로토타입에 사운드 효과를 추가하십시오. 예를 들어 이메일을 성공적으로 전송한 후의 확인음을 추가할 수 있습니다. 오디오를 MP3 또는 WAV 파일로 가져올 수 있습니다.
오브젝트나 아트보드에서 오디오 재생을 추가하려면 다음 단계를 수행하십시오.
-
프로토타입 모드에서 오브젝트 또는 아트보드를 선택합니다.
-
속성 관리자에서 다음 옵션을 설정합니다.
- +를 클릭하여 인터랙션을 추가합니다.
- 트리거: 탭으로 설정합니다.
- 액션: 오디오 재생으로 설정한 다음 오디오 파일을 검색하여 추가합니다.
오디오 자동 재생은 Safari 설정에서 자동 재생을 활성화한 경우에만 Safari에서 작동합니다. XD 프로토타입 링크에 대한 자동 재생을 활성화하려면 Safari에서 사운드 자동 재생 활성화를 참조하십시오.
단일 트리거에서 다중 액션 추가
단일 트리거에서 전환 또는 자동 애니메이트와 같은 기본 전환 동작을 사용하여 오디오 재생과 같은 비전환 동작을 추가할 수 있습니다. 예를 들어, 현재 아트보드에서 다른 아트보드로 전환될 때의 마우스의 클릭음을 추가할 수 있습니다.
프로토타입에 다중 액션을 추가하려면 다음 단계를 수행하십시오.
-
프로토타입 모드에서 다중 액션을 추가하려는 오브젝트 또는 아트보드를 선택합니다.
-
속성 관리자에서 다음 옵션을 설정합니다.
- +를 클릭하여 인터랙션을 추가합니다.
- 트리거: 탭으로 설정합니다.
- 첫 번째 액션 + 버튼(전환 액션)을 전환, 자동 애니메이트, 오버레이, 스크롤 위치 또는 이전 아트보드로 설정합니다.
- 두 번째 액션 + 버튼(비전환 액션)을 오디오 재생 또는 음성 재생으로 설정합니다.
속성 관리자의 두 번째 액션 + 버튼은 탭을 트리거로 설정한 경우에만 활성화됩니다. 또한 오디오 재생 또는 음성 재생과 같은 비전환 액션을 첫 번째 액션으로 설정하는 경우 두 번째 액션 + 버튼이 활성화되지 않습니다.
음성 재생 추가
오브젝트나 아트보드에 음성 재생을 추가하려면 다음 단계를 수행하십시오.
-
소스 아트보드의 와이어를 대상 아트보드로 드래그합니다.
-
음성 재생을 추가하려면 속성 관리자에서 다음 옵션을 설정하십시오.
- 트리거: 시간으로 설정합니다.
- 지연: 음성 재생이 시작되는 시간을 정의하기 위해 시간 지연(초 단위)을 설정합니다.
- 액션: 음성 재생으로 설정합니다.
- 목소리: 음성 재생을 위한 목소리를 선택합니다.
- 음성: 음성 재생에 사용할 텍스트를 입력합니다.
A. 트리거를 시간으로 설정 B. 시간 지연을 초 단위로 설정 C. 액션을 음성 재생으로 설정 D. 음성 설정 E. 재생에 사용할 텍스트 입력
-
변경 내용을 미리보기하려면 데스크탑 미리보기 버튼()을 클릭하십시오.
-
다음 아트보드로의 전환을 미리 보려면 스페이스 바를 누른 상태에서 음성 명령을 반복합니다.
프로토타입에 음성 내레이션 추가
-
프로토타입 모드에서 플로우의 시작이 설정되어 있는 홈 화면을 선택한 다음 데스크탑 미리보기 버튼을 클릭합니다.
-
녹화 버튼 옆에 있는 드롭다운 화살표를 선택한 다음 마이크 활성화 옵션을 선택합니다(macOS). Windows를 사용하는 경우 게임센터의 OS 수준 컨트롤을 통해 마이크를 활성화하십시오. 녹화 시 인터페이스에서 깜박이는 빨간색 아이콘을 눈여겨 보십시오.
-
녹화 내용을 MP4 파일로 저장하고 관련자와 공유하거나 소셜 미디어에 게시할 수 있습니다.
음성 재생과 같은 XD의 오디오 출력을 직접 캡처하지는 않습니다. 마이크는 사용자 설정에 따라 출력을 오버헤드하거나 녹음합니다(시스템 마이크는 시스템 스피커에서 재생되는 음성 재생을 들을 수 있습니다).
웹에서 프로토타입 또는 디자인 사양 링크 공유 및 검토
-
데스크탑 앱에서 오른쪽 상단의 공유 아이콘을 클릭한 다음 디자인 검토(프로토타입의 경우) 또는 개발(디자인 사양의 경우)를 선택합니다.
-
다음에서 프로토타입을 미리보기할 때,
- 데스크탑 또는 노트북: 스페이스 바를 누릅니다.
- Adobe XD Mobile 앱(iOS / Android): 화면의 아무 곳이나 길게 누릅니다. 손가락을 화면에 놓고(움직이지 않고) 음성 명령을 사용하고 난 후 화면에서 손가락을 뗍니다.
- 스마트폰의 모바일 브라우저: 화면 오른쪽 하단의 마이크 아이콘을 누릅니다.
-
디자인 사양을 미리 볼 때 개발자는 음성 명령 및 음성 재생을 텍스트로 읽거나 조회할 수 있습니다.
디자인 사양은 음성 인터랙션을 지원하지 않습니다.
기본적으로 Safari에서는 사운드 자동 재생이 비활성화되어 있습니다. XD 프로토타입 링크에서 사운드 자동 재생을 활성화하려면 다음 단계를 따르십시오.
- Safari에서 XD 프로토타입 링크를 엽니다.
- macOS 메뉴 바에서 Safari > 환경 설정으로 이동합니다.
- 웹 사이트 탭에서 왼쪽 창에 표시되는 자동 재생을 선택합니다.
- 아래 웹 사이트에서 미디어 자동 재생 허용 창에서 xd.adobe.com 옆의 모든 자동 재생 허용을 선택합니다.
이 설정을 사용하면 향후 XD 프로토타입 링크의 사운드가 자동으로 작동합니다.
Chrome에서 프로토타입을 실행할 때 재생 작업에 문제가 있다는 오류가 표시되면 Chrome 설정에서 사운드를 활성화하십시오.
Chrome 설정에서 XD 프로토타입 링크의 사운드를 활성화하려면 다음 단계를 따르십시오.
- Chrome 주소창에 chrome://settings/content/sound를 입력합니다. Enter 키를 누릅니다.
- 맞춤 설정한 동작 섹션에서 소리 재생이 허용됨 옆에 있는 추가를 클릭하고 https://xd.adobe.com을 추가합니다.
이 설정을 사용하면 향후 XD 프로토타입 링크에서 오디오가 재생됩니다.
알림을 사용하여 음성 인터랙션 문제 해결
이제 데스크탑 또는 웹에서 프로토타입을 미리 보는 동안 음성 트리거된 인터랙션 문제를 해결할 수 있습니다. 디자인 사양을 검토하는 관련자도 이 기능을 통해 Adobe XD의 프로토타입과 인터랙션하는 방법을 보다 깊이 이해할 수 있습니다.
프로토타입에 대해 이야기하기에 앞서 미리보기 시 알림 표시 메뉴 옵션이 선택되어 있어야 합니다. 기본적으로 이 메뉴 옵션은 Adobe XD를 실행할 때 선택된 상태입니다.
XD에 전달하는 각 명령은 현재 아트보드 또는 구성 요소 상태에 있는 모든 음성 트리거와 일치합니다. 일치하는 항목이 없는 경우에는 {내가 전달한 명령}에 대해 일치하는 항목 없음으로 시작하는 알림이 수신됩니다. XD가 전달 받은 명령을 직접 눈으로 확인하는 것은 음성 명령과 일치하는 항목을 찾을 수 없는 이유를 알아내는 데 유용합니다.
일치하는 항목을 찾을 수 없는 이유는 다양합니다. 전달한 음성 명령이 해당 아트보드 또는 구성 요소 상태의 어떠한 인터랙션에서도 사용되지 않는 것일 수 있습니다. 또는 음성 인식 서비스가 예상치 않은 결과를 반환하는 것일 수도 있습니다.
예를 들어 인터랙션에서 음성 명령으로 2달러를 추가한다고 가정해 봅시다. 하지만 명령 전달 시 음성 인식 서비스는 $2.00를 반환할 수 있습니다. 알림에서는 숫자가 단어를 대체하므로 단어 대신 숫자를 사용하도록 인터랙션을 변경해야 한다는 것을 알 수 있습니다.