기능 요약 | Adobe XD | 2018 릴리스

Adobe XD 2018년 8월, 2018년 9월, 2018년 10월, 2018년 12월, 2019년 1월, 2019년 2월, 2019년 3월, 2019년 4월, 2019년 5월, 2019년 6월 및 2019년 7월 릴리스

xd-mnemonic

Adobe XD는 웹 및 모바일 앱에 대한 사용자 경험을 디자인하고 프로토타이핑하기 위한 벡터 기반의 툴입니다. 와이어프레임, 시각 디자인, 인터랙션 디자인, 프로토타이핑, 미리보기 및 공유 기능이 모두 하나의 강력한 툴로 통합되어 이들 작업 간을 간편하게 전환할 수 있습니다.

XD는 UX/UI 디자이너, 인터랙션 디자이너, 경험 디자이너, 제품 디자이너, 웹 디자이너, 앱 디자이너, 시각 디자이너, 기업가 등 모든 유형의 크리에이터를 위해 제작되었습니다.

Adobe XD 21의 새로운 기능

XD 21.0부터 디자인 사양과 함께 인터랙티브 프로토타입 정보가 포함되어 개발 링크에 대한 공유 기능이 더욱 개선되었습니다. 공유 링크의 사양 보기 토글 아이콘()을 클릭하여 디자인 사양과 프로토타입 보기 사이를 전환할 수 있습니다. 

이전 버전의 XD에서는 디자이너가 프로토타입 및 디자인 사양에 대해 서로 다른 두 링크를 공유해야 했으며, 이로 인해 개발자는 디자이너의 의도를 해석하기 위해 두 링크 사이를 번갈아 이동하며 비효율적인 공동 작업을 수행해야 했습니다.

이제 디자이너는 단일 공유 링크를 통해 자신의 디자인에 대한 의도를 보다 효율적으로 전달할 수 있으며 개발자가 필요로 하는 모든 리소스를 제공할 수 있습니다. 개발자는 인터랙션과 지향하는 비헤이비어를 보다 깊이 이해할 수 있으며, 별도의 프로토타입 및 여러 디자인 사양 링크를 전환하지 않아도 되므로 작업 시간을 단축할 수 있습니다. 

단일 링크에서 디자인 사양과 프로토타입 간 전환
단일 링크에서 디자인 사양과 프로토타입 간 전환

A. 사양 보기 토글 아이콘 

공유 링크에서의 격자 보기 모드

XD 21.0부터 Adobe XD에서 디자인 사양 보기 UX 플로우가 완전히 새롭고 효율적이며 탐색 가능한 격자 보기로 대체되었습니다. 프로토타입 및 디자인 사양에서의 격자 보기는 관련자 또는 개발자가 가장 관련성이 높은 아트보드로 빠르게 이동할 수 있도록 해 줍니다.

이전 버전의 XD에서는 프로토타입을 조회하는 모든 사용자가 자신에게 필요한 아트보드를 찾기 위해 각각의 아트보드를 모두 클릭해 보아야 했습니다. 

공유 링크에서의 격자 보기 모드
디자인 사양 링크에 대한 UX 플로우와 격자 보기 비교

격자 보기 모드에서 리뷰어는 다음과 같은 작업을 수행할 수 있습니다.

  • 모든 화면에 대한 썸네일 이미지 보기
  • 해당 아트보드에 달린 댓글 수 확인
  • 이름으로 아트보드 검색
  • 연결된 화면 아이콘을 클릭하여 해당 아트보드에 연결된 모든 화면 조회

이러한 변경 사항은 다음과 같은 방식으로 개발자뿐만 아니라 관련자에게도 도움이 됩니다.

  • 개발자: UX 플로우를 간소화되고 통합된 모든 아트보드 보기로 대체합니다.
  • 관련자: 여러 화면에서 XD 프로토타입을 탐색하고 관련성이 가장 높은 프로토타입으로 바로 이동합니다.
격자 보기
격자 보기

A. 아트보드에 달린 댓글 수 B. 연결된 화면 아이콘을 클릭하여 연결된 화면 보기 C. 아트보드 첫 번째 카드의 연결된 화면 

문서 참여

클라우드 문서에서의 편집 내용 충돌과 작업이 중복되는 문제를 방지하기 위해 다른 디자이너가 동일한 클라우드 문서에서 공동 작업을 수행할 때 이를 시작적으로 표시해 주는 인디케이터가 XD에 도입되었습니다. 다른 디자이너가 동일한 클라우드 문서에서 공동 작업을 수행하고 있다면 이 디자이너의 프로필 아바타가 표시됩니다.

클라우드 문서 참여
문서 참여

문서 참여에 대한 자세한 내용은 XD의 클라우드 문서를 참조하십시오.

모바일 웹 프로토타입에 댓글 달기

리뷰어는 종종 이동 중에 모바일 디바이스에서 프로토타입에 액세스하여 댓글을 달거나 다른 사람들이 입력한 내용을 조회하곤 합니다. 

XD의 이번 최신 릴리스를 통해 이제 데스크탑 웹 브라우저뿐만 아니라 모바일 디바이스에서도 웹 프로토타입을 조회하고 댓글을 달 수 있습니다. 이는 검토 주기를 가속화하고 관련자들이 더욱 쉽고 빠르게 피드백을 제공하는 데 유용합니다. 

자세한 내용은 Adobe XD에서 프로토타입을 사용하여 작업을 참조하십시오. 

모바일 웹 프로토타입에 댓글 달기

하위 범위 텍스트 보기 및 검사

XD 21.0부터 다양한 스타일의 텍스트가 있는 경우 텍스트 요소 내에서 하위 범위에 대한 마우스 오버 기능을 사용할 수 있습니다. 이렇게 하면 디자인 사양이 동일한 스타일의 텍스트 요소 내에서 유사한 하위 범위를 강조 표시하며, 사용자는 각각의 속성에 빠르게 액세스할 수 있습니다. 이전에는 텍스트 요소 내에서 여러 텍스트 스타일을 사용하는 경우 해당 스타일을 분리할 수 없었으며, 동일한 스타일을 사용하는 하위 범위를 파악하기가 어려웠습니다.

자세한 내용은 XD의 디자인 사양 검사를 참조하십시오. 

대량 텍스트 내의 하위 범위 속성
대량 텍스트 내의 하위 범위 속성

Adobe XD 20의 새로운 기능

XD의 2019년 6월 릴리스에는 다음과 같은 향상된 기능이 추가되었습니다.

프로토타입 모드의 속성 관리자

Adobe XD 20.0에서는 프로토타입 헤드업 디스플레이가 캔버스에서 프로토타입 모드의 속성 관리자로 옮겨졌습니다. 이 새로운 UI 개선을 통해 여러 아트보드를 선택하고 복잡한 프로토타입 속성을 한 번에 정의할 수 있습니다.

프로토타입 속성을 정의하고 관리하며 트리거 패널을 대체하는 새로운 프로토타입 관리자
프로토타입 속성을 정의하고 관리하는 새로운 프로토타입 속성 관리자 (트리거 헤드업 디스플레이 대체)

시청 시간: 1분

플러그인 패널

편리한 플러그인 기능을 제공하는 새로운 플러그인 패널을 통해 XD 애플리케이션 내에서 플러그인 기능에 빠르게 액세스할 수 있습니다. 에셋 레이어 패널과 더불어 플러그인 패널을 통해 설치된 플러그인에 빠르게 액세스할 수 있으며, 플러그인 관리자를 실행하여 새로운 플러그인을 탐색하고 설치할 수 있습니다.

플러그인 실행 패널
플러그인 실행 패널

위 첨자 및 아래 첨자

Adobe XD의 최신 릴리스는 텍스트 변환 기능을 확장하여 속성 관리자에서 위 첨자 및 아래 첨자 옵션을 포함합니다. 이들 옵션을 사용하여 디자인에서 등록상표, 상표 및 저작권을 창의적으로 변형하고 웹과 모바일에서도 살펴볼 수 있습니다.

자세한 내용은 드로잉 및 텍스트 툴을 참조하십시오.

위 첨자 및 아래 첨자 텍스트 변환
위 첨자 및 아래 첨자 텍스트 변환

시청 시간: 1분

JIRA 2.0 지원

JIRA 2.0 통합은 사용 가능한 아트보드의 수 또는 아바타의 수와 같은 XD 문서에 대한 추가 정보를 제공하여 공동 작업 환경을 개선해 줍니다.

자세한 내용은 XD에 대한 Jira 통합을 참조하십시오. 

XD의 디자인 시스템

XD의 디자인 시스템
XD의 디자인 시스템

디지털 제품을 대규모로 디자인할 때 일관성을 유지하는 것이 점점 더 어려워지고 있으며 중요한 과제로 떠오르고 있습니다. 콘텐츠 속도의 증가로 인해 조직은 점차 복잡해지는 플랫폼 및 디바이스의 생태계 전반에 걸쳐 일관성을 유지하고 효율성을 높이는 동시에 고객 경험을 디자인하고 구축할 때 더욱 빠르게 이동할 수 있는 방법을 모색하고 있습니다.

디자인 시스템은 다양한 조합으로 재사용할 수 있는 일관되고 견고한 디자인 패턴을 제공함으로써 공통의 시각적 언어를 중심으로 다양한 분야의 제품 팀(디자이너, 개발자 및 관련자)을 하나로 통합합니다. 이는 디자인 업무 부담을 줄이고 디자인 프로세스를 가속화하며 제품을 실제로 구현하기 위해 협력하는 팀 사이에 다리를 놓아 줍니다. XD의 디자인 시스템에 대한 자세한 내용은 디자인 시스템을 참조하십시오.

이 비디오를 통해 XD의 디자인 시스템에 대해 자세히 살펴보십시오.

시청 시간: 1분

연결된 에셋

지속적으로 증가하는 디자인 업무로 인해 디자이너는 규모별로 일관적인 디자인을 제작하고 유지 관리하기 위한 간편한 방식을 필요로 합니다. 

XD 19.0을 통해 구성 요소(이전에는 심볼이라고 함)뿐만 아니라 색상 및 문자 스타일도 쉽게 공유하고 소비할 수 있습니다. 팀과 스티커 시트를 공유하거나 프로젝트 사이에서 디자인 요소를 재사용하는 경우 이는 매우 편리합니다.

