以下來探討我喜歡XD的幾個原因:

免費,且支援Windows

雖然免費版有功能上的限制,但是它支援Win10,不像Sketch獨佔於MacOS X上,讓想要學習UI/UX的人多了一個選擇。

簡單易用

可以說是Adobe系列軟體裡,最好上手的了。雖然之前學過PS和AI這兩個設計軟體,但是我還沒完全摸熟。XD我只花大概兩天的時間就掌握了80%的功能學習曲線低,設計門外漢也能輕鬆上手。

支援PS、AE、AI、SKETCH

能夠無縫接軌常用的設計軟體

雲端儲存功能

所有的檔案可以保存在雲端,不用擔心換電腦,檔案就要跟著帶過去
而且還能透過手機上的XD進行瀏覽,模擬於手機端使用這個APP的樣子

匯出功能

支援PDF、完整Assests等繪出功能

Adobe XD to After Effects

Export from Adobe XD to After Effects | 1 Minute Tutorial

Adobe XD的「實用」功能

布林運算

布林運算能讓我們可以很容易的製作出需要的圖形,搭配上鉛筆工具和貝茲曲線,我甚至覺得能來進行簡單的繪圖工作

圖層

我很喜歡PS的圖層功能,雖然這個功能在XD上沒有PS方便,但是「有」,總比「沒有」好

鏡射翻轉

Shift+alt

Repeat Grid

1.快速建立重複的文字/圖片內容
2.大量加入圖片時,能夠將圖片載入線框中
3.可將文字存在txt文件,一次匯入Repeat Grid

Add-On

有許多的擴充工具
例如:標註尺寸、匯出成HTML、CSS......等可以安裝使用

Symbols

將建立的元件(如:圖片或文字)快速重複利用

Character Styles

快速套用字體設定

Share

透過XD產生一個網頁連結,分享給其他人看UI設計的成果#頁面可新增註解、多人協作

Publish Design Specs

可以匯出已標註的XD物件高度, 寬度, 尺寸, 擺放位置, 顏色, 字體......等
(必須勾選Include Assets)

Kits

開啟兩個畫面打開Kits包,將裡面的Component放到我們的主設計中

PinComments

在已發佈的XD設計寫下相關評論

圖片遮罩

形狀
1.匯入圖片
2.繪出圖形
3.選取圖片和圖形
4.Object->Mask with Shape
文字
1.匯入圖片
2.輸入文字
3.選取圖片和文字
4.Object->Path->Convert to Path
5.Object->Mask with Shape

PhotoSplash(Plugin)

https://www.youtube.com/watch?v=nDICrRhaFFQ

朦朧效果

1.匯入圖片
2.繪製圖形
3.將圖形移動至圖層最上層
4.調整Background Blur

Written by

Machine Learning / Deep Learning / Python / Flutter cakeresume.com/yanwei-liu

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store