Adobe XD에서 인터페이스를 디자인하고 시험 제작하는 방법에 대해 학습합니다.

Adobe XD에서 툴바나 속성 관리자와 같은 다양한 요소를 사용하여 디자인 및 프로토타입을 제작하고 다듬을 수 있습니다. 이러한 요소는 Adobe XD의 작업 영역에 있습니다.

홈 화면

Adobe XD를 실행하면 홈 화면이 표시됩니다.

홈 화면에서는 아트보드 사전 설정, Add-on, 클라우드 문서, 나와 공유된 파일, 링크 관리, 삭제된 파일 및 내 컴퓨터에 저장된 파일에 빠르게 액세스할 수 있습니다. 또한 최근에 액세스한 XD 파일, XD의 새로운 기능, 학습 및 지원 문서, 빌트인 튜토리얼 및 제품 피드백 제공 옵션을 빠르게 이용할 수 있습니다.

XD의 홈 화면
XD의 홈 화면

Add-on

홈 화면의 왼쪽 창에 있는 Add-on 탭에서 플러그인, UI 키트 및 앱 통합에 액세스할 수 있습니다.

플러그인은 복잡하고 반복적인 작업을 자동화하거나 기본적인 XD 작업 과정 내에서 외부 서비스 또는 애플리케이션을 통합하여 XD의 기능을 확장합니다. 자세한 내용은 Adobe XD 용 플러그인을 참조하십시오.

다양한 플랫폼에 적합한 그래픽 요소를 UI 키트에서 사용할 수 있습니다. 자세한 내용은 UI 디자인 키트에 액세스하기를 참조하십시오.

JIRA와 같은 앱 통합은 디자이너와 관련자를 위한 완벽한 솔루션을 제공합니다.

클라우드 문서

XD에서 저장한 클라우드 문서의 목록을 조회합니다.

나와 공유됨

다른 관련자들이 검토 목적으로 나와 공유한 다양한 클라우드 문서가 나열됩니다.

링크 관리

링크 관리를 클릭하면 assets.web.com으로 연결됩니다. 파일 메뉴클라우드 문서 섹션 내에서 클라우드 문서를 조회하고 액세스할 수 있습니다. 격자 또는 목록 보기 모드에서 문서를 조회하고 이름이나 수정일별로 문서를 정렬하거나 문서를 선택하여 삭제할 수 있습니다.

삭제됨

삭제할 클라우드 문서를 나열합니다. 삭제하도록 태그가 지정된 파일을 복원하거나 영구적으로 삭제할 수 있습니다. 

내 컴퓨터

컴퓨터 파일 선택기를 사용하여 로컬 XD 파일에 액세스할 수 있습니다.

새로운 기능

XD에서 제공하는 모든 최신 기능에 대한 요약을 살펴보십시오.

학습 및 지원

XD, 튜토리얼 및 사용 안내서 시작과 관련된 문서에 액세스하십시오.

피드백 제공

UserVoice 포털에서 발견한 모든 종류의 버그에 대한 피드백이나 새로운 기능에 대한 요청을 제안할 수 있습니다.

아트보드 사전 설정

홈 화면에서 사전 설정된 아트보드 규격 중 하나를 직접 클릭하여 디자인을 시작할 수 있습니다. 또는 맞춤형 아트보드 규격을 만들 수도 있습니다. 아트보드에 대한 자세한 내용은 아트보드를 사용하여 작업을 참조하십시오.

최근 항목

아트보드 사전 설정의 최근 항목 섹션에서 가장 최근에 사용한 XD 파일에 액세스할 수 있습니다.

튜토리얼 시작

아트보드 사전 설정 옆에 있는 튜토리얼 시작 섹션에서 빌트인 튜토리얼에 액세스하여 Adobe XD로 무엇을 제작할 수 있는지 배울 수 있습니다.

작업 영역 개요

Mac

Mac에서의 Adobe XD 작업 영역
Mac에서의 Adobe XD 작업 영역

A. 메인 메뉴 B. 디자인 모드 C. 프로토타입 모드 D. 모바일 디바이스에서 보기 E. 미리보기 F. 온라인 공유 G. 속성 관리자 H. 페이스트보드 I. 아트보드 J. 플러그인 K. 레이어 L. 에셋 M. 툴바 

메인 메뉴

파일, 편집, 오브젝트, 보기, 윈도우 및 도움말 메뉴와 각각에 대한 하위 메뉴가 포함됩니다.

디자인 모드

