Adobe XD의 2019년 8월, 2019년 10월 및 2019년 11월 릴리스
Adobe XD는 웹 및 모바일 앱에 대한 사용자 경험을 디자인하고 프로토타이핑하기 위한 벡터 기반의 툴입니다. 와이어프레임, 시각 디자인, 인터랙션 디자인, 프로토타이핑, 미리보기 및 공유 기능이 모두 하나의 강력한 툴로 통합되어 이들 작업 간을 간편하게 전환할 수 있습니다.
XD는 UX/UI 디자이너, 인터랙션 디자이너, 경험 디자이너, 제품 디자이너, 웹 디자이너, 앱 디자이너, 시각 디자이너, 기업가 등 모든 유형의 크리에이터를 위해 제작되었습니다.
XD의 2019년 11월 릴리스에는 다음과 같은 향상된 기능이 추가되었습니다.
공동 편집(Beta) 기능을 통해 다른 디자이너들과 실시간으로 공동 작업을 수행하여 작업 과정의 속도를 높이고 중복되거나 충돌하는 작업을 제거할 수 있습니다. 동일한 문서를 편집하는 다른 사용자의 아바타를 볼 수 있으며 편집 내용은 모두 실시간으로 브로드 캐스트됩니다.
공동 편집 기능을 통해 디자인 팀은 더욱 빠르게 작업을 수행하고 전체 디자인 프로젝트에 대한 단일 소스를 유지할 수 있습니다.
Beta 기능은 기능을 준비하는 동안 XD 사용자가 사용해 보고 피드백을 제공하기 위해 사용할 수 있는 새로운 기능입니다. Beta 기능에는 일부 품질 및 성능 문제가 있을 수 있습니다.
자세한 내용은 디자인 공동 편집 및 편집을 참조하십시오.
이제 구성 요소 상태를 사용하여 다양한 사용자 인터랙션에 대한 변화를 디자인할 수 있습니다. 예를 들어 버튼 구성 요소를 디자인한 다음 버튼을 마우스로 가리키기와 누르기 같은 다른 상태를 만들 수 있습니다.
복잡한 인터랙션을 보여 주기 위해 더 이상 여러 아트보드를 만들고 연결하지 않아도 됩니다.
상태를 포함한 구성 요소가 있으면 이제 프로토타입 모드에서 호버 트리거를 사용하여 특정 디자인 요소 위에 커서를 놓을 때 호버 효과를 지정할 수 있습니다.
완전히 새로운 수준의 인터랙티비티를 프로토타입에 적용해 보십시오.
이제 문서 내역을 사용하여 클라우드 문서를 작업하면서 저장 내역을 탐색할 수 있습니다. 필요한 경우 이전 버전으로 되돌리고 XD 문서의 마지막 변경 내용을 복원할 수도 있습니다.
이전 버전으로 되돌리려면 문서 기록에서 문서의 버전을 열고 콘텐츠를 복사하여 현재 버전에 붙여넣으세요.
계속해서 디자이너들과 공동 작업을 수행하고, 시간의 흐름에 따라 바뀌는 문서의 내용을 확인하십시오.
자세한 내용은 디자인 개정 관리
를 참조하십시오.
이제 단일 디자인 요소 또는 오브젝트에 대해 여러 인터랙션을 지정할 수 있습니다.
계속해서 단일 요소에서 여러 와이어를 드래그하고 중복된 오브젝트나 아트보드 없이 탭 또는 드래그와 같은 다양한 트리거에 대한 인터랙션을 추가하십시오.
더 이상 흩어진 인터랙션이 없습니다!
자세한 내용은 인터랙티브 프로토타입 제작 | 개요를 참조하십시오.
제목: 다중 인터랙션
시청 시간: 4분
새롭게 디자인된 플러그인 관리자를 통해 사용자는 XD용 플러그인을 검색하고, 발견하고, 설치할 수 있습니다. 다양한 플러그인의 범주와 컬렉션을 찾아보고, 특정 플러그인이나 용어를 검색하고, 각 플러그인에 대해 설명, 지원 언어 등을 포함하는 자세한 프로필 목록을 조회할 수 있습니다.
자세한 내용은 XD의 플러그인을 참조하십시오.
제목: 디자인이 변경된 플러그인 관리자
시청 시간: 2분
새로운 공유 모드를 통해 다양한 공유 기능을 한 곳으로 통합할 수 있으며, 동료 디자이너들과 간편하게 디자인을 공유하고 공동 작업을 수행할 수 있습니다. 설계 검토 및 개발과 같은 내장 시나리오 기반 사전 설정과 결합하여 공유 링크 관리 및 업데이트 방법에 대한 모든 권한을 갖습니다.
새롭게 디자인된 공유 모드의 이점에 대한 자세한 내용을 살펴보십시오.
자세한 내용은 디자인 및 프로토타입 공유를 참조하십시오.
제목: 공유 모드
시청 시간: 3분
이제 Creative Cloud Libraries에 액세스하여 탐색하고 구성 요소, 그래픽, 색상, 그레이디언트 및 문자 스타일과 같은 에셋을 XD에서 Creative Cloud Libraries로 추가하고 XD 내에서 직접 소비하며 XD 프로젝트에서 직접 사용할 수 있습니다.
XD 애셋을 CC Libraries에 추가하고 다른 Creative Cloud 앱에서 사용할 수도 있습니다.
브랜드 색상, 그래픽, 로고 등과 같은 공유 에셋으로 조직 전체의 크리에이티브 팀을 연결하십시오!
자세한 내용은 XD용 Creative Cloud Libraries를 참조하십시오.
디자인 시스템에서 작업할 때 이제 Sketch 에셋을 재생성하지 않고 재사용할 수 있습니다.
Sketch 기호 및 요소는 XD 구성 요소로 변환될뿐만 아니라 링크된 에셋으로도 사용할 수 있습니다.
자세한 내용은 Sketch 라이브러리 변환을 참조하십시오.
XD의 2019년 10월 릴리스에는 다음과 같은 향상된 기능이 추가되었습니다.
XD 23.0부터 비파괴 혼합 효과를 적용하여 이미지 또는 그래픽 에셋의 스타일을 지정할 수 있습니다.
혼합 효과를 사용하여 오브젝트의 색상이 기본 오브젝트의 색상과 혼합되는 방식을 다양하게 변경하여 디자인을 변형하고 디자인이 살아 움직이는 것을 지켜보십시오!
혼합 효과를 적용하는 방법에 대한 자세한 내용은 혼합 효과 적용을 참조하십시오.
XD 23.0부터 다음과 같은 키보드 단축키를 화살표 키와 결합하여 UI 요소의 위치와 크기를 격자 크기 단위로 정확하게 제어할 수 있습니다.
정사각형 격자가 활성화된 경우:
디자인 모드
XD 23.0에서는 키보드 단축키 Cmd+클릭 또는 Ctrl+클릭의 비헤이비어가 확장되어 디자인 사양에서뿐만 아니라 디자인 캔버스에서도 오브젝트의 Z-오더를 제어할 수 있습니다. 원하는 레이어에 도달하면 키보드를 사용하여 레이어를 이동하거나 마우스 오른쪽 버튼을 클릭하여 컨텍스트 메뉴를 표시할 수 있습니다.
여러 레이어가 서로 겹쳐 있는 경우 Cmd+클릭 또는 Ctrl+클릭하면 선택한 레이어 아래의 다음 오브젝트가 선택됩니다. 맨 아래 레이어에 도달하면 동일한 키보드 단축키를 사용하여 맨 위 레이어로 돌아갈 수 있습니다.
디자인 사양
디자인 사양에서 겹치는 레이어 아래에 숨겨진 레이어를 보고 검사하려면 아트보드의 특정 영역에 마우스를 가져다 대고 오른쪽 버튼으로 클릭합니다. 그러면 픽셀 포인트에서 레이어 목록과 해당 컨텍스트 세부 정보가 표시됩니다. Cmd+클릭을 사용하여 레이어 속성을 순차적으로 자세히 들여다 볼 수도 있습니다.
오버래핑 레이어에 액세스하는 방법에 대한 자세한 내용은 오브젝트 크기 조정 및 회전을 참조하십시오.
XD의 2019년 8월 릴리스에는 다음과 같은 향상된 기능이 추가되었습니다.
XD는 Photoshop에서 바로 XD 이미지를 열고, 편집하고, 실시간으로 업데이트할 수 있는 기능을 제공함으로써 Adobe Photoshop과 긴밀하게 통합됩니다. Photoshop에서 이미지를 편집하고 저장하면 XD는 병합된 파일을 저장하고 편집된 파일 대신 XD에 비트맵을 배치합니다.
자세한 내용은 외부 에셋을 사용하여 작업을 참조하십시오
시청 시간: 3분 20초
최신 버전의 XD를 사용하면 디자인 캔버스와 함께 XD 사용자 환경에서 바로 XD 플러그인을 실행하고 인터랙션할 수 있습니다. 레이어 및 에셋 패널과 마찬가지로 새로운 플러그인 패널을 통해 XD 내에서 플러그인을 간편하게 조회하고 수정할 수 있습니다. 이는 XD 디자인 작업 시 창의적인 흐름 유지하는 데 도움이 됩니다.
자세한 내용은 플러그인 보기 및 설치를 참조하십시오.
시청 시간: 4분 30초
디자인을 기능적인 웹 사이트로 변환하는 데 도움이 되도록 디자인 사양에서 CSS 코드 스니펫을 복사하여 코드에 붙여넣을 수 있습니다.
CSS 코드는 디자인 사양을 게시할 때 출력 대상으로 개발 목적으로 공유 창에서 웹을 선택하면 자동으로 생성됩니다. 디자인 사양을 게시하면 XD는 선택한 레이어에 대한 CSS 코드 스니펫을 자동으로 표시합니다.
자세한 내용은 XD의 디자인 사양 검사를 참조하십시오.
시청 시간: 2분 58초
구성 요소는 다양한 오버라이드를 지원하고 다양한 화면 크기에 맞도록 완벽하게 크기를 조정할 수 있지만 효과를 적용하거나 오브젝트를 재구성할 때는 사용하기 어려울 수 있습니다. 이전 버전의 XD에서는 원본 마스터 구성 요소의 범위를 벗어나는 오브젝트를 추가하면 내용이 잘렸습니다.
구성 요소 경계와 관련된 문제를 해결하려면 마스터 구성 요소를 선택하고 마우스 오른쪽 버튼을 클릭한 다음 콘텐츠에 경계 맞추기 를 선택하십시오. 구성 요소 경계가 마스터 구성 요소와 인스턴스에서 잘린 모든 오브젝트를 표시하도록 조정됩니다.
새 구성 요소를 만드는 경우:
시청 시간: 4분
HiDPI 화면을 디자인할 때 프랙셔널 픽셀로 인해 내용이 왜곡될 수 있습니다. XD 22.0부터 디자인 방해 요인과 이미지 왜곡 문제를 없애기 위해 XD는 오브젝트, 구성 요소 및 이미지 마스크의 그룹 크기를 변경할 때 픽셀 값을 반올림합니다. 단, XD는 XD 22.0 이전에 제작된 콘텐츠의 프랙셔널 값은 그대로 유지합니다.
시청 시간: 3분 20초
아트보드 레이아웃 정보를 포함하여 디자인 플로우를 전반적으로 검토하려면 화면의 왼쪽 상단에서 프로토타입 또는 디자인 사양의 이름을 클릭합니다. 기본 격자 보기 모드에서 격자 및 플로우 보기 사이를 토글하여 다음과 같은 항목을 표시하도록 할 수도 있습니다.
자세한 내용은 XD에서 디자인 사양 탐색을 참조하십시오.