연결된 에셋은 연결된 구성 요소의 작업 과정을 보완합니다. 소스 문서에서 연결된 에셋을 수정하면 이들 연결된 에셋이 포함된 모든 소비 문서에 업데이트 알림이 수신됩니다. 여기에서 업데이트 내용을 미리 보고 수락할 수 있습니다. 자세한 내용은 연결된 에셋을 사용하여 작업을 참조하십시오.

이 비디오를 통해 연결된 에셋에 대해 자세히 살펴보십시오.

시청 시간: 1분

오버라이드 포함 구성 요소

 Adobe XD의 최신 릴리스는 애플리케이션에 구성 요소를 도입함으로써 복잡한 사용자 경험을 빌드하는 경우에 대해 크게 개선되었습니다. 구성 요소는 이전의 심볼을 대체하며 무한 반복적인 디자인 요소를 제작하는 작업을 더욱 간소화하고 강력하게 해 줍니다. 이제 빠르고 간편하게 여러 개의 다양한 구성 요소(이전에는 심볼이라고 함)를 만들고, 해당 속성을 변경하고, 모든 공통 속성을 동시에 오버라이드할 수 있습니다. 구성 요소에서의 오버라이드 작업에 대한 자세한 내용은 구성 요소 오버라이드를 참조하십시오.

이 비디오를 통해 XD의 구성 요소에 대해 살펴보십시오.

시청 시간: 1분

키보드 및 게임패드 트리거

이제 Adobe XD를 통해 키보드 단축키와 게임패드 트리거를 사용하여 풍부한 게임 경험 또는 디자인을 위해 기본 데스크탑 애플리케이션과 프로토타입을 시뮬레이션할 수 있습니다. 프로토타입을 와이어 연결할 때 트리거 옵션에서 키/게임패드를 선택하고 모든 키를 할당할 수 있습니다. 이러한 탭, 드래그, 시간, 음성 트리거를 사용하여 데스크탑 앱, 게임, 프레젠테이션 등 다양한 용도의 프로토타입을 제작할 수도 있습니다. 키보드 및 게임패드 트리거 사용에 대한 자세한 내용은 키보드 및 게임패드 트리거를 사용하여 프로토타이핑을 참조하십시오.

키보드 및 게임패드 트리거에 대해 자세히 알아보려면 이 비디오를 시청하십시오.

시청 시간: 1분

아트보드 안내선

맞춤형 아트보드 안내선을 사용하여 눈금자 없이도 아트보드 전체에 걸쳐 요소와 오브젝트를 손쉽게 정렬할 수 있습니다. 안내선을 만들거나, 위치를 조정하거나, 여러 아트보드에 안내선을 복사하여 붙여넣거나, 제거할 수 있습니다. 안내선의 가시성을 잠그거나 숨길 수도 있습니다. 맞춤형 아트보드 안내선에 대한 자세한 내용은 아트보드 및 그리드를 사용하여 작업을 참조하십시오.

이 비디오를 통해 아트보드 안내선에 대해 자세히 살펴보십시오.

시청 시간: 1분

다각형 도구

Adobe XD의 최신 버전에서 제공하는 새로운 다각형 도구를 사용하여 최대 100면에 이르는 비전을 표현할 수 있습니다. 이러한 다각형의 모양을 편집하여 원하는 모양을 얻을 수도 있습니다. 이제 버튼, 포인터, 평가 및 기타 기본적인 아이콘과 그래픽 등 일반적인 UI 요소를 제작할 때 더욱 풍부한 표현력을 발휘할 수 있습니다. 맞춤형 아트보드 안내선에 대한 자세한 내용은 XD의 그리기 및 텍스트 도구를 참조하십시오.

이 비디오를 통해 다각형 도구에 대해 살펴보십시오.

시청 시간: 1분

대문자, 소문자, 단어의 첫 글자 변환 및 취소선

Adobe XD의 최신 릴리스에는 텍스트 변환과 관련하여 더욱 창의적인 표현 기능이 포함되어 있습니다. XD 디자인 애플리케이션에서 뿐만 아니라 웹 및 모바일 미리보기에서도 대문자, 소문자, 취소선 사용 및 단어의 첫 글자 변환에 대한 텍스트 스타일을 변경할 수 있습니다. 이는 섹션 제목, 오류 메시지, 라벨 등 다양한 텍스트 영역에 대한 스타일을 정렬하는 데 유용하며, 이러한 텍스트 변환 작업을 위해 더 이상 시각적인 방식에 의존하지 않아도 됩니다. 텍스트 변환에 대한 자세한 내용은 텍스트 툴을 참조하십시오.

이 비디오를 통해 텍스트 변환에 대해 자세히 살펴보십시오.

시청 시간: 1분

구성 요소에 대한 반응형 크기 조정

Adobe XD의 최신 릴리스에서는 최상의 구성 요소(이전 명칭: 심볼)와 반응형 크기 조정을 결합하여 디자인 캔버스 상에서 오브젝트의 그룹을 사용하여 작업할 수 있습니다. 반응형 크기 조정 기능을 사용하면 오브젝트의 그룹에 대한 배치와 확장성을 그대로 유지하면서 크기를 조정할 수 있습니다. 디자인 캔버스에서 그룹의 크기를 조정하면 XD가 상대 간격을 그대로 유지해 줍니다. 구성 요소의 크기도 조정할 수 있으며, 반응성이 뛰어난 크기 조정 기능이 제공됩니다. 구성 요소에서의 반응형 크기 조정 작업에 대한 자세한 내용은 구성 요소 크기 조정을 참조하십시오.

이 비디오를 통해 구성 요소에 대한 반응형 크기 조정에 대해 살펴보십시오.

시청 시간: 1분

비공개 프로토타입 및 디자인 사양에 대한 액세스 권한 요청

Adobe XD를 사용하면 공유 가능한 프로토타입 및 디자인 사양 링크를 통해 디자인을 손쉽게 공유할 수 있습니다. 이제 비공개로 공유된 프로토타입 또는 디자인 사양에 대한 액세스 권한을 요청할 수 있으며, 디자인 소유자는 이러한 액세스를 승인하거나 거부할 수 있습니다. 자세한 내용은 비공개 링크에 대한 액세스 권한 요청을 참조하십시오.

이 비디오를 통해 비공개 프로토타입 및 디자인 사양에 대한 액세스 권한 요청에 대해 자세히 살펴보십시오. 

시청 시간: 1분

음성 프로토타입 알림

프로토타입이 음성 명령에 응답하지 않는 경우 Adobe XD에 전달되는 음성 정보를 시각적으로 미리 보여 주는 데스크탑 미리보기 앱에서 해당 인터랙션 문제를 해결할 수 있습니다. 자세한 내용은 음성 인터랙션 문제 해결을 참조하십시오. 

이 비디오를 통해 음성 프로토타입 알림에 대해 자세히 알아보십시오. 

시청 시간: 1분

누락된 글꼴 해결

Adobe Fonts에서 활성화 중
Adobe Fonts에서 활성화 중

최신 버전의 Adobe XD에서는 비-Adobe 글꼴 관리와 함께 Adobe 글꼴 라이브러리에서 누락된 글꼴을 애플리케이션 내에서 바로 불러오는 작업이 간소화되었습니다. 

Adobe 글꼴을 사용하여 작업할 때 원활한 사용을 위해 XD는 사용자의 개입 없이 Adobe Fonts 라이브러리에서 사용할 수 있지만 컴퓨터에 없는 글꼴을 자동으로 활성화합니다.

온라인 상태에서 Creative Cloud 구독을 통해 이용할 수 있는 Adobe Fonts에서 사용 가능한 글꼴 중 누락된 글꼴이 있는 문서를 열면 XD는 해당 글꼴을 컴퓨터에서 자동으로 활성화합니다.

Adobe Fonts에서 활성화된 글꼴은 파란색 활성화 아이콘으로 강조 표시되며 사용 준비가 되면 사용자의 개입 없이 문서에서 사용할 수 있는 상태가 됩니다.

Adobe Fonts 자동 활성화
Adobe Fonts 자동 활성화

A. 누락된 글꼴 B. 글꼴 활성화 중 

이 비디오를 통해 누락된 글꼴 관련 작업에 살펴보십시오.

자세한 내용은 에셋 및 구성 요소 관리를 참조하십시오. 

프로토타입 웹 브라우저에서 드래그 제스처 지원

이제 웹 프로토타입을 보거나 공유할 때 사용하는 드래그 효과를 디자인하는 경우 프로토타입 비헤이비어에 대한 경험이 최적화되었습니다. 이전 릴리스에서는 드래그 제스처가 데스크탑에서 지원되고 웹에서의 기본값은 탭 동작이었지만 이번 업데이트를 통해 웹 브라우저에서도 드래그 동작을 사용할 수 있습니다.

브라우저에서의 드래그 제스처
브라우저에서의 드래그 제스처

벡터 콘텐츠를 Illustrator로 복사/붙여넣기

벡터 콘텐츠를 Illustrator로
벡터 콘텐츠를 Illustrator로

이제 XD 벡터 콘텐츠를 클립보드에 복사한 다음 이를 편집 가능한 레이어로 Adobe Illustrator에 붙여넣을 수 있습니다. 이전 버전에서는 XD에서 복사한 콘텐츠가 병합된 이미지로 Illustrator에 붙여넣어졌지만 이제 SVG 기반의 벡터 전송으로 업그레이드되었습니다.

이 기능은 Illustrator 버전 23.0.2 이상과 호환됩니다.

이 비디오를 통해 벡터 콘텐츠를 복사하여 Illustrator에 붙여넣는 방법을 살펴보십시오.

자세한 내용은 외부 에셋을 사용하여 작업을 참조하십시오.

웹 프로토타입에서 내비게이션 컨트롤 숨기기

이제 웹 프로토타입에서의 쪽 매김 및 내비게이션 컨트롤의 가시성을 제어하여 사용자 테스트에 대해 보다 용이하게 제어되는 환경을 만들 수 있습니다.

내비게이션 컨트롤 표시 및 숨기기
내비게이션 컨트롤 표시 및 숨기기