디자인 모드에서 내 프로젝트를 보완할 수 있는 아트보드를 제작하고 디자인할 수 있습니다. 다른 툴에서 제작되었거나 웹 상에 있는 에셋을 가져올 수도 있고, XD에서 그래픽을 제작할 수도 있습니다.

프로토타입 모드

프로토타입 모드에서 아트보드를 서로 연결하고, 디자인에 대한 비디오 데모를 제작(현재 Mac에서만 지원)하고, 브라우저나 디바이스에서의 디자인을 시험 제작하고, 다른 사람들과 프로토타입을 공유하고 피드백을 받아 볼 수 있습니다.

애플리케이션 툴바

디자인 모드, 프로토타입 모드, 캔버스의 확대/축소 레벨, 미리보기 및 공유 옵션을 이용할 수 있습니다.

툴바

선택 툴, 드로잉 툴, 텍스트 툴, 아트보드 툴, 에셋 및 레이어 패널에 대한 액세스를 제공합니다.

속성 관리자

속성 관리자를 사용하여 오브젝트의 여러 속성을 정의하고 다양한 옵션을 사용하여 오브젝트를 조작할 수 있습니다. 예를 들어 오브젝트의 배경, 채우기, 테두리, 그림자, 정렬 및 치수를 지정할 수 있습니다. 오브젝트를 서로 결합하여 완전히 새로운 오브젝트를 만들 수도 있습니다. 반복되는 요소를 배치하려면 속성 관리자의 반복 그리드 옵션을 사용하십시오. 고정 위치 옵션을 사용하여 스크롤 시 여러 요소의 위치를 ​​고정할 수 있습니다. 또한 수학 연산을 사용하여 훨씬 더 정밀하게 디자인을 제작하거나 오브젝트를 새로운 위치로 옮기거나 폭과 높이를 수정할 수 있습니다.

 

작업 영역

내가 제작한 에셋을 포함하고 있는 캔버스 또는 아트보드가 들어 있습니다. 페이스트보드(아트보드 주변의 회색 공간)는 진행 중인 작업을 배치하거나 기존 아트보드에 포함시키지 않으려는 작업을 배치할 수 있도록 해 줍니다.

Windows

Windows 10에서의 XD 인터페이스는 다음과 같은 일부 차이점을 제외하고 Mac 인터페이스와 유사합니다.

  • Windows에서는 최상위 메뉴 및 오브젝트 메뉴가 없습니다. 대신 오브젝트를 간단히 마우스 오른쪽 버튼으로 클릭하면 표시되는 컨텍스트 메뉴를 사용합니다.
  • Windows의 XD에는 파일을 제작하거나 열고 에셋을 저장 및 내보낼 수 있는 햄버거 메뉴가 왼쪽 상단에 위치합니다.
Windows에서의 Adobe XD 작업 영역
Windows에서의 Adobe XD 작업 영역

A. 디자인 모드 B. 프로토타입 모드 C. 확대/축소 레벨 D. 온라인 공유 E. 속성 관리자 F. 페이스트보드 G. 아트보드 H. 툴바 I. 팝업 메뉴 

XD 애플리케이션이나 Creative Cloud, 또는 기타 모든 Creative Cloud 앱에서 로그아웃할 때 열려 있는 문서가 있으면 Adobe XD는 해당 문서를 Windows 및 macOS에서 다음과 같이 처리합니다. 

Windows

  • 클라우드 문서가 자동으로 저장되고 창이 닫힙니다.
  • 로컬 문서의 경우 저장 또는 저장 안 함 대화 상자가 표시됩니다. 내 컴퓨터의 원하는 위치에 파일을 저장합니다. 
저장 확인 대화 상자
저장 확인 대화 상자

macOS

  • 클라우드 문서가 자동으로 저장되고 창이 닫힙니다. 
  • 변경 내용을 검토하기 위한 팝업 메시지가 표시됩니다. 
  • 변경 내용 검토를 클릭합니다. 
변경 내용 검토를 위한 팝업 대화 상자
변경 내용 검토를 위한 팝업 대화 상자
  • 표시되는 대화 상자에서 저장을 클릭합니다. 
저장 확인 대화 상자
저장 확인 대화 상자

참고:

Creative Cloud에 로그인하지 않으면 Adobe XD를 계속 사용할 수 없습니다. 

이 작업에는 Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License의 라이센스가 부여되었습니다.  Twitter™ 및 Facebook 게시물은 Creative Commons 약관을 적용받지 않습니다.

법적 고지 사항   |   온라인 개인 정보 보호 정책