Ed專注于新興VR/AR領域的用戶體驗設計。他曾為谷歌、索尼和電子藝界設計過獲獎項目。adobexd的組件系統為設計師提供了強大的功能，使他們能夠制作數字產品的原型。然而，它并非沒有怪癖，需要特別照顧。利用智能快捷方式和遵循最佳實踐將使設計師能夠簡化其XD原型工作流程。
自2017年底正式公開推出以來，Adobe XD已朝著成為UX設計師極具競爭力的線框和原型工具的方向取得了長足的進步。特別是，它的新組件系統擴展了設計師可以嘗試的交互類型。不過，組件也并非沒有怪癖和缺點。在使用XD組件時，采用一組工作流實踐有助于避免繁雜的工作并充分利用系統的潛力。
XD組件是可重用的元素分組，例如文本、形狀或線條。一個組件有一個“主組件”作為父組件，還有一個“實例”或子組件放置在藝術板上。更改主組件時，更改會傳播到其所有實例。組件取代了XD以前的“符號”系統，提供了一個關鍵的區別。它們可以有多個狀態來響應XD的原型模式中定義的不同輸入。例如，按鈕可以具有默認狀態，但在處于懸停或單擊狀態時會更改其外觀。它可以在點擊時播放聲音，甚至可以根據語音識別的輸入改變聲音的外觀。
組件系統省時，但需要特別小心。一個深思熟慮的方法和精心準備的工作流程是必要的，以利用系統的力量。對adobexd相當熟悉的設計師將從以下提示和建議中獲益匪淺。首先，從Google的Material Design主頁下載adobexd設計工具包。該工具包將提供一個adobexd組件集來進行實驗和解構。
當第一次創建具有狀態的組件時，設計者應該了解組件的潛在更改如何影響其他實例。為了舉例說明，讓我們考慮一個包含幾個狀態的下拉菜單：編輯下拉列表的子實例的默認狀態時，這些更改不會傳播到懸停或單擊狀態。必須更改主組件中的默認狀態才能更新所有實例的懸停或單擊狀態。
雖然跳入并開始迭代主要組件是很有誘惑力的，但有時由于父組件和子組件的行為方式不同而發生意外的問題。一個好的實踐是，在添加其他狀態或實例化組件之前，考慮并預測主組件的默認狀態所需的一切，甚至可以并排列出不同的狀態。
設計人員還應該記住，他們可以在主組件或子實例的非默認狀態下添加和更改元素，而不會影響默認狀態，但反之則不然。對Adobe的一個建議是：給組件狀態一個鎖特性，這樣設計人員就可以保持非默認狀態不變，并防止對主組件默認狀態的更改傳播。
創建一個組件（右鍵單擊一個元素，然后在菜單中選擇“生成組件”，或者在Mac上按Cmd-K，在PC上按Ctrl-K）將組件添加到左側欄的“資源”面板中。XD將給組件一個默認名稱“component XX”（其中“XX”是一個數字）。它不是很有描述性，所以最好給它一個唯一的、可搜索的名稱。
為什么這么做？當組件列表填滿時，如果所有組件都以相同的默認名稱和一個無意義的數字開頭，那么它將變得非常笨拙。雖然“平鋪視圖”選項有幫助，但它沒有文本標簽，這使得視覺識別變得緩慢且具有挑戰性。帶有小縮略圖的“列表視圖”也很難識別具有不可識別名稱的組件之間的差異。組件可能會丟失。通過命名使其可搜索將節省時間
創建組件時，很容易意外地將主組件放置在藝術板上。雖然XD提供了查找主組件的工具（通過搜索Assets面板或右鍵單擊并從子實例中選擇editmaincomponent），但是在相信主組件是一個實例的情況下，很容易對其進行意外更改。這樣做可能會在多個藝術板上導致許多不希望的變化。即使artboard上只有少數幾個組件實例，一旦artboard被克隆，事情也會很快失控。對主組件的不經意更改會增加本可以避免的清理時間。
最好養成一個習慣，即在創作時立即將主要組件從設計藝術板上移開。一個理想的方法是將主要組件放在XD文件的粘貼板上，或者放在清晰標記的專用藝術板上。這樣做會使事情以后更有效率。對Adobe的一個建議是：在對主組件進行更改時考慮一個提示，這樣就可以警告設計者這些更改可能會傳播到子實例。如何使用XD：小心地命名層是至關重要的，因為使用自動動畫轉換在很大程度上依賴于它。小心地命名層是至關重要的，因為使用自動設置動畫的過渡在很大程度上依賴于它。
很容易在artboard上嘗試想法，進入分組/取消分組組件和更改組件狀態屬性的流程。可能會有一個強烈的誘惑，盡量減少左側邊欄，以獲得更多的工作空間。然而，組件狀態和轉換很有可能在一系列迭代中表現得不符合預期。這可能是因為子元素（如形狀、向量或文本）的組織和分組偏離了正確工作所需的位置。
圖層視圖為元素的層次結構和命名提供了100%的透明度，其嚴密的組織是至關重要的。使用XD強大的自動動畫在狀態之間轉換要求元素在組件的層層次結構中具有相同的名稱和位置。否則，過渡將默認為淡入淡出，而不是吸引人的自動動畫。有時，在自動設置過渡動畫時，可能需要從插值中抑制特性。為了實現這一點，設計者可以重命名處于不同組件狀態或artboard的元素，以斷開基于名稱的鏈接。在這兩種情況下，當出現意外問題時，可以使用層視圖進行故障排除。在調試原型問題時，無論是組件狀態之間的轉換還是藝術板之間的轉換，這都應該是第一步。
添加品牌總監微信
總監微信
復制成功
業務咨詢 何先生
業務咨詢 何先生
搜索感興趣的內容