공유 옵션에서 내비게이션 컨트롤 표시를 다음과 같이 활성화하거나 비활성화할 수 있습니다.

  • 활성(기본 설정): 프로토타입 웹 앱에 동일한 , 뒤로 및 다음 버튼이 표시됩니다.
  • 비활성: 프로토타입 웹 앱 내비게이션 컨트롤 및 아트보드 번호가 표시되지 않습니다. 정의된 핫스팟을 사용하여 프로토타입과 인터랙션하고 버튼을 클릭하여 홈 화면으로 이동합니다. 모바일 환경의 경우 프로토타입 링크를 열면 온보딩 화면이 표시되고, 왼쪽/오른쪽 V자형 화살표가 숨겨지며, 스와이프 제스처가 비활성화됩니다.

프로토타입 플로우에 와이어가 있는 경우, 프로토타입을 게시할 때 내비게이션 컨트롤이 표시되도록 할 수도 있습니다. 

참고:

기존 링크에 대해서도 이번 새로운 기능의 장점이 적용되도록 하려면 내비게이션 컨트롤 표시 옵션을 끈 상태로 프로토타입을 다시 게시하십시오.

내비게이션 컨트롤 비활성화
내비게이션 컨트롤 비활성화

내보내기용으로 표시 기능 개선

내보내기용으로 표시
내보내기용으로 표시

디자인 캔버스에서 오브젝트를 선택하고 속성 관리자에서 새로 도입된 내보내기용으로 표시 확인란을 클릭하거나 마우스 오른쪽 버튼을 클릭하고 메뉴에서 선택하여 내보내기용으로 표시할 수 있습니다.

이번 릴리스부터 XD로 가져오는 모든 비트맵 이미지는 자동으로 내보내기용으로 표시됩니다. 이미지가 포함된 Illustrator 또는 Photoshop 문서를 가져오거나 열면 XD는 자동으로 모든 비트맵 이미지를 내보내기용으로 표시합니다. 

파일 > 내보내기 > 일괄 처리를 선택하여 내보내기용으로 표시된 모든 레이어를 내보내거나 공유 > 개발 목적으로 공유를 선택하고 디자인 사양에 에셋을 포함시킬 수 있습니다. 

참고:

일괄 내보내기용으로 표시 옵션은 이제 내보내기용으로 표시로 이름이 변경되었습니다.

이 비디오를 통해 에셋을 내보내기용으로 표시하는 방법을 살펴보십시오.

자세한 내용은 디자인 사양에서 에셋 내보내기, 다운로드 및 게시를 참조하십시오. 

선택 도구 개선

여러 그룹에 걸쳐 오브젝트 선택
여러 그룹에 걸쳐 오브젝트 선택

XD에서 선택 도구가 개선되어 그룹 전반에 걸쳐 더욱 효율적으로 콘텐츠를 선택할 수 있습니다. 캔버스의 여러 그룹 내에서 속해 있는 그룹과 상관없이 Cmd/Ctrl+Shift 키를 누른 상태로 클릭하여 오브젝트를 선택할 수 있습니다. 선택하고 나면 속성 관리자에서 일반적인 속성을 손쉽게 변경할 수 있으며, Alt 키를 누른 상태로 드래그하거나 Cmd/Ctrl+D 단축키를 사용하여 복제할 수 있습니다.

이 비디오를 통해 여러 그룹에 걸쳐 오브젝트를 선택하는 방법을 살펴보십시오.

자세한 내용은 오브젝트 그룹화, 잠금, 복제, 복사 및 뒤집기를 참조하십시오.

JIRA 서버 통합

Adobe XD와 Jira Software의 통합으로 Jira 문제에서 공유된 XD 프로토타입 및 디자인 사양으로의 즉각적인 액세스가 가능하므로 디자이너와 개발자 간 공동 작업이 더욱 원활해졌습니다.

Jira Software Server 및 Jira Software Data Center에 대한 지원을 확장하면 특별한 데이터 거버넌스 요구 조건이 포함된 맞춤형 솔루션을 필요로 하는 기업 고객에게 이러한 이점을 제공할 수 있습니다. Jira 관리자가 이러한 통합을 활성화하는 방법에 대한 자세한 내용은 XD에 대한 Jira 통합을 참조하십시오.

오디오 내레이션을 포함한 음성 인터랙션 녹화

Adobe XD에 데스크탑 미리보기 인터랙션을 녹화할 때 사용하는 내레이션을 추가하는 기능이 도입되었습니다. 클릭하고 있는 동안에는 모든 음성 내레이션이 녹화에 포함됩니다. 이는 클라이언트 또는 관련자와의 물리적인 접촉이 없는 원격 클라이언트 애플리케이션 워크스루에 특히 유용합니다.

지금까지는 Windows 사용자만 게임센터의 OS 레벨 컨트롤을 통해 이 기능을 이용할 수 있었지만, 이 새로운 기능은 앞으로 Mac 사용자에게도 제공될 예정입니다. 

이 비디오를 통해 녹화 시 프로토타입에 내레이션을 추가하는 방법에 대해 살펴보십시오.

인터랙션 녹화
인터랙션 녹화

음성 인터랙션을 녹화하고 이를 내레이션에 추가하는 방법에 대한 자세한 내용은 프로토타입에 음성 내레이션 추가를 참조하십시오.

색상 변경에 사용되는 스포이드 키보드 단축키

Adobe XD에 오브젝트의 색상을 보다 쉽게 바꿀 수 있는 스포이드용 단축키가 도입되었습니다. 색상을 변경하려는 오브젝트 또는 오브젝트의 그룹을 선택하고 키보드의 i 키를 사용하여 스포이드 커서를 로드한 다음 디자인 캔버스에서 원하는 색상을 선택하여 오브젝트의 색상을 수정합니다. 색상 피커를 사용하면 절대 색상만 선택할 수 있으며, 이 툴로 선형 또는 방사형 그레이디언트를 선택할 수는 없습니다.

이 비디오를 통해 스포이드 도구를 사용하는 방법에 대해 살펴보십시오.

스포이드 도구 단축키
스포이드 도구 단축키

스포이드 도구 단축키 사용 방법에 대한 자세한 내용은 XD의 키보드 단축키를 참조하십시오.

프로토타입 및 디자인 사양에서의 유틸리티 내비게이션 구성 요소

웹에서 XD 게시 프로토타입 또는 디자인 사양에 액세스할 때 유틸리티 내비게이션 컨트롤에 액세스할 수 있는 통합 환경이 제공됩니다. 이는 다른 Adobe 웹 애플리케이션과 인터랙션할 때 통합된 경험을 보장해 줍니다.

자세한 내용은 XD에서 프로토타입을 사용하여 작업을 참조하십시오.

공개 및 비공개 공유 사이의 전환과 관련된 UI 개선

발견 가능성 및 공유 기능과 해당 워크플로를 개선하기 위해 XD가 프로토타입 공유에 대해 다음과 같은 옵션을 제공합니다.

  • 링크를 보유한 누구나 조회 가능
  • 초대된 사용자만 조회 가능

자세한 내용은 임베드 디자인 및 프로토타입 공유를 참조하십시오.

브라우저에서 자동 애니메이트 지원

Adobe XD에서 자동 애니메이트 기능을 사용하여 디바이스에서 완벽하게 기능하고 인터랙티브한 몰입형 애니메이션 전환으로 프로토타입을 제작하고 이를 미리보기 창에서 뿐만 아니라 웹 브라우저에서도 확인할 수 있습니다.

이제 프로토타입의 애니메이션과 디자인 사양의 애니메이션 속성 값을 지원되는 웹 브라우저에서 확인할 수 있으며, 이를 통해 내 디자인을 관련자나 다른 파트너에게 보여 주는 것이 더욱 쉬워졌습니다.

자세한 내용은 자동 애니메이트 기능을 사용하여 프로토타입 제작 및 XD 아트보드 전환의 자동 애니메이트에 대해 지원되는 속성 및 지원되지 않는 속성을 참조하십시오.

또한 이 비디오를 통해 자동 애니메이트 기능이 웹 브라우저에서 어떤 방식으로 적용되는지 확인할 수 있습니다.

브라우저에서 자동 애니메이트 지원
웹 브라우저에서의 자동 애니메이트 결과

음성 언어 및 액센트 지원

이제 음성 기능이 명령 및 음성 재생 모두에 대해 모든 Adobe XD 언어를 지원합니다. 영어, 프랑스어, 독일어, 한국어 또는 일본어 사용자를 위해 디자인하는 경우 음성 경험을 해당 모국어로 프로토타이핑할 수 있으며, 향후 보다 많은 언어가 지원될 예정입니다.

또한 XD의 최신 릴리스는 음성 명령에 대한 현지 악센트를 지원합니다. 예를 들어 미국, 영국, 캐나다, 호주 중 어디에 거주하더라도 효과적이고 현지화된 음성 경험을 프로토타이핑할 수 있습니다. 자세한 내용은 Adobe XD에서 음성 디자인 및 프로토타이핑을 참조하십시오.

또한 이 비디오를 통해 음성 언어 및 악센트 지원과 관련된 내용을 살펴볼 수 있습니다.

여러 아트보드의 모든 댓글 보기

Adobe XD의 모든 댓글 보기 기능을 사용하면 프로토타입 및 디자인 사양에서 관련자의 피드백을 더욱 쉽게 관리할 수 있습니다. 이제 단 하나의 목록에서 모든 댓글을 조회하고, 개별 댓글을 클릭하여 관련 아트보드로 바로 이동하고, 댓글에 답글을 달거나 해결하거나 삭제할 수 있습니다. 

자세한 내용은 모든 댓글 보기를 참조하십시오. 

또한 이 비디오를 통해 여러 아트보드에 걸친 모든 댓글과 관련된 내용을 살펴볼 수 있습니다.

모든 댓글 보기
모든 댓글 보기

Adobe XD 19의 새로운 기능

XD의 디자인 시스템

XD의 디자인 시스템
XD의 디자인 시스템

디지털 제품을 대규모로 디자인할 때 일관성을 유지하는 것이 점점 더 어려워지고 있으며 중요한 과제로 떠오르고 있습니다. 콘텐츠 속도의 증가로 인해 조직은 점차 복잡해지는 플랫폼 및 디바이스의 생태계 전반에 걸쳐 일관성을 유지하고 효율성을 높이는 동시에 고객 경험을 디자인하고 구축할 때 더욱 빠르게 이동할 수 있는 방법을 모색하고 있습니다.

