使用Adobe XD規劃UI

在大多數情況下,規劃新網站的開始會是模型和靜態設計。 Adobe XD 是同級最佳的設計工具,用於建置使用者體驗。 Adobe建議使用Adobe XD或其他工具,透過使用UI模型來規劃Sites實作。

必備條件

此為多部分教學課程,假設已完成上一章所述的步驟。 本章只是監看和學習部分,不需要採取任何動作即可繼續後續章節。

隨附您所需的影片 Adobe XD 已安裝, a 免費試用.

目標

  1. 檢閱由 標準網站範本 和WKND設計團隊。
  2. 了解如何使用UI套件來對應和規劃AEM Sites實作。
  3. 了解如何將Adobe XD中建立的UI設計轉讓給前端開發人員,以進行實作。

您將建置的

在本章中,將檢查兩個Adobe XD檔案,一個用於 標準網站範本 和另一個為擬議的WKND地點。 此

標準網站範本UI套件

高階步驟:

  1. 下載 標準網站範本XD檔案.
  2. InspectAdobe XD中的UI Kit。
  3. 模擬將設計交給前端開發人員。

WKND UI Kit

高階步驟:

  1. 下載 WKND文章XD檔案.
  2. Inspect WKND文章範本的設計。

恭喜!

恭喜,您已了解如何使用Adobe XD UI Kit來對應和規劃AEM Sites實作。

其他 提供UI套件 以檢查並下載。

後續步驟

在下一章中,將根據WKND文章設計建立新的頁面模板。

了解如何建立和修改 頁面範本. 了解頁面範本和頁面之間的關係。 了解如何設定頁面範本的原則,以提供精細的控管和內容的品牌一致性。 系統會根據Adobe XD的模型,建立結構良好的雜誌文章範本。

本頁內容