사용 안내서 취소

오버레이 추가

인터랙티브 슬라이드 효과를 시뮬레이트하기 위해 오버레이를 추가하는 방법에 대해 알아봅니다.

Adobe XD를 사용하면 여러 장의 아트보드에 중복되지 않고 다른 아트보드 위에 콘텐츠를 쌓아 드롭다운 목록, 슬라이드업 키보드 등의 효과를 시뮬레이트할 수 있습니다. 

아트보드에 오버레이로 표시되는 키보드
아트보드에 오버레이로 표시되는 키보드

  1. 디자인 모드에서 소스 아트보드와 여기에 오버레이로 사용할 다른 아트보드를 선택합니다. 오버레이 아트보드는 여러 번 재사용할 수 있습니다. 

  2. 프로토타입 모드에서 소스 아트보드로부터 커넥터를 드래그하여 오버레이 콘텐츠가 있는 아트보드에 드롭합니다. 커넥터를 클릭하여 속성 관리자에 표시되는 인터랙션 패널을 확인하고 다음 옵션을 설정합니다.

    • 트리거: 옵션을 선택합니다.
    • 액션: 오버레이를 선택합니다과 같은 단일 트리거에 두 개의 동작을 할당하려면 속성 관리자의 첫 번째 동작 + 버튼을 오버레이로 설정하고 두 번째 동작 + 버튼을 오디오 재생 또는 음성 재생
      과 같은 비전환 동작으로 설정하십시오.
    • 애니메이션: 애니메이션 유형을 선택합니다. 위로 슬라이드 또는 아래로 슬라이드를 선택하면 XD가 자동으로 오버레이를 소스 아트보드의 가장자리에 배치합니다.
    • 이징: 이징 효과를 시뮬레이트할 옵션을 선택합니다.
    • 지속 시간: 지속 시간을 입력합니다. 전환하는 두 개의 아트보드 사이에서 설정할 수 있는 최대 지속 시간은 5초입니다. 
    소스 아트보드에서 오버레이로 키보드 추가
    소스 아트보드에서 오버레이로 키보드 추가

  3. 소스 아트보드에서 오버레이의 위치를 조정하려면 녹색 위치 손잡이(+)를 클릭하고 드래그하고 드롭합니다.

  4. 지원되는 브라우저에서 오버레이를 미리 보려면 를 클릭합니다. 

중첩된 오버레이

Adobe XD는 다른 오버레이 위에 오버레이를 적용한 중첩된 오버레이를 지원하지 않습니다. 이러한 경우 첫 번째 오버레이 아트보드를 다른 아트보드에 연결하면 두 번째 오버레이가 안쪽으로 전환되기 전에 첫 번째 오버레이가 바깥쪽으로 전환됩니다. 

예제 및 샘플 파일

또한 XD 커뮤니티를 통해 더 많은 튜토리얼 및 샘플 파일을 구할 수 있습니다.

관련 항목 더 보기

쉽고 빠르게 지원 받기

신규 사용자이신가요?