디자인 시스템은 다양한 조합으로 재사용할 수 있는 일관되고 견고한 디자인 패턴을 제공함으로써 공통의 시각적 언어를 중심으로 다양한 분야의 제품 팀(디자이너, 개발자 및 관련자)을 하나로 통합합니다. 이는 디자인 업무 부담을 줄이고 디자인 프로세스를 가속화하며 제품을 실제로 구현하기 위해 협력하는 팀 사이에 다리를 놓아 줍니다. XD의 디자인 시스템에 대한 자세한 내용은 디자인 시스템을 참조하십시오.

이 비디오를 통해 XD의 디자인 시스템에 대해 자세히 살펴보십시오.

시청 시간: 1분

아트보드 안내선

맞춤형 아트보드 안내선을 사용하여 눈금자 없이도 아트보드 전체에 걸쳐 요소와 오브젝트를 손쉽게 정렬할 수 있습니다. 안내선을 만들거나, 위치를 조정하거나, 여러 아트보드에 안내선을 복사하여 붙여넣거나, 제거할 수 있습니다. 안내선의 가시성을 잠그거나 숨길 수도 있습니다. 맞춤형 아트보드 안내선에 대한 자세한 내용은 아트보드 및 그리드를 사용하여 작업을 참조하십시오.

이 비디오를 통해 아트보드 안내선에 대해 자세히 살펴보십시오.

시청 시간: 1분

키보드 및 게임패드 트리거

이제 Adobe XD를 통해 키보드 단축키와 게임패드 트리거를 사용하여 풍부한 게임 경험 또는 디자인을 위해 기본 데스크탑 애플리케이션과 프로토타입을 시뮬레이션할 수 있습니다. 프로토타입을 와이어 연결할 때 트리거 옵션에서 키/게임패드를 선택하고 모든 키를 할당할 수 있습니다. 이러한 탭, 드래그, 시간, 음성 트리거를 사용하여 데스크탑 앱, 게임, 프레젠테이션 등 다양한 용도의 프로토타입을 제작할 수도 있습니다. 키보드 및 게임패드 트리거 사용에 대한 자세한 내용은 키보드 및 게임패드 트리거를 사용하여 프로토타이핑을 참조하십시오.

키보드 및 게임패드 트리거에 대해 자세히 알아보려면 이 비디오를 시청하십시오.

시청 시간: 1분

오버라이드 포함 구성 요소

 Adobe XD의 최신 릴리스는 애플리케이션에 구성 요소를 도입함으로써 복잡한 사용자 경험을 빌드하는 경우에 대해 크게 개선되었습니다. 구성 요소는 이전의 심볼을 대체하며 무한 반복적인 디자인 요소를 제작하는 작업을 더욱 간소화하고 강력하게 해 줍니다. 이제 빠르고 간편하게 여러 개의 다양한 구성 요소(이전에는 심볼이라고 함)를 만들고, 해당 속성을 변경하고, 모든 공통 속성을 동시에 오버라이드할 수 있습니다. 구성 요소에서의 오버라이드 작업에 대한 자세한 내용은 구성 요소 오버라이드를 참조하십시오.

이 비디오를 통해 XD의 구성 요소에 대해 살펴보십시오.

시청 시간: 1분

연결된 에셋

지속적으로 증가하는 디자인 업무로 인해 디자이너는 규모별로 일관적인 디자인을 제작하고 유지 관리하기 위한 간편한 방식을 필요로 합니다. 

XD 19.0을 통해 구성 요소(이전에는 심볼이라고 함)뿐만 아니라 색상 및 문자 스타일도 쉽게 공유하고 소비할 수 있습니다. 팀과 스티커 시트를 공유하거나 프로젝트 사이에서 디자인 요소를 재사용하는 경우 이는 매우 편리합니다.

연결된 에셋은 연결된 구성 요소의 작업 과정을 보완합니다. 소스 문서에서 연결된 에셋을 수정하면 이들 연결된 에셋이 포함된 모든 소비 문서에 업데이트 알림이 수신됩니다. 여기에서 업데이트 내용을 미리 보고 수락할 수 있습니다. 자세한 내용은 연결된 에셋을 사용하여 작업을 참조하십시오.

이 비디오를 통해 연결된 에셋에 대해 자세히 살펴보십시오.

시청 시간: 1분

다각형 도구

Adobe XD의 최신 버전에서 제공하는 새로운 다각형 도구를 사용하여 최대 100면에 이르는 비전을 표현할 수 있습니다. 이러한 다각형의 모양을 편집하여 원하는 모양을 얻을 수도 있습니다. 이제 버튼, 포인터, 평가 및 기타 기본적인 아이콘과 그래픽 등 일반적인 UI 요소를 제작할 때 더욱 풍부한 표현력을 발휘할 수 있습니다. 맞춤형 아트보드 안내선에 대한 자세한 내용은 XD의 그리기 및 텍스트 도구를 참조하십시오.

대문자, 소문자, 단어의 첫 글자 변환 및 취소선

Adobe XD의 최신 릴리스에는 텍스트 변환과 관련하여 더욱 창의적인 표현 기능이 포함되어 있습니다. XD 디자인 애플리케이션에서 뿐만 아니라 웹 및 모바일 미리보기에서도 대문자, 소문자, 취소선 사용 및 단어의 첫 글자 변환에 대한 텍스트 스타일을 변경할 수 있습니다. 이는 섹션 제목, 오류 메시지, 라벨 등 다양한 텍스트 영역에 대한 스타일을 정렬하는 데 유용하며, 이러한 텍스트 변환 작업을 위해 더 이상 시각적인 방식에 의존하지 않아도 됩니다. 텍스트 변환에 대한 자세한 내용은 텍스트 툴을 참조하십시오.

구성 요소에 대한 반응형 크기 조정

Adobe XD의 최신 릴리스에서는 최상의 구성 요소(이전 명칭: 심볼)와 반응형 크기 조정을 결합하여 디자인 캔버스 상에서 오브젝트의 그룹을 사용하여 작업할 수 있습니다. 반응형 크기 조정 기능을 사용하면 오브젝트의 그룹에 대한 배치와 확장성을 그대로 유지하면서 크기를 조정할 수 있습니다. 디자인 캔버스에서 그룹의 크기를 조정하면 XD가 상대 간격을 그대로 유지해 줍니다. 구성 요소의 크기도 조정할 수 있으며, 반응성이 뛰어난 크기 조정 기능이 제공됩니다. 구성 요소에서의 반응형 크기 조정 작업에 대한 자세한 내용은 구성 요소 크기 조정을 참조하십시오.

비공개 프로토타입 및 디자인 사양에 대한 액세스 권한 요청

Adobe XD를 사용하면 공유 가능한 프로토타입 및 디자인 사양 링크를 통해 디자인을 손쉽게 공유할 수 있습니다. 이제 비공개로 공유된 프로토타입 또는 디자인 사양에 대한 액세스 권한을 요청할 수 있으며, 디자인 소유자는 이러한 액세스를 승인하거나 거부할 수 있습니다. 자세한 내용은 비공개 링크에 대한 액세스 권한 요청을 참조하십시오.

음성 프로토타입 알림

프로토타입이 음성 명령에 응답하지 않는 경우 Adobe XD에 전달되는 음성 정보를 시각적으로 미리 보여 주는 데스크탑 미리보기 앱에서 해당 인터랙션 문제를 해결할 수 있습니다. 자세한 내용은 음성 인터랙션 문제 해결을 참조하십시오. 

이 비디오를 통해 음성 프로토타입 알림에 대해 자세히 알아보십시오. 

시청 시간: 1분

누락된 글꼴 해결

Adobe Fonts에서 활성화 중
Adobe Fonts에서 활성화 중

최신 버전의 Adobe XD에서는 비-Adobe 글꼴 관리와 함께 Adobe 글꼴 라이브러리에서 누락된 글꼴을 애플리케이션 내에서 바로 불러오는 작업이 간소화되었습니다. 

Adobe 글꼴을 사용하여 작업할 때 원활한 사용을 위해 XD는 사용자의 개입 없이 Adobe Fonts 라이브러리에서 사용할 수 있지만 컴퓨터에 없는 글꼴을 자동으로 활성화합니다.

온라인 상태에서 Creative Cloud 구독을 통해 이용할 수 있는 Adobe Fonts에서 사용 가능한 글꼴 중 누락된 글꼴이 있는 문서를 열면 XD는 해당 글꼴을 컴퓨터에서 자동으로 활성화합니다.

Adobe Fonts에서 활성화된 글꼴은 파란색 활성화 아이콘으로 강조 표시되며 사용 준비가 되면 사용자의 개입 없이 문서에서 사용할 수 있는 상태가 됩니다.

Adobe Fonts 자동 활성화
Adobe Fonts 자동 활성화

A. 누락된 글꼴 B. 글꼴 활성화 중 

이 비디오를 통해 누락된 글꼴 관련 작업에 살펴보십시오.

자세한 내용은 에셋 및 구성 요소 관리를 참조하십시오. 

프로토타입 웹 브라우저에서 드래그 제스처 지원

이제 웹 프로토타입을 보거나 공유할 때 사용하는 드래그 효과를 디자인하는 경우 프로토타입 비헤이비어에 대한 경험이 최적화되었습니다. 이전 릴리스에서는 드래그 제스처가 데스크탑에서 지원되고 웹에서의 기본값은 탭 동작이었지만 이번 업데이트를 통해 웹 브라우저에서도 드래그 동작을 사용할 수 있습니다.

브라우저에서의 드래그 제스처
브라우저에서의 드래그 제스처

벡터 콘텐츠를 Illustrator로 복사/붙여넣기

벡터 콘텐츠를 Illustrator로
벡터 콘텐츠를 Illustrator로

이제 XD 벡터 콘텐츠를 클립보드에 복사한 다음 이를 편집 가능한 레이어로 Adobe Illustrator에 붙여넣을 수 있습니다. 이전 버전에서는 XD에서 복사한 콘텐츠가 병합된 이미지로 Illustrator에 붙여넣어졌지만 이제 SVG 기반의 벡터 전송으로 업그레이드되었습니다.

이 기능은 Illustrator 버전 23.0.2 이상과 호환됩니다.

이 비디오를 통해 벡터 콘텐츠를 복사하여 Illustrator에 붙여넣는 방법을 살펴보십시오.

자세한 내용은 외부 에셋을 사용하여 작업을 참조하십시오.

웹 프로토타입에서 내비게이션 컨트롤 숨기기

