開啟 3D 視角介面體驗 😎 Adobe Xd 新功能概覽
嗨囉，我是設計師 Riven 🙂
在今天台灣時間約凌晨三點的時候，線上舉行的 Adobe MAX 活動直播開始進行了，而在第一天的議程當中少不了宣布幾項現有產品的更新，像是 Illustrator for iPad 終於正式公開囉！以及 iPhone 版本的 Fresco 等等；而 Adobe Xd 則也釋出了內建的 3D Transforms 功能，可以在軟體當中直接將介面中的物件做立體視角的轉換，今天就讓我們一起來看看它可以做什麼事情吧～
軟體使用方式
而這操作方式也非常簡單，只要確定目前使用的 Adobe Xd 有更新成最新版(34.0.12)以上，然後在 Xd 介面中右上方就可以找到這個 3D Transforms 的按鈕，開啟之後就能夠自由拖曳物件的垂直與水平方向。
而這個原理其實就是可以調整圖片的透視角度，我們從下面這張哀傷的示意圖中可以更清楚地理解這項 Adobe Xd 的新功能：
在 UI 介面上的用途
而這個 3D Transforms 實際上可以在介面設計上做到什麼樣的發揮呢？
1.做出透視感的視覺設計
2.更好的合成畫面角度
3. 介面互動設計
於實務開發面向的用途
但老實說這個視角調整啊，老早在好幾年前的 Photoshop 就可以做到了，這次 Adobe Xd 的更新有什麼特別的嗎？回歸到 Xd 本身還是 UI 設計專門的軟體，所以做這樣透視的功能並不單只是為了視覺好看而已，更重要的是讓前端工程師開發切版時能夠更好地協作，而以網頁來說，這樣的設計在程式語言上就是與perspective以及rotateX與rotateY等有關。
同時，開啟 3D Transforms 後除了原本物件的 X 軸與 Y 軸，還會開啟另外一個 Z 軸，能夠直接做 Z 軸平移，而這則是對應到前端語言當中的translateZ。
而回到前面提到介面上的互動，如果能夠著實地做出來，則可以產生類似 AR 虛擬實境感的介面體驗。
這樣看來 3D Transforms 的確可以在 UI 介面上創造更多設計的可能性呢！
好啦，以上就是今天關於 Adobe Xd 新功能 3D Transforms 的簡單介紹，除此之外在 Adobe MAX 2020 年上還有一些像是 Stacks、Smart Padding 等的更新，有興趣的同學可以收看 Keynote 開場展示的環節存檔影片。
我是 Riven 😀 我們下次見囉～ 掰掰。
