hexschool
- 俊儀
- event
Adobe XD 最近更新加入了 Plugins 功能（插件），開發者們也摩拳擦掌的加入各種好用功能，讓設計師們可以輕鬆活用這些 Plugins。
而在繪製設計稿時，時常會需要一些假資料看起來才更完整。雖然 Adobe XD 裡面沒有內建這類的功能，但你可以在「Plugins」裡面找到解決這個問題的插件們；而這次要介紹的是「Google Sheets by Impekable」，它可以透過 Google Sheets 整理你所需要的文字或是圖片資料，並一鍵匯入，甚至還能一鍵更新修改過的資料內容。
怎麼安裝插件？
你可以透過兩種方式來安裝這個插件：從官網下載、或是從 Adobe XD 的 Plugins 資料庫裡搜尋。
安裝作法一：官方網站
進到官網之後，你可以很輕鬆地就找到下載的按鈕，只要打開這個下載完的檔案就可以安裝成功了。
官網連結：https://googlesheetsforadobexd.impekable.com/
安裝作法二：Adobe XD 的 Plugins 資料庫
進入 Adobe XD 之後，在最上方的選單列表中選擇 Plugins>Discover Plugins…，再在搜尋框裡面搜尋 Google Sheets 並按下 Install 即可安裝完成。
如何操作插件？
第一步：整理資料
首先，要先利用 Google Sheets 線上試算表來整理你需要在設計稿內使用到的所有資訊欄位，像是姓名、文字段落、圖片等等。
注意：整理圖片資料時，必須要使用連結，後續操作才能順利匯入。
第二步：繪製設計稿
接下來就是依據你的需求在 Adobe XD 裡繪製設計稿。
注意：需要匯入資料的物件圖層最好重新命名，不需要與資料欄位的名稱一模一樣，只要便於識別就好
第三步：匯入試算表
匯入資料的方式有兩種：貼上線上試算表的連結、或是從電腦上傳 CSV 檔案。
匯入方法一：貼上線上試算表的連結
(1) 打開線上試算表，點選右上角的「共用」按鈕，並設定為公開連結後取得試算表連結網址。
- 一定要是公開連結，不然插件會抓不到資料。
(2) 接著回到 Adobe XD 裡選擇想要匯入資料的區塊，可以是個別選擇的多個物件、一個或多個複數物件的群組、或是 Repeat Grid 產生的區塊。
(3) 按照 Plugins>Google Sheets>Paste Public Link… 的路徑啟動插件。
(4) 在 Paste URL 的地方貼上欲匯入試算表的公開連結，並按下 Continue 繼續下一步。
(5) 最後，設定好設計元素與其對應的資料欄位後，按下 Apply 就完成了。
- 若設計稿的圖層名稱與試算表的資料欄位命名相同的話，插件會自動幫你配對好。
- 若勾選左下角的 Randomize Content，插件會幫你隨機生成資料順序（對應欄位不變）。
- 若對於隨機生成的順序不太滿意，可以透過插件的 Refresh Content 功能重新生成。
匯入方法二：從電腦上傳 CSV 檔案
使用流程與使用線上試算表的連結的方式並無二致，只是路徑的部分最後是選擇 Load .CSV。
唯一要注意的是，如果是選擇上傳 CSV 檔案的話，之後沒有辦法使用 Refresh Content 的功能。
第四步：資料更新
這個插件方便的地方在於，就算試算表的資料被刪減或是調整了，仍可以一鍵同步修改的內容。操作步驟如下：
- 選取匯入修改前試算表的區塊。
- 按照 Plugins>Google Sheets>Refresh Content 的路徑啟動資料更新的功能。
為什麼需要這個插件？
一、真實資料的排版需求
Adobe XD 現在雖然多了一些可以產生假資料的插件，但若是剛好踫上了需要使用正確的真實資料來排版的專案，那使用 Google Sheets by Impekable 就能快速置換這些資訊。
二、一鍵完成線上同步
在多人合作的專案當中，資料的整理可能不只由一個人來完成。若每次的資訊修正都需要調整一次設計稿，只會徒增給設計師許多工作量。若能妥善利用這個插件，想必可以省去許多修改的時間。
三、整理假資料的資料庫
你或許在設計稿上只會用到假資料，儘管如此也能使用這個插件來整理自己常會使用的各種假資料；甚至還可以利用假資料切換多國語言、測試文字區塊字數等等。
插件只是一個幫助你在設計上更加便利的工具，要如何使用因人而異，或許還有更便利的使用方式等著你來嘗試；重要的是，只要能為你節省設計時間的都是好插件。就讓大家自己去玩玩看吧！