이제 웹 프로토타입에서의 쪽 매김 및 내비게이션 컨트롤의 가시성을 제어하여 사용자 테스트에 대해 보다 용이하게 제어되는 환경을 만들 수 있습니다.

내비게이션 컨트롤 표시 및 숨기기
내비게이션 컨트롤 표시 및 숨기기

공유 옵션에서 내비게이션 컨트롤 표시를 다음과 같이 활성화하거나 비활성화할 수 있습니다.

  • 활성(기본 설정): 프로토타입 웹 앱에 동일한 , 뒤로 및 다음 버튼이 표시됩니다.
  • 비활성: 프로토타입 웹 앱 내비게이션 컨트롤 및 아트보드 번호가 표시되지 않습니다. 정의된 핫스팟을 사용하여 프로토타입과 인터랙션하고 버튼을 클릭하여 홈 화면으로 이동합니다. 모바일 환경의 경우 프로토타입 링크를 열면 온보딩 화면이 표시되고, 왼쪽/오른쪽 V자형 화살표가 숨겨지며, 스와이프 제스처가 비활성화됩니다.

프로토타입 플로우에 와이어가 있는 경우, 프로토타입을 게시할 때 내비게이션 컨트롤이 표시되도록 할 수도 있습니다. 

참고:

기존 링크에 대해서도 이번 새로운 기능의 장점이 적용되도록 하려면 내비게이션 컨트롤 표시 옵션을 끈 상태로 프로토타입을 다시 게시하십시오.

내비게이션 컨트롤 비활성화
내비게이션 컨트롤 비활성화

내보내기용으로 표시 기능 개선

내보내기용으로 표시
내보내기용으로 표시

디자인 캔버스에서 오브젝트를 선택하고 속성 관리자에서 새로 도입된 내보내기용으로 표시 확인란을 클릭하거나 마우스 오른쪽 버튼을 클릭하고 메뉴에서 선택하여 내보내기용으로 표시할 수 있습니다.

이번 릴리스부터 XD로 가져오는 모든 비트맵 이미지는 자동으로 내보내기용으로 표시됩니다. 이미지가 포함된 Illustrator 또는 Photoshop 문서를 가져오거나 열면 XD는 자동으로 모든 비트맵 이미지를 내보내기용으로 표시합니다. 

파일 > 내보내기 > 일괄 처리를 선택하여 내보내기용으로 표시된 모든 레이어를 내보내거나 공유 > 개발 목적으로 공유를 선택하고 디자인 사양에 에셋을 포함시킬 수 있습니다. 

참고:

일괄 내보내기용으로 표시 옵션은 이제 내보내기용으로 표시로 이름이 변경되었습니다.

이 비디오를 통해 에셋을 내보내기용으로 표시하는 방법을 살펴보십시오.

자세한 내용은 디자인 사양에서 에셋 내보내기, 다운로드 및 게시를 참조하십시오. 

선택 도구 개선

여러 그룹에 걸쳐 오브젝트 선택
여러 그룹에 걸쳐 오브젝트 선택

XD에서 선택 도구가 개선되어 그룹 전반에 걸쳐 더욱 효율적으로 콘텐츠를 선택할 수 있습니다. 캔버스의 여러 그룹 내에서 속해 있는 그룹과 상관없이 Cmd/Ctrl+Shift 키를 누른 상태로 클릭하여 오브젝트를 선택할 수 있습니다. 선택하고 나면 속성 관리자에서 일반적인 속성을 손쉽게 변경할 수 있으며, Alt 키를 누른 상태로 드래그하거나 Cmd/Ctrl+D 단축키를 사용하여 복제할 수 있습니다.

이 비디오를 통해 여러 그룹에 걸쳐 오브젝트를 선택하는 방법을 살펴보십시오.

자세한 내용은 오브젝트 그룹화, 잠금, 복제, 복사 및 뒤집기를 참조하십시오.

Adobe XD 18의 새로운 기능

XD의 2019년 4월 릴리스에는 다음과 같은 흥미롭고 향상된 기능이 추가되었습니다.

언어 전환기

XD는 XD에서 사용되는 언어를 바꾸기 위한 강력한 인앱 언어 전환 환경을 제공합니다. 이 새로운 기능을 통해 OS 언어 선택에 구애받지 않고 XD에서 사용하고자 하는 언어를 관리할 수 있습니다. 새로운 언어 환경 설정은 향후 모든 XD 업데이트에 걸쳐 유지됩니다.

참고:

중국의 Creative Cloud 팀 사용자는 언어 전환 옵션을 사용할 수 없습니다.

언어 전환기
언어 전환기

댓글 패널의 UI 개선

다른 Creative Cloud 제품과의 일관성을 유지하기 위해 Adobe XD의 댓글 패널 인터페이스에서의 댓글 및 답글 가독성이 개선되었습니다. 이번 개선 활동을 통해 게스트 댓글에 대한 숨겨진 캡차(자동화), 댓글 창에서의 새로운 들여쓰기, 리뷰어 이름 옆의 타임스탬프 등으로 여러 댓글에 걸친 가독성이 향상되었습니다.

자세한 내용은 XD에서 프로토타입을 사용하여 작업을 참조하십시오.

댓글 기능 개선
댓글 기능 개선

Adobe XD 17의 새로운 기능

누락된 글꼴 해결

Adobe Fonts에서 활성화 중
Adobe Fonts에서 활성화 중

최신 버전의 Adobe XD에서는 비-Adobe 글꼴 관리와 함께 Adobe 글꼴 라이브러리에서 누락된 글꼴을 애플리케이션 내에서 바로 불러오는 작업이 간소화되었습니다. 

Adobe 글꼴을 사용하여 작업할 때 원활한 사용을 위해 XD는 사용자의 개입 없이 Adobe Fonts 라이브러리에서 사용할 수 있지만 컴퓨터에 없는 글꼴을 자동으로 활성화합니다.

온라인 상태에서 Creative Cloud 구독을 통해 이용할 수 있는 Adobe Fonts에서 사용 가능한 글꼴 중 누락된 글꼴이 있는 문서를 열면 XD는 해당 글꼴을 컴퓨터에서 자동으로 활성화합니다.

Adobe Fonts에서 활성화된 글꼴은 파란색 활성화 아이콘으로 강조 표시되며 사용 준비가 되면 사용자의 개입 없이 문서에서 사용할 수 있는 상태가 됩니다.

Adobe Fonts 자동 활성화
Adobe Fonts 자동 활성화

A. 누락된 글꼴 B. 글꼴 활성화 중 

이 비디오를 통해 누락된 글꼴 관련 작업에 살펴보십시오.

자세한 내용은 에셋 및 구성 요소 관리를 참조하십시오. 

프로토타입 웹 브라우저에서 드래그 제스처 지원

이제 웹 프로토타입을 보거나 공유할 때 사용하는 드래그 효과를 디자인하는 경우 프로토타입 동작에 대한 경험이 최적화되었습니다. 이전 릴리스에서는 드래그 제스처가 데스크탑에서 지원되고 웹에서의 기본값은 탭 동작이었지만 이번 업데이트를 통해 웹 브라우저에서도 드래그 동작을 사용할 수 있습니다.

브라우저에서의 드래그 제스처

벡터 콘텐츠를 Illustrator로 복사/붙여넣기

벡터 콘텐츠를 Illustrator로
벡터 콘텐츠를 Illustrator로

이제 XD 벡터 콘텐츠를 클립보드에 복사한 다음 이를 편집 가능한 레이어로 Adobe Illustrator에 붙여넣을 수 있습니다. 이전 버전에서는 XD에서 복사한 콘텐츠가 병합된 이미지로 Illustrator에 붙여넣어졌지만 이제 SVG 기반의 벡터 전송으로 업그레이드되었습니다.

이 기능은 Illustrator 버전 23.0.2 이상과 호환됩니다.

이 비디오를 통해 벡터 콘텐츠를 복사하여 Illustrator에 붙여넣는 방법을 살펴보십시오.

자세한 내용은 외부 에셋을 사용하여 작업을 참조하십시오.

웹 프로토타입에서 내비게이션 컨트롤 숨기기

이제 웹 프로토타입에서의 쪽 매김 및 내비게이션 컨트롤의 가시성을 제어하여 사용자 테스트에 대해 보다 용이하게 제어되는 환경을 만들 수 있습니다.

내비게이션 컨트롤 표시 및 숨기기
내비게이션 컨트롤 표시 및 숨기기

공유 옵션에서 내비게이션 컨트롤 표시를 다음과 같이 활성화하거나 비활성화할 수 있습니다.

  • 활성(기본 설정): 프로토타입 웹 앱에 동일한 , 뒤로 및 다음 버튼이 표시됩니다.
  • 비활성: 프로토타입 웹 앱 내비게이션 컨트롤 및 아트보드 번호가 표시되지 않습니다. 정의된 핫스팟을 사용하여 프로토타입과 인터랙션하고 버튼을 클릭하여 홈 화면으로 이동합니다. 모바일 환경의 경우 프로토타입 링크를 열면 온보딩 화면이 표시되고, 왼쪽/오른쪽 V자형 화살표가 숨겨지며, 스와이프 제스처가 비활성화됩니다.

프로토타입 플로우에 와이어가 있는 경우, 프로토타입을 게시할 때 내비게이션 컨트롤이 표시되도록 할 수도 있습니다. 

참고:

기존 링크에 대해서도 이번 새로운 기능의 장점이 적용되도록 하려면 내비게이션 컨트롤 표시 옵션을 끈 상태로 프로토타입을 다시 게시하십시오.

내비게이션 컨트롤 비활성화
내비게이션 컨트롤 비활성화

이 비디오를 통해 웹 프로토타입에서 내비게이션 컨트롤을 숨기는 방법을 살펴보십시오.

내보내기용으로 표시 기능 개선

내보내기용으로 표시
내보내기용으로 표시

디자인 캔버스에서 오브젝트를 선택하고 속성 관리자에서 새로 도입된 내보내기용으로 표시 확인란을 클릭하거나 마우스 오른쪽 버튼을 클릭하고 메뉴에서 선택하여 내보내기용으로 표시할 수 있습니다.

이번 릴리스부터 XD로 가져오는 모든 비트맵 이미지는 자동으로 내보내기용으로 표시됩니다. 이미지가 포함된 Illustrator 또는 Photoshop 문서를 가져오거나 열면 XD는 자동으로 모든 비트맵 이미지를 내보내기용으로 표시합니다. 

