Adobe XD에서 UI 키트 및 아이콘 세트 리소스를 사용하여 앱을 디자인할 수 있습니다.
add-emoji_1000x560

iOS용 Apple UI 디자인 리소스에서 다양한 요소를 사용하여 앱을 디자인할 수 있습니다. XD용 UI 키트를 다운로드하여 즐겨 사용하는 플랫폼용으로 디자인해 보시기 바랍니다.

add-emoji_step1

제조업체의 툴킷에서 제공되는 UI 키트를 사용하거나 직접 재미있는 요소를 만들 수 있습니다. 또한 Adobe Stock 또는 Creative Cloud Market에서 여러 유형의 요소를 찾을 수 있습니다. 다음은 다양한 라이브러리와 아이콘 세트에서 찾은 미소 이모지의 샘플입니다.

add-emoji_step2

간편하게 에셋을 복사하여 디자인에 붙여넣을 수 있습니다. 이 경우 시스템 키보드와 iOS용 Smileys & People 이모지 세트를 사용하여 애플리케이션용 채팅 구성 요소를 디자인했습니다.

add-emoji_step3

몇 개의 중간 채팅 화면을 만들고 프로토타입 모드에서 자동 애니메이트 액션을 사용하여 아트보드를 연결했습니다. 자동 애니메이트를 통해 XD는 이름이 동일한 레이어 또는 레이어 그룹을 찾아 이들 간의 차이를 애니메이션으로 적용합니다. 이 디자인의 경우 아트보드의 상단 부분에 있는 요소를 그룹화하고 그룹 이름을 Chat으로 지정했습니다.

add-emoji_step4

다양한 UI 키트의 디자인 요소를 사용하여 앱 디자인 및 프로토타이핑에 걸리는 시간을 단축해 보시기 바랍니다.

09/02/2020

Adobe Stock 콘텐츠 제공: SFIO CRACHO

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