Adobe Experience Design CC是由Adobe公司新推出的一款專(zhuān)業(yè)的矢量圖形規(guī)劃軟件，Adobe XD功能強(qiáng)大，支撐現(xiàn)有的工程類(lèi)型，如web、iPhone、iPad或自定義尺度規(guī)劃，還自帶預(yù)設(shè)的UI Kit包，完美的界面設(shè)計(jì)與原型交互的切換功能，被設(shè)計(jì)師廣泛的用來(lái)設(shè)計(jì)網(wǎng)頁(yè)和應(yīng)用UI，是端到端的UX設(shè)計(jì)解決方案。

【軟件介紹】

Adobe Experience Design CC是一款可以幫助用戶(hù)設(shè)計(jì)移動(dòng)程序的軟件，Adobe XD主要設(shè)計(jì)的方式為交互設(shè)計(jì)，可以將您設(shè)計(jì)的文本、創(chuàng)意圖像、網(wǎng)頁(yè)版面添加到移動(dòng)應(yīng)用程序中，這款軟件主要針對(duì)win10系統(tǒng)開(kāi)發(fā)，您可以利用本軟件設(shè)計(jì)應(yīng)用程序并創(chuàng)建原型，從而可以增加移動(dòng)程序的可操作性；Adobe XD Windows支持設(shè)計(jì)Android、Mac OS兩個(gè)系統(tǒng)的程序，支持在開(kāi)發(fā)的過(guò)程中共享設(shè)計(jì)方案，并提供滑動(dòng)設(shè)計(jì)功能，方便您在設(shè)計(jì)平板電腦應(yīng)用、觸摸軟件等方面提供專(zhuān)業(yè)的開(kāi)發(fā)技術(shù)！

【軟件功能】

專(zhuān)用設(shè)計(jì)工具：繪制、重復(fù)使用和組裝各種元素，使用類(lèi)似于repeat grill在內(nèi)的全新高級(jí)工具來(lái)創(chuàng)建線(xiàn)框、圖形項(xiàng)目和產(chǎn)品原型。
交互式原型：在導(dǎo)出XD的時(shí)候增加互動(dòng)元素，能夠在桌面和移動(dòng)設(shè)備上進(jìn)行實(shí)時(shí)觀(guān)看
輕松共享和協(xié)作：感興趣的一方可以直接對(duì)你的原型進(jìn)行評(píng)論，用戶(hù)能夠獲得更積極的反饋。
更多功能即將到來(lái)：XD Beta還將會(huì)不斷豐富各種有趣的功能，包括對(duì)Windows的支持以及實(shí)時(shí)協(xié)作工具

【軟件說(shuō)明】

Design on Windows 10
我們最初的Windows版本提供了關(guān)鍵的設(shè)計(jì)特點(diǎn)，包括繪圖和排版工具，重復(fù)網(wǎng)格，為特定的設(shè)備，設(shè)計(jì)能力的程式化的文字，多屏畫(huà)板，進(jìn)口和出口的PNG，顏色選擇器，和這么多。

介紹XD為Windows 10
Adobe XD現(xiàn)在可用于Windows 10周年更新，UX設(shè)計(jì)師提供的第一個(gè)跨平臺(tái)的端到端解決方案。敬請(qǐng)期待-我們將在未來(lái)幾個(gè)月內(nèi)增加許多新功能。

將符號(hào)
在XD中有了新的符號(hào)，你可以簡(jiǎn)單地雙擊它們來(lái)編輯和重用對(duì)象。符號(hào)將自動(dòng)更新您的設(shè)計(jì)-不需要隔離模式。你也可以拖放符號(hào)在你的畫(huà)板，或管理他們從你的符號(hào)庫(kù)。

滾動(dòng)的畫(huà)板在Windows 10
滾動(dòng)長(zhǎng)畫(huà)板在預(yù)覽窗口中或在你的共享原型展示你設(shè)計(jì)的全部?jī)?nèi)容

像素完美的布局在Windows 10
將布局中的項(xiàng)與上下文菜單中的對(duì)齊到像素網(wǎng)格命令對(duì)齊到最近的整數(shù)。

【使用評(píng)測(cè)】

一、資源模板
打開(kāi)軟件首先會(huì)彈出一個(gè)模板選擇頁(yè)面，這里為我們提供了 iPhone、iPad、Web 等常見(jiàn)的設(shè)計(jì)尺寸。同時(shí)自帶了一個(gè)簡(jiǎn)單的演示文件以及 iOS、Google Material 和 Win Phone 的常用控件庫(kù)。窗口右側(cè)則是近期使用的文件記錄。

二、整體界面
選擇一個(gè)合適的尺寸，我們便進(jìn)入了軟件的操作界面。和傳統(tǒng) Adobe 軟件界面相比，Xd 的界面要更接近于 Sketch，風(fēng)格更加清爽，信息層級(jí)更加清晰。

