Adobe XD에서 사용자가 콘텐츠를 탐색할 수 있는 슬라이드 쇼를 디자인할 수 있습니다.
create-slideshow-header_1000x560

슬라이드 쇼를 디자인할 때 먼저 이미지를 위한 자리 표시자를 만들어 디자인의 레이아웃을 설정합니다.

create-slideshow_step1

콘텐츠뿐만 아니라 사용자가 슬라이드 쇼와 인터랙션하는 방식을 고려하는 것이 중요합니다. 이미지 간을 드래그하거나 이동 버튼을 클릭하는 등 슬라이드 쇼 레이아웃을 다양하게 디자인하여 가장 효과적인 레이아웃을 결정합니다.

create-slideshow_step2

디자인을 완성하면 프로토타입 모드로 전환하여 인터랙티브한 요소를 정의합니다. 그룹 내의 개별 오브젝트를 다음 아트보드에 연결할 수 있습니다. 드래그 트리거를 사용하면 사용자가 이미지를 스와이프하도록 설정할 수 있고 자동 애니메이트 액션을 사용하면 선택한 이미지가 제 위치로 이동하도록 애니메이션을 적용할 수 있습니다. 애니메이션을 적용할 오브젝트가 소스 및 대상 아트보드에서 동일한 이름인지 확인합니다. 그런 다음 데스크탑 미리보기에서 인터랙션을 테스트하고 슬라이드 쇼가 예상대로 작동할 때까지 조정합니다. 다음은 음악 검색 앱용으로 적합한 디자인입니다.

create-slideshow_step3

이처럼 슬라이드 쇼를 만들면 앱에서 많은 공간을 차지하지 않는 형식으로 더 많은 콘텐츠를 제공할 수 있습니다.

09/02/2020

Adobe Stock 콘텐츠 제공: PhotoPlus+

이 페이지가 도움이 되었습니까?