파일 > 내보내기 > 일괄 처리를 선택하여 내보내기용으로 표시된 모든 레이어를 내보내거나 공유 > 개발 목적으로 공유를 선택하고 디자인 사양에 에셋을 포함시킬 수 있습니다. 

참고:

일괄 내보내기용으로 표시 옵션은 이제 내보내기용으로 표시로 이름이 변경되었습니다.

이 비디오를 통해 에셋을 내보내기용으로 표시하는 방법을 살펴보십시오.

자세한 내용은 디자인 사양에서 에셋 내보내기, 다운로드 및 게시를 참조하십시오. 

선택 도구 개선

여러 그룹에 걸쳐 오브젝트 선택
여러 그룹에 걸쳐 오브젝트 선택

XD에서 선택 도구가 개선되어 그룹 전반에 걸쳐 더욱 효율적으로 콘텐츠를 선택할 수 있습니다. 캔버스의 여러 그룹 내에서 속해 있는 그룹과 상관없이 Cmd/Ctrl+Shift 키를 누른 상태로 클릭하여 오브젝트를 선택할 수 있습니다. 선택하고 나면 속성 관리자에서 일반적인 속성을 손쉽게 변경할 수 있으며, Alt 키를 누른 상태로 드래그하거나 Cmd/Ctrl+D 단축키를 사용하여 복제할 수 있습니다.

이 비디오를 통해 여러 그룹에 걸쳐 오브젝트를 선택하는 방법을 살펴보십시오.

자세한 내용은 오브젝트 그룹화, 잠금, 복제, 복사 및 뒤집기를 참조하십시오.

JIRA 서버 통합

Adobe XD와 Jira Software의 통합으로 Jira 문제에서 공유된 XD 프로토타입 및 디자인 사양으로의 즉각적인 액세스가 가능하므로 디자이너와 개발자 간 공동 작업이 더욱 원활해졌습니다.

Jira Software Server 및 Jira Software Data Center에 대한 지원을 확장하면 특별한 데이터 거버넌스 요구 조건이 포함된 맞춤형 솔루션을 필요로 하는 기업 고객에게 이러한 이점을 제공할 수 있습니다. Jira 관리자가 이러한 통합을 활성화하는 방법에 대한 자세한 내용은 XD에 대한 Jira 통합을 참조하십시오.

Adobe XD 16의 새로운 기능

오디오 내레이션을 포함한 음성 인터랙션 녹화

Adobe XD에 데스크탑 미리보기 인터랙션을 녹화할 때 사용하는 내레이션을 추가하는 기능이 도입되었습니다. 클릭하고 있는 동안에는 모든 음성 내레이션이 녹화에 포함됩니다. 이는 클라이언트 또는 관련자와의 물리적인 접촉이 없는 원격 클라이언트 애플리케이션 워크스루에 특히 유용합니다.

지금까지는 Windows 사용자만 게임센터의 OS 레벨 컨트롤을 통해 이 기능을 이용할 수 있었지만, 이 새로운 기능은 앞으로 Mac 사용자에게도 제공될 예정입니다. 

이 비디오를 통해 녹화 시 프로토타입에 내레이션을 추가하는 방법에 대해 살펴보십시오.

인터랙션 녹화
인터랙션 녹화

음성 인터랙션을 녹화하고 이를 내레이션에 추가하는 방법에 대한 자세한 내용은 프로토타입에 음성 내레이션 추가를 참조하십시오.

색상 변경에 사용되는 스포이드 키보드 단축키

Adobe XD에 오브젝트의 색상을 보다 쉽게 바꿀 수 있는 스포이드용 단축키가 도입되었습니다. 색상을 변경하려는 오브젝트 또는 오브젝트의 그룹을 선택하고 키보드의 i 키를 사용하여 스포이드 커서를 로드한 다음 디자인 캔버스에서 원하는 색상을 선택하여 오브젝트의 색상을 수정합니다. 색상 피커를 사용하면 절대 색상만 선택할 수 있으며, 이 툴로 선형 또는 방사형 그레이디언트를 선택할 수는 없습니다.

이 비디오를 통해 스포이드 도구를 사용하는 방법에 대해 살펴보십시오.

스포이드 도구 단축키
스포이드 도구 단축키

스포이드 도구 단축키 사용 방법에 대한 자세한 내용은 XD의 키보드 단축키를 참조하십시오.

프로토타입 및 디자인 사양에서의 유틸리티 내비게이션 구성 요소

웹에서 XD 게시 프로토타입 또는 디자인 사양에 액세스할 때 유틸리티 내비게이션 컨트롤에 액세스할 수 있는 통합 환경이 제공됩니다. 이는 다른 Adobe 웹 애플리케이션과 인터랙션할 때 통합된 경험을 보장해 줍니다.

자세한 내용은 XD에서 프로토타입을 사용하여 작업을 참조하십시오.

유틸리티 내비게이션
유틸리티 내비게이션

공개 및 비공개 공유 사이의 전환과 관련된 UI 개선

발견 가능성 및 공유 기능과 해당 워크플로를 개선하기 위해 XD가 프로토타입 공유에 대해 다음과 같은 옵션을 제공합니다.

  • 링크를 보유한 누구나 조회 가능
  • 초대된 사용자만 조회 가능
UI 개선 사항
UI 개선 사항

자세한 내용은 임베드 디자인 및 프로토타입 공유를 참조하십시오.

Adobe XD 15의 새로운 기능

XD의 2019년 1월 릴리스에는 다음과 같은 흥미롭고 새로운 기능이 추가되었습니다.

여러 아트보드의 모든 댓글 보기 기능이 개선되었습니다.

브라우저에서 자동 애니메이트 지원

Adobe XD에서 자동 애니메이트 기능을 사용하여 디바이스에서 완벽하게 기능하고 인터랙티브한 몰입형 애니메이션 전환으로 프로토타입을 제작하고 이를 미리보기 창에서 뿐만 아니라 웹 브라우저에서도 확인할 수 있습니다.

이제 프로토타입의 애니메이션과 디자인 사양의 애니메이션 속성 값을 지원되는 웹 브라우저에서 확인할 수 있으며, 이를 통해 내 디자인을 관련자나 다른 파트너에게 보여 주는 것이 더욱 쉬워졌습니다.

자세한 내용은 자동 애니메이트 기능을 사용하여 프로토타입 제작 및 XD 아트보드 전환의 자동 애니메이트에 대해 지원되는 속성 및 지원되지 않는 속성을 참조하십시오.

또한 이 비디오를 통해 자동 애니메이트 기능이 웹 브라우저에서 어떤 방식으로 적용되는지 확인할 수 있습니다.

브라우저에서 자동 애니메이트 지원
브라우저에서 자동 애니메이트 지원

음성 언어 및 액센트 지원

이제 음성 기능이 명령 및 음성 재생 모두에 대해 모든 Adobe XD 언어를 지원합니다. 영어, 프랑스어, 독일어, 한국어 또는 일본어 사용자를 위해 디자인하는 경우 음성 경험을 해당 모국어로 프로토타이핑할 수 있으며, 향후 보다 많은 언어가 지원될 예정입니다.

또한 XD의 최신 릴리스는 음성 명령에 대한 현지 악센트를 지원합니다. 예를 들어 미국, 영국, 캐나다, 호주 중 어디에 거주하더라도 효과적이고 현지화된 음성 경험을 프로토타이핑할 수 있습니다. 자세한 내용은 Adobe XD에서 음성 디자인 및 프로토타이핑을 참조하십시오.

또한 이 비디오를 통해 음성 언어 및 악센트 지원과 관련된 내용을 살펴볼 수 있습니다.

여러 아트보드의 모든 댓글 보기

Adobe XD의 모든 댓글 보기 기능을 사용하면 프로토타입 및 디자인 사양에서 관련자의 피드백을 더욱 쉽게 관리할 수 있습니다. 이제 단 하나의 목록에서 모든 댓글을 조회하고, 개별 댓글을 클릭하여 관련 아트보드로 바로 이동하고, 댓글에 답글을 달거나 해결하거나 삭제할 수 있습니다. 

자세한 내용은 모든 댓글 보기를 참조하십시오. 

또한 이 비디오를 통해 여러 아트보드에 걸친 모든 댓글과 관련된 내용을 살펴볼 수 있습니다.

Adobe XD 14의 새로운 기능

클라우드 기반 문서를 사용하여 공동 작업 개선

Adobe XD에 여러 디바이스에 걸쳐 문서를 빠르고 편리하게 관리하고, 공유하고, 최신 상태로 유지할 수 있도록 해 주는 새로운 클라우드 기반의 문서 유형인 클라우드 문서가 도입되었습니다. 

XD 디자인을 클라우드 문서로 저장하여 최신 상태를 유지하고 오프라인에서도 액세스할 수 있습니다. 이후 다른 Creative Cloud 사용자와 공유하고 공동 작업을 수행하도록 초대할 수 있습니다. 온라인 상태가 되면 작업 내용이 클라우드에 자동으로 저장됩니다.

또한 클라우드 문서는 문서 간 에셋을 지원하며 클라우드 문서에서 구성 요소를 연결할 수 있습니다.

이 비디오를 통해 클라우드 문서 작업에 대해 자세히 알아보십시오.

클라우드 문서 소개는 XD 모바일에서 문서를 저장하고 액세스하는 방법에도 영향을 줍니다. 자세한 내용은 모바일에서 클라우드 문서를 사용하여 작업XD의 클라우드 문서 및 클라우드 문서 관리를 참조하십시오.

이 비디오를 통해 클라우드 문서로 작업할 때의 모바일 환경에 대해 자세히 알아보십시오.

오브젝트 뒤집기를 사용하여 더욱 빠르고 정밀한 디자인

XD에 오브젝트를 세로 또는 가로로 뒤집을 수 있는 옵션이 도입되었습니다. 뒤집기는 아트보드, 반복 그리드 및 구성 요소를 제외한 모든 기본 요소에 사용할 수 있으며 적용 시 오브젝트의 현재 회전을 설명합니다.

자세한 내용은 오브젝트 뒤집기를 참조하십시오.

오브젝트 뒤집기
오브젝트 뒤집기

레이어 패널에서의 검색 기능을 통한 생산성 향상