整個(gè)應(yīng)用可以分為設(shè)計(jì)和原型兩種工作模式，這一點(diǎn)讓工作流程變得更為清晰，用戶(hù)也無(wú)需在多個(gè)軟件下來(lái)回切換。接下來(lái)我就兩種模式展開(kāi)介紹。

三、設(shè)計(jì)模式
我將該模式簡(jiǎn)單的劃分為了導(dǎo)航欄、工具欄、檢查器以及工作區(qū)四個(gè)區(qū)域。

用戶(hù)可以通過(guò)導(dǎo)航欄左側(cè)的按鈕在設(shè)計(jì)和原型兩種模式下進(jìn)行切換。而標(biāo)題欄右側(cè)則是顯示了當(dāng)前視圖的縮放比例，同時(shí)提供了播放和分享功能的按鈕（此功能后續(xù)會(huì)相繼展開(kāi)）。

左側(cè)的工具欄提供以下幾種常用的工具：選擇工具、矩形工具、圓形工具、直線(xiàn)工具、鋼筆工具、文字工具以及新建畫(huà)板。對(duì)用的快捷鍵分別為：V R E L P T A 使用方法基本沿用 Adobe 其它軟件的用戶(hù)習(xí)慣，所以在此就不展開(kāi)介紹了。

右側(cè)的檢查器主要包括了對(duì)齊，布爾運(yùn)算，對(duì)象尺寸、位置以及旋轉(zhuǎn)角度和外觀(guān)屬性。其中外觀(guān)屬性目前提供了透明度、描邊、填充以及投影這幾種選項(xiàng)。

Xd 的任意形狀都可以看做默認(rèn)的圖片剪切蒙版，直接將圖片拖放到相應(yīng)的對(duì)象上，圖片便會(huì)根據(jù)對(duì)象的尺寸進(jìn)行自動(dòng)縮放適配。需要的注意的是，如何你想再次編輯該圖片的形狀樣式，需要再次新建一個(gè)你需要的形狀對(duì)象，同時(shí)選中兩者，按下 Command+【M】鍵來(lái)新建新的剪切蒙版。通過(guò)后者新建的圖片對(duì)象是可以通過(guò)雙擊再次編輯圖片位置和屬性的。

除此之外，值得一提的是 Xd 提供了一種新的控制模式 Repeat Gird，在此我將其稱(chēng)作批量控制。選中任意對(duì)象后點(diǎn)擊此按鈕，對(duì)象的定界框會(huì)由藍(lán)色變?yōu)榫G色，同時(shí)在水平和豎直方向多出兩個(gè)圓角矩形的按鈕，點(diǎn)擊并拖動(dòng)按鈕即可在不同方向上對(duì)該對(duì)象進(jìn)行批量復(fù)制，同時(shí)可以通過(guò)點(diǎn)擊對(duì)象之間的區(qū)域進(jìn)行拖動(dòng)來(lái)批量調(diào)整所有對(duì)象之間的間距。

工具區(qū)域默認(rèn)為淺灰色底色，目前不支持編輯背景色值。

四、原型模式
Xd 目前版本的交互方式只支持頁(yè)面之間的跳轉(zhuǎn)。操作過(guò)程倒是非常簡(jiǎn)單。在原型模式下選中任意控件，其右側(cè)便會(huì)出現(xiàn)一箭頭符號(hào)，用戶(hù)點(diǎn)擊箭頭符號(hào)并拖動(dòng)，將引導(dǎo)線(xiàn)拉至任意頁(yè)面即可完成簡(jiǎn)單的交互動(dòng)畫(huà)。

與此同時(shí)，還可以通過(guò)點(diǎn)擊控件或其指向頁(yè)面?zhèn)冗叺募^符號(hào)來(lái)控制動(dòng)畫(huà)類(lèi)型和參數(shù)。目前提供的屬性?xún)H包括頁(yè)面出現(xiàn)的方式、持續(xù)時(shí)間以及緩入緩出屬性。

用戶(hù)可以在選中需要預(yù)覽的頁(yè)面后點(diǎn)擊導(dǎo)航欄右側(cè)的預(yù)覽按鈕進(jìn)行預(yù)覽操作。同時(shí) Xd 在預(yù)覽窗口的右上角提供了視頻錄制功能。用戶(hù)可以點(diǎn)擊該按鈕開(kāi)始錄制，在完成交互操作后，再次點(diǎn)擊該按鈕完成錄制并導(dǎo)出視頻。視頻格式目前僅支持 mov 格式。

