어도비 XD 2020년 10월 릴리스: 3D 변형, 크리에이티브 클라우드 라이브러리, 비주얼 스튜디오 코드를 통해 더욱 신속하게 작업 수행
이번에도 어도비 맥스와 함께 또 한번의 생일을 맞이하는 XD가 돌아왔습니다! 올해는 베타 테스트를 마치고 어도비 XD의 첫 정식 버전을 출시한지 3년째가 되는 해로, 날마다 XD를 사용하여 웹 사이트, 웹 및 모바일 앱, 디지털 마케팅 캠페인 등을 디자인하는 백만 명이 넘는 디자이너 커뮤니티에 감사의 말씀을 전합니다. 올해 맥스는 무료 온라인 이벤트로 진행되므로 누구나 기조 연설, 세션, 랩, 워크숍 등을 전 세계 어디에서나 시청할 수 있습니다.
어도비 XD의 이번 맥스 릴리스는 완전한 유연성으로 워크플로우의 한계를 넘어서는 혁신적인 콘텐츠 제작 툴을 제공합니다. 새로운 크기를 탐색하는 것부터 디자이너와 개발자를 연결하는 기능까지 사실적인 모양과 느낌의 경험을 디자인하고 팀이 최종 버전을 만드는 과정을 간소화할 수 있는 흥미로운 업데이트가 제공됩니다. 아래 글에서 자세한 내용을 살펴보세요.
3D 변형으로 한계를 뛰어넘는 혁신적인 콘텐츠 제작
디지털 경험의 세상은 진화하고 있고, 우리의 디바이스와 운영 체제도 끊임없이 바뀌고 있습니다. 인터페이스가 지속적으로 더욱 다양해지고 몰입도가 향상되고 있습니다. 더욱이 증강 현실과 가상 현실 등의 새로운 경험 유형이 주류로 부상하고 있습니다. 그럼에도 불구하고 이러한 경험을 디자인하기 위해 사용되는 툴은 여전히 단편적인 2차원의 디자인 스타일에 머물러 있습니다.
이러한 취지에서 오늘 어도비는 XD에서 3D 변형을 사용하여 완전히 새롭게 디자인하는 방법을 소개하려고 합니다. 이제 개체를 앞쪽으로, 뒤쪽으로 그리고 평면을 가로질러 이동 및 회전할 수 있고 디자인에 심도와 원근을 추가하여 새로운 사용자 경험 유형을 제작할 수 있습니다.
3D 변형을 사용하여 한 차원 높은 수준의 디자인을 만들 수 있는 방법은 매우 다양합니다. 물리적 공간에서 UI 요소를 겹쳐서 배열하여 증강 현실 경험을 디자인할 수 있고, 개체를 뒤집거나 회전시켜 흥미로운 상호 작용과 애니메이션을 제작할 수 있습니다. 개체를 위로 쌓아 올려 심도를 만들어 레이어드 효과를 만들 수 있고 디자인을 기울이거나 돌리고 목업에 원근을 적용하여 표시할 수 있습니다. 이렇듯 3D 변형을 사용하는 방법은 무궁무진합니다.
3D 변형은 모양, 텍스트 또는 그룹에 적용할 수 있으므로 원하는 콘텐츠를 자유롭게 제작할 수 있습니다. 개체를 변형된 그룹에 붙여 넣으면 XD가 붙여진 개체에 변형 내용을 자동 적용합니다. 3D 변형은 XD에서 스크롤 그룹, 반복 그리드 및 자동 애니메이트와 같은 다른 기능과 함께 사용할 수 있습니다.
3D 변형은 강력한데다 사용이 간편합니다. 개체를 선택하고 속성 관리자에서(또는 ⌘/Ctrl + T 선택) 3D 변형을 활성화하면 캔버스에 새 컨트롤이 표시되어 각각의 평면에서 개체를 옮기고 회전할 수 있습니다. 이렇게 간단합니다.
3D 변형 기능을 통해 독자들이 만들 모든 작품이 심히 기대가 됩니다. 소셜 미디어에서 공유해주시고, 이때 #CreateWithAdobeXD를 꼭 붙여주시면 어도비 채널에서 소개될 기회를 얻으실 수 있습니다. 레츠 XD(Let’s XD)에 대한 가이드에서 3D 변형을 다양하게 사용하는 방법을 살펴보세요.
크리에이티브 클라우드 라이브러리를 통해 규모에 맞게 디자인 가능
디자인 팀의 규모가 커지면 팀이 최신 정보를 공유하고 원활하게 소통하는 것이 무엇보다 중요합니다. 디자인 시스템을 사용하면 리소스를 한곳에서 관리하고 디지털 경험의 모양과 느낌에 대해 서로 소통할 수 있는 언어를 공유하게 됩니다. 따라서 디자인 시스템은 새로운 경험이 일관되고 확장 가능한 방식으로 만들어지는 기반을 제공합니다. 오늘 XD에서 디자인 시스템을 보다 효과적으로 사용하기 위한 주요 기능이 출시되었습니다.
이제 팀원이 크라에이티브 클라우드 라이브러리를 사용하여 디자인 시스템을 생성하고 공유할 수 있습니다. 라이브러리를 통해 디자인 시스템을 한 번의 클릭으로 게시하고 팀을 초대하여 작업에 참여하고 공동 작업할 수 있습니다.
문서 에셋은 디자인 시스템의 초석입니다. 에셋(색상, 문자 스타일 및 구성 요소)을 선별한 다음, 게시 아이콘을 클릭하여 라이브러리를 만들어 보세요. 라이브러리에 액세스할 수 있는 사람을 제어할 수 있고, 시스템 전체에 업데이트되는 내용을 관리할 수 있습니다.
디자인 시스템에 대해서는 모든 팀원이 각자의 역할을 수행합니다. 라이브러리를 통해 디자인 시스템의 에셋을 사용할 수 있는 사람이 아닌, 디자인 시스템에 에셋을 제공할 수 있는 사람에 대한 권한을 설정할 수 있습니다. 보기 권한과 편집 권한의 경우 모두가 디자인 시스템을 사용할 수 있지만, 몇 명의 팀원만 디자인 시스템을 작성하거나 시스템에 에셋을 제공할 수 있도록 허용합니다.
공동 작업은 서로 다른 툴과 워크플로우를 사용하는 것을 포함합니다. 팀원이 일러스트레이터에서 브랜드의 일러스트레이션을 편집하거나 포토샵에서 히어로 이미지를 변경해야 할 수도 있습니다. 이러한 경우, 라이브러리를 사용하면 포토샵, 일러스트레이터 및 인디자인과 같은 다른 크리에이티브 클라우드 애플리케이션에서 에셋을 손쉽게 액세스할 수 있습니다. 또한 XD의 색상, 문자 스타일 및 그래픽과 같은 에셋을 다른 크리에이티브 클라우드 앱으로 이동시킬 수도 있으며, 크리에이티브 클라우드의 다른 툴을 활용한 워크플로우를 매끄럽게 통합하는 크리에이티브 시스템을 구축할 수 있습니다.
디자인 시스템으로 디자이너와 개발자 연결
성공적인 디자인 시스템을 위해서는 디자이너와 개발자 모두가 공동으로 만들고, 유지하며 채택해야 합니다. 경우에 따라 이 워크플로우는 여러 툴의 사용을 포괄하기도 하며, 개발자가 자신이 익숙한 툴을 버리고 이 시스템을 사용해야 할 수도 있습니다.
이보다 더 나은 방법이 있다고 생각합니다. 이렇기 때문에 개발자가 자신의 편집기를 버리지 않고 디자인 시스템과 연동하도록 마이크로소프트 비주얼 스튜디오 코드용 어도비 XD 익스텐션을 선보이는 것입니다. 비주얼 스튜디오 코드는 개발자가 모든 프로그래밍 언어를 사용하는 작업에 가장 널리 이용되는 코드 편집기로, 윈도우, 맥OS 및 리눅스에서 무료로 제공되고 있습니다.
현재 비주얼 스튜디오 마켓플레이스에서 제공 중인 비주얼 스튜디오 코드용 어도비 XD 익스텐션을 사용하면 디자이너와 개발자 간의 소통 공백을 해소할 수 있습니다. 개발자는 크리에이티브 클라우드 라이브러리를 통해 단 몇 초 만에 디자인 토큰을 만든 다음 웹, iOS, 안드로이드 및 플러터(Flutter)와 같은 다양한 플랫폼으로 컴파일할 수 있습니다. 코딩 중에도 관련 문서와 코드 단편에 신속하게 액세스할 수 있습니다.
어도비는 비주얼 스튜디오 코드용 어도비 XD 익스텐션을 제작하는 동안 고객과 파트너와 긴밀한 협조를 통해 팀이 툴과 상관없이 디자인 시스템 정보 공유를 지원하기 위해 개발된 디자인 시스템 패키지(DSP)라는 새로운 개방형 패키지 형식을 정의했습니다. 이 비주얼 스튜디오 코드 확장을 사용하여 크리에이티브 클라우드 라이브러리의 디자인 시스템 에셋을 사용하는 DSP를 구축할 수 있습니다.
기타 새로운 기능 및 향상된 기능
이번 릴리스에는 위에서 설명한 새로운 기능 이외에 다음의 기타 업데이트도 포함되어 있습니다.
공동 편집을 통해 실시간 공동 작업. 공동 편집 기능이 베타 테스트를 완료하고 이제 일반 공개되어 이제 함께 디자인 문서를 편집할 다른 사람을 초대할 수 있습니다. 실시간으로 함께 작업하거나 자신이 선택한 시간에 작업을 할 수 있습니다. 모두가 최신 버전에 액세스하고 모든 변경 사항이 자동으로 클라우드에 동기화되는 동일한 소스에 액세스할 수 있다는 점을 알고 있기 때문입니다. 어도비 XD의 공동 편집에 대한 자세한 내용은 여기를 살펴보세요.
- 새로운 플러그인 및 통합. 디자인이 XD에서 수행되는 동안, 팀은 다른 많은 툴을 이용해 공동 작업하고 매력적인 경험을 제작합니다. XD는 팀의 워크플로우에서 사용되는 다른 앱과 툴을 XD와 연결하고 새로운 기능을 추가할 무려 275개에 달하는 플러그인 및 통합 기능을 제공합니다. 라이크(Wrike), 미로(Miro), 유저줌 고(UserZoom Go), 마파이프(Marpipe), 메이즈(Maze), 줌(Zoom), 마이크로소프트 팀즈(Microsoft Teams), 콘플루언스(Confluence) 플러그인 등 새로운 플러그인과 통합 기능이 곧 출시될 예정입니다.
- 자동 높이 텍스트를 통해 텍스트 크기 자동 조정. 자동 높이 텍스트 상자가 안에 포함된 텍스트의 분량에 따라 커지거나 줄어듭니다. 스택과 함께 사용하면 다양한 길이의 콘텐츠를 수용하는 레이어웃을 디자인하는 한편, 레이아웃에서 개체 사이의 간격을 유지할 수 있습니다. 자동 높이 텍스트에 대한 동영상은 여기에서 시청하고 XD에서 텍스트를 사용하는 방법에 대한 자세한 내용은 여기를 살펴보세요.
- 중첩된 구성 요소를 통해 보다 유연한 구성 요소 제작. XD를 사용하면 구성 요소 안에 다른 구성 요소를 가져올 수 있습니다(또는 “중첩”). 이제 어도비 커뮤니티의 피드백 덕분에 고정점 구성 요소 안에 중첩된 인스턴스를 변경하면 이러한 변경 사항이 바깥의 구성 요소의 인스턴스에 적용됩니다.
- 디자인 사양의 구성 요소 상태 지원. 디자인 사양을 이용하면 디자인에서 코드로 이어지는 전달 프로세스를 간소화할 수 있습니다. 이제 개발자들은 디자인 사양에서 구성 요소가 여러 상태로 되어 있는지 확인할 수 있고, 각 상태의 사양을 확인할 수 있습니다.