레이어 패널에서 검색 및 필터 기능을 사용하여 레이어 이름으로 검색하거나 텍스트, 모양 및 이미지 범주별로 레이어를 필터링할 수 있습니다. 검색 환경은 레이어 구조(예: 확장 그룹)를 배제하고 키워드가 포함된 관련 레이어 및 아트보드만 표시하도록 최적화되어 있습니다. 이는 아트보드 사이에서 자동으로 애니메이트되는 레이어를 사용할 때 유용합니다.

자세한 내용은 레이어를 사용하여 작업을 참조하십시오.

레이어 패널에서 검색
레이어 패널에서 검색

캔버스에서 연결된 구성 요소 미리보기

에셋 패널에서 연결된 구성 요소 업데이트 아이콘에 마우스를 가져다 대어 실제로 커밋하기 전에 캔버스에서 연결된 구성 요소 업데이트를 미리 볼 수 있습니다.

자세한 내용은 연결된 구성 요소 업데이트 미리보기를 참조하십시오.

연결된 구성 요소 업데이트 미리보기
연결된 구성 요소 업데이트 미리보기

공유 워크플로와 관련된 UI 변경

이전 명칭

새로운 명칭

작업 과정

NA

문서 공유

검토 목적으로 클라우드 문서 공유

프로토타입 게시

검토 목적으로 공유

검토 목적으로 프로토타입 게시 및 공유

디자인 사양 게시

개발 목적으로 공유

검토 목적으로 개발자와 디자인 사양 게시 및 공유

게시된 링크 관리

링크 관리

assets.adobe.com에서 링크 관리

비디오 녹화

비디오 녹화

자동 애니메이트를 사용하여 작업할 때 아트보드 사이의 인터랙션에 대한 비디오를 녹화합니다. 인터랙티브 프로토타입이 있는 경우 모든 인터랙션은 .mp4 파일로 녹화됩니다.

Adobe Illustrator에서 유지되는 레이어로 시각적 충실도 개선

Adobe Illustrator에서 XD로 복사 및 붙여넣기 기능이 개선되어 레이어의 시각적 충실도, 구조 및 효과가 Adobe Illustrator에서 디자인한 상태 그대로 유지됩니다. 이 작업 과정은 이제 Illustrator에서의 가져오기와 동등합니다.

Photoshop, Illustrator 및 After Effects와의 통합 개선

Illustrator 및 Photoshop 콘텐츠 변환 시 새로운 옵션인 파일 > 가져오기 옵션을 사용하여 Photoshop 또는 Illustrator 콘텐츠를 기존 XD 문서에 추가할 수 있습니다. 변환 시 스마트 오브젝트는 병합되지 않고 완전히 편집 가능한 상태로 유지되며 Photoshop 조정 레이어가 그대로 보존됩니다.

자세한 내용은 외부 에셋을 사용하여 작업을 참조하십시오.

모바일 디바이스에서 프로토타입 보기

전체 화면 기본 모드를 포함하여 모바일 웹 브라우저에서 프로토타입을 조회할 때 몇 가지 개선 사항이 추가되었으며, 핀치 동작을 통해 내비게이션 화살표, 홈 버튼 및 프로토타입 정보가 표시되고 문제가 보고됩니다. 자세한 내용은 모바일 디바이스에서 미리보기를 참조하십시오.

이 비디오를 통해 모바일에 대해 향상된 기능을 자세히 살펴보십시오.

SVG 내보내기 개선

이제 XD 또는 디자인 사양에서 .svg 요소를 내보낼 때 Android Studio에서 내보내는 SVG를 사용하는 경우와 같은 일반적인 개발 시나리오에 대한 스타일링 및 호환성을 개선해 주는 프레젠테이션 속성으로 내보낼 수 있습니다.

자세한 내용은 외부 에셋을 사용하여 작업을 참조하십시오.

Wacom 및 터치 지원 개선

이제 Adobe XD가 터치 스크린 Windows 디바이스, Mac 트랙패드, Wacom 태블릿, 터치패드 및 터치 링에서 선택한 오브젝트에 대한 두 손가락 회전 기능을 지원합니다.

웹 댓글 UI 어포던스 개선

웹 프로토타입 또는 디자인 사양을 열면 오른쪽 레일의 댓글 아이콘 위로 댓글 수와 함께 회색 마커가 표시됩니다. 이 숫자는 아트보드에서 해결되지 않은 댓글의 총 개수를 나타냅니다. 댓글을 새로 추가하거나 기존 댓글을 해결된 것으로 표시하면 댓글 수가 자동으로 업데이트됩니다.

웹 댓글 UI 어포던스
웹 댓글 UI 어포던스

Adobe XD 13의 새로운 기능

음성 명령 및 음성 재생을 사용하여 디자인 및 프로토타입 제작

음성 명령 및 음성 재생
음성 명령 및 음성 재생

Adobe XD는 음성 명령을 사용하여 아트보드 사이에서 인터랙션을 트리거할 수 있도록 하는 사용이 간편한 솔루션을 제공합니다. 트리거클릭 또는 을 사용하는 방식과 마찬가지로 음성을 사용하여 프로토타입 인터랙션을 트리거하고 음성 재생을 트리거 액션으로 사용할 수 있습니다. 음성 재생을 통해 강력한 텍스트 음성 변환 엔진을 이용할 수 있으므로 음성 비서나 스마트 스피커와 같은 새로운 플랫폼을 디자인하는 데 유용합니다. 자세한 내용은 음성 디자인 및 프로토타이핑을 참조하십시오.

음성 명령 및 음성 재생 사용에 대해 자세히 알아보려면 이 비디오를 시청하십시오.

자동 애니메이트 및 드래그 제스처를 사용하여 제작 및 재생

자동 애니메이트 작업

자동 애니메이트를 통해 몰입형 애니메이션 전환으로 프로토타입을 쉽게 제작할 수 있습니다. 아트보드를 간단히 복제하고 크기, 위치, 회전 등의 오브젝트 속성을 수정하고 자동 애니메이트 액션을 적용하여 아트보드 간 애니메이션 전환을 만들 수 있습니다. 자동 애니메이트를 사용하려면 애니메이트하려는 오브젝트가 두 아트보드 간 동일한 레이어 이름을 가져야 합니다. 자세한 내용은 자동 애니메이트 기능을 사용하여 프로토타입 제작을 참조하십시오.

XD의 드래그 제스처는 터치 지원 디바이스의 드래그 경험을 시뮬레이션할 수 있도록 하여 자동 애니메이트 기능을 한 단계 더 발전시킵니다. 자세한 내용은 드래그 제스처 작동 방식을 참조하십시오.

이 비디오를 통해 자동 애니메이트에 대해 살펴보십시오.

연결된 구성 요소를 사용하여 문서 간 에셋 공유

지속적으로 증가하는 디자인 업무와 결부하여 조직 내에서 디자인 팀은 성장하므로 디자이너는 일관적이고 확장 가능한 디자인을 제작하기 위해 협력할 필요가 있습니다. 연결된 구성 요소를 사용하여 디자이너는 문서 전체에 걸쳐 구성 요소를 공유하고 항상 최신 상태를 유지할 수 있습니다.

연결된 구성 요소를 사용하여 UI 키트, 스티커 시트 또는 스타일 가이드에 대한 단일 소스를 만들고 유지 관리하며 다른 Adobe XD 문서에서 사용할 수 있습니다. 소스 문서에서 연결된 구성 요소를 수정하면 XD는 연결된 구성 요소의 인스턴스를 갖는 문서에 해당 업데이트 내용을 알립니다. 여기에서 변경 내용을 미리 살펴보고 이를 수락하거나 거부할 수 있습니다. 자세한 내용은 연결된 구성 요소를 사용하여 작업을 참조하십시오.

이 비디오를 통해 연결된 구성 요소에 대해 자세히 살펴보십시오.

플러그인을 통한 툴링 혁신

Adobe XD에서 작업 자동화, 다른 도구와의 통합, 디자인에서의 데이터 활용 등에 유용한 첫 번째 플러그인 시리즈가 출시됩니다. 여기에는 Slack, JIRA 및 Microsoft Teams를 포함하여 마켓에서 가장 인기가 좋은 공동 작업 및 생산성 앱과의 통합도 포함됩니다.

플러그인 사용을 시작하는 방법에 대한 자세한 내용은 XD용 플러그인을 참조하십시오.

Illustrator 및 After Effects를 사용하여 원활한 에셋 전송

Illustrator에서 가져오기
Illustrator에서 가져오기

Adobe XD 13.0부터 Illustrator의 레이아웃 디자인과 에셋을 Adobe XD 내에서 .ai 파일을 열어 전송할 수 있습니다. 이 새롭고 빠르고 편리한 작업 과정을 통해 레이어, 아트보드, 아트워크 및 벡터를 시각적으로 가장 정확하고 자연스럽게 매핑하여 에셋을 원활하게 이전하고 UX 프로세스의 다양한 단계에서 공동 작업 환경을 간소화할 수 있습니다. 자세한 내용은 XD에서 Illustrator 파일 열기를 참조하십시오.

기능 이점:

  • 프로토타입의 Illustrator 에셋에 대한 원활한 사용: Illustrator에서 제작되었으며 자유롭게 편집 가능하고 시각적으로 정확한 레이어를 유지한 아이콘, 로고 및 기타 벡터 에셋을 XD로 보내고 UI 키트 또는 전체 라이브러리를 사용할 수 있습니다.
  • 인터랙티브 디자인 제작을 위한 공동 작업: XD에서 Illustrator 파일을 열고 XD의 강력한 프로토타이핑 및 공동 작업 기능을 사용할 수 있습니다.

이 비디오를 통해 Illustrator 통합에 대해 자세히 살펴보십시오.

After Effects를 사용한 애니메이트
After Effects를 사용한 애니메이트

Adobe XD 13.0을 통해 XD 디자인(선택한 레이어 또는 전체 아트보드)을 After Effects로 간편하게 내보내어 맞춤형 UI 애니메이션과 세밀한 인터랙션을 만들 수 있습니다. 동일한 시각적 정확성으로 레이어, 아트보드, 아트워크 및 벡터를 원활하게 내보낼 수 있으며 After Effects의 강력한 플러그인 에코시스템을 사용하여 개발자와의 공동 작업을 원활하게 추진할 수 있습니다. 자세한 내용은 After Effects로 에셋 내보내기를 참조하십시오.