除此之外，用戶(hù)還可以通過(guò)點(diǎn)擊導(dǎo)航欄右上角的分享按鈕，來(lái)創(chuàng)建可以在線(xiàn)預(yù)覽的鏈接。文件會(huì)默認(rèn)儲(chǔ)存在 Adobe Creative Cloud 的資源庫(kù)內(nèi)。同時(shí)也可以通過(guò)點(diǎn)擊分享按鈕下的 Manage Links 按鈕來(lái)編輯及管理這些內(nèi)容。

我們也可以選擇在移動(dòng)端打開(kāi)該分享鏈接來(lái)進(jìn)行實(shí)際操作和預(yù)覽。由于 Safari 瀏覽器會(huì)保留一部分標(biāo)題欄以至于無(wú)法實(shí)現(xiàn)全屏預(yù)覽。所以筆者找到了開(kāi)發(fā)同學(xué)，寫(xiě)了一個(gè)可以使瀏覽器內(nèi)容全屏預(yù)覽的小程序。除此之外，還可以選擇 Chrome 瀏覽器來(lái)達(dá)到類(lèi)似效果。

五、功能小結(jié)

無(wú)標(biāo)尺功能，在不拖動(dòng)物體的情況下無(wú)法做到如 PS 或 Sketch 一樣，直接查看對(duì)象之間的間距尺寸。
無(wú)縮放工具，目前僅支持通過(guò) Command + 【+/-】進(jìn)行視圖縮放,無(wú)法做到如 Sketch 一樣做到針對(duì)特定對(duì)象的聚焦縮放。
無(wú)像素預(yù)覽模式，所以無(wú)法做到圖標(biāo)邊緣的像素對(duì)齊，在輸出 PNG 格式切圖時(shí)會(huì)出現(xiàn)邊緣模糊的情況。
目前僅支持純色填充，無(wú)漸變或其他選項(xiàng)。
文字屬性目前僅支持對(duì)齊方式及字間距的調(diào)整，無(wú)行高、段落等選項(xiàng)。
支持編輯節(jié)點(diǎn) ，但無(wú)端點(diǎn)、交點(diǎn)、虛線(xiàn)、閉合路徑、描邊擴(kuò)展等選項(xiàng)。
圓角矩形無(wú)法如 AI 一樣，單獨(dú)調(diào)整某一圓角的度數(shù)。
支持頁(yè)面之間的交互跳轉(zhuǎn)，不支持同一頁(yè)面控件間的位移、縮放及透明度動(dòng)畫(huà)。

所以目前版本的 Xd 是無(wú)法獨(dú)立完成界面以及圖標(biāo)的繪制。當(dāng)然，這些問(wèn)題對(duì)于 adobe 來(lái)說(shuō)應(yīng)該不存在技術(shù)難點(diǎn)。問(wèn)題在于 Xd 的定位是一款需要與 PS、AI 協(xié)作的輕量化交互原型工具，還是更趨于獨(dú)立?；蛟S adobe 本身也在思考與觀(guān)望，V0.5 版本也僅是投石問(wèn)路的一次嘗試。

除了上述簡(jiǎn)介以外，官網(wǎng)也為我們提供了4個(gè)基礎(chǔ)的入門(mén)教程，在這里附上地址鏈接：https://helpx.adobe.com

總而言之，Xd 作為一款新的交互軟件，在它的身上我們能夠看到不少新興工具的身影。同時(shí)也能看出 Adobe 公司突破其已有軟件束縛，所做的一些新嘗試。雖然軟件本身還有著許多不足之處，但對(duì)于產(chǎn)品設(shè)計(jì)師來(lái)講，它的一些功能還是可圈可點(diǎn)的。正如其官網(wǎng)所述：A new experience in user experience。作為 V.0.5 的預(yù)覽版本，或許我們應(yīng)該對(duì)其多一些包容，也期待 Adobe 能夠給我們帶來(lái)更多新的驚喜。

【更新日志】

在這個(gè)Beta更新，以下新功能已被添加到Windows：

屏蔽：你現(xiàn)在可以使用對(duì)象或形狀作為掩碼來(lái)隱藏你的資產(chǎn)的一部分，并把用戶(hù)的注意力集中在你的設(shè)計(jì)有趣的元素。

布爾運(yùn)算：可以將對(duì)象在你的畫(huà)板上使用布爾運(yùn)算。您可以添加，減去，交叉，或排除對(duì)象創(chuàng)建復(fù)雜的藝術(shù)品為您的設(shè)計(jì)。

從瀏覽器導(dǎo)入資產(chǎn)：可以將圖像直接從所有現(xiàn)代瀏覽器在你的畫(huà)板。你也可以拖動(dòng)圖像在圖板的對(duì)象。當(dāng)你這樣做時(shí)，圖像大小會(huì)自動(dòng)調(diào)整，以適應(yīng)對(duì)象。您也可以復(fù)制圖像從瀏覽器和粘貼在A(yíng)dobe XD。