기능 이점:

  • 애니메이션에 대한 완벽한 제어: 디자이너는 After Effects를 사용하여 맞춤형 애니메이션을 제작하거나 전환을 시험하거나 내 디자인의 비디오 에셋을 사용할 수 있습니다.
  • 원활한 에셋 이전: 이 통합 기능을 통해 에셋을 빠르게 이전하고 레이어, 벡터 및 아트워크를 자연스럽게 매핑하여 디자인에서 맞춤형 애니메이션까지의 턴어라운드 속도를 더욱 높일 수 있습니다.
  • 플러그인 활용: UX 디자인 프로세스에 맞춤화된 After Effects의 플러그인 에코시스템을 사용하여 애니메이션 및 개발자와의 공동 작업을 확장할 수 있습니다.

iOS에서 Win10 실시간 디바이스 미리보기

XD 13.0부터 Windows OS를 사용하는 디자이너는 USB 연결을 통해 iOS에서 디자인을 미리 볼 수 있습니다. 자세한 내용은 모바일 디바이스에서 미리보기를 참조하십시오.

Adobe XD 12의 새로운 기능

 XD의 2018년 9월 릴리스에는 다음과 같은 흥미롭고 새로운 기능이 추가되었습니다.

개선 사항:

아래에서 자세한 내용을 살펴보십시오.

반응형 크기 조정 및 제한

오늘날의 다양한 디바이스용으로 디자인할 때 모바일, 태블릿 및 데스크탑 해상도 전반에 걸쳐 매우 다양해진 화면 크기를 고려하는 것이 중요합니다. 모든 디자이너가 비슷한 디바이스를 사용하지는 않으므로 콘텐츠가 다양한 화면 크기에서 어떻게 표시될지 고려해야 합니다. 

이러한 사용자 문제를 해결하기 위해 Adobe XD에서 서로 다른 크기로 공간 관계를 유지하는 동시에 오브젝트의 크기를 변경하여 다양한 화면 크기에 최적화될 수 있도록 해 주는 반응형 크기 조정이라는 기능이 적용되었습니다. 반응형 크기 조정 및 제한 규칙에 대한 자세한 내용은 반응형 크기 조정을 참조하십시오.

이 비디오를 통해 반응형 크기 조정에 대해 살펴보십시오.

반응형 크기 조정
반응형 크기 조정 출력

오브젝트의 그룹에 대한 제한 설정
오브젝트의 그룹에 대한 제한 설정

시간 경과 전환

시간 경과 전환은 지연 및 지속 시간의 조합을 새로운 유형의 시간 트리거로 적용하여 아트보드 사이의 전환을 유발하고 신속한 온보딩 플로우 또는 루프를 생성합니다.

이제 시간이 추가됨으로써 지정한 시간 지연을 기준으로 아트보드 사이를 전환할 수 있습니다. 이는 온보딩 또는 의사 결정 플로우를 프로토타이핑하는 데 유용합니다. 

이제 프로토타입 모드에서 두 아트보드 사이의 전환을 생성할 때 이 아닌 시간을 선택하고, 지연 시간을 정의하고, 필요한 전환을 적용할 수 있습니다. 이후 XD는 동일한 화면에서 속성을 저장하고 추가 화면에 대한 기본값으로 제공합니다. 시간 경과 전환에 대한 자세한 내용은 시간 경과 전환 사용을 참조하십시오.

이 비디오를 통해 시간 경과 전환에 대해 자세히 살펴보십시오.

시간 경과 전환 설정
시간 경과 전환 설정

A. 트리거를 시간으로 설정 B. 초 단위로 지연 설정 C. 액션을 전환으로 설정 D. 지속 시간을 초로 설정 

빌트인 맞춤법 검사

Adobe XD에 디자인 캔버스에서 바로 실시간 맞춤법 검사 기능을 제공하는 빌트인 맞춤법 검사 기능이 도입되었습니다. 이 기능은 OS 수준의 언어에 의존하여 수정 사항을 제안합니다. 사전에 새 단어를 직접 추가할 수도 있습니다.

이전까지는 사용자가 맞춤법과 오타를 검사하려면 별도의 애플리케이션에 콘텐츠를 복사하여 붙여넣어야 했습니다. 

이번 릴리스부터는 선택한 텍스트에 대한 맞춤법 검사를 실행하여 모든 맞춤법 오류를 검토하고 수정할 수 있습니다.

참고:

맞춤법 검사를 시작하기에 앞서 편집 메뉴에서 맞춤법 검사 기능을 활성화해야 합니다.

맞춤법 검사
맞춤법 검사

맞춤법 검사에 대한 자세한 내용은 맞춤법 검사 사용을 참조하십시오.

웹 프로토타입의 전체 화면 보기 개선

Adobe XD의 전체 화면 모드 비헤이비어가 개선되어 브라우저에서 디자인을 조회할 때 사용자 경험이 더욱 향상되었습니다.

이제 웹 및 맞춤형 아트보드가 검은색 패딩 문제 없이 브라우저의 상단에서부터 제대로 표시됩니다. 단, 모바일 아트보드는 전체 화면 모드에서 화면의 중앙에 계속 위치합니다.

이러한 개선 사항을 통해 브라우저에서 웹 크기로 조정된 아트보드를 조회할 때 보다 사실적인 경험이 제공됩니다.

이 비디오를 통해 웹 프로토타입의 전체 화면 보기에 대한 개선 사항을 자세히 살펴보십시오.

이전 비헤이비어

개선된 비헤이비어

브라우저의 배경색은 항상 흰색이며 기본적으로 검은색 배경을 추가하지 않으므로 이는 실제 브라우저 비헤이비어를 모방합니다.

표준 및 전체 화면 보기 개선 사항:

  • 아트보드의 폭이 사용 가능한 가로 공간보다 큰 경우 프로토타입은 가로 스크롤 없이 해당 폭에 맞춰 크기가 조정됩니다.
  • 정의된 뷰포트 높이(속성 관리자에서 설정)가 있는 경우 프로토타입은 우선 이 높이에 맞춰지고 폭의 크기는 종횡비를 유지하며 비례적으로 조정됩니다. 세로로 스크롤하여 뷰포트 높이 아래쪽에 있는 콘텐츠를 조회할 수도 있습니다.
  • 디자인된 프로토타입이 웹 또는 맞춤형 아트보드인 경우 전체 화면 모드의 웹 브라우저에 게시된 링크는 브라우저 창의 상단에서부터 콘텐츠를 렌더링합니다. 모바일 및 태블릿 디자인은 계속해서 화면 중앙에서 정렬됩니다.
  • 전체 화면 모드의 배경색은 검은색이 아닌 흰색입니다. 이는 브라우저가 기본적으로 검은색 배경을 추가하지 않는 실제 브라우저의 비헤이비어를 모방합니다.

모바일 아트보드 보기 개선 사항:

  • 콘텐츠는 높이를 기준으로 종횡비를 유지하며 폭을 조정합니다.
  • 웹 브라우저에서 전체 화면 모드로 게시된 링크를 조회하면 콘텐츠는 브라우저 창의 가운데에 렌더링됩니다. 

Adobe XD 11의 새로운 기능

XD의 2018년 8월 릴리스에는 다음과 같은 흥미롭고 새로운 기능이 추가되었습니다.

개선 사항:

아래에서 자세한 내용을 살펴보십시오.

디자인 사양용 에셋 추출

XD 11.0 이후부터 일괄 내보내기용으로 표시된 레이어를 디자인 사양에 에셋으로 포함시킬 수 있으며 개발자는 디자인 사양 링크에서 내보내기용으로 표시된 모든 레이어를 다운로드할 수 있습니다.

개발자는 이후 벡터 에셋을 SVG, PNG 및 PDF로, 비트맵 에셋을 PNG 및 PDF로 다운로드할 수 있습니다.

에셋 내보내기

일괄 내보내기
일괄 내보내기

자세한 내용은 디자인 사양용 에셋 추출을 참조하십시오.

에셋 패널에서 에셋 순서 바꾸기

이번 Adobe XD 릴리스부터 에셋 패널 전체에서 하나 또는 여러 개의 에셋을 드래그하여 에셋을 구성하고 순서를 바꿀 수 있습니다. 

에셋 순서 바꾸기
에셋 순서 바꾸기

자세한 내용은 에셋 패널에서 요소 순서 바꾸기를 참조하십시오.

웹에서의 비공개 초대

Adobe XD를 통해 웹 인터페이스 내에서 디자인 사양 및 프로토타입에 대한 보안 지정 전용 초대(공개 및 비공개 링크)를 공유할 수 있습니다. 디자이너가 보안 지정 초대를 게시할 때 해당 디자이너는 초대 옵션을 사용하여 더 많은 내부 또는 외부 리뷰어를 초대할 수 있습니다.

브라우저에서 사용자에게 비공개 초대 전송
브라우저에서 사용자에게 비공개 초대 전송

참고:

초대 옵션은 해당 문서를 소유한 디자이너에게만 표시되며, 초대된 관련자는 디자이너가 허용하지 않는 한 다른 사용자를 초대할 수 없습니다.

자세한 내용은 웹에서 비공개 초대 사용을 참조하십시오.

댓글에 대한 @ 언급 지원

@ 언급 기능을 사용하여 비공개 디자인 초대에 액세스할 수 있도록 초대된 사용자의 이름을 조회할 수 있습니다. 공개 프로토타입 및 디자인 사양의 경우 최소 한 번이라도 댓글을 남긴 사용자만 리뷰어 목록에 표시됩니다. 이름으로 @ 언급된 리뷰어는 이메일 또는 Creative Cloud 데스크탑 애플리케이션을 통해 알림을 받습니다. 해당 알림을 클릭하면 참조된 아트보드로 리디렉션됩니다.

@ 언급
@ 언급

자세한 내용은 리뷰어 작업 과정을 참조하십시오.

선 유형에 대한 디자인 사양 지원

XD 11.0부터 사용자는 공유된 디자인 사양의 모든 오브젝트를 선택하고 테두리를 클릭하여 해당 화면에서 사용된 선을 표시할 수 있습니다. 

선 유형

A. 선 유형 

자세한 내용은 디자인 사양 검사를 참조하십시오.

Adobe 로고

내 계정 로그인