XDにGoogleスプレッドシートからテキスト情報を流し込むプラグイン！
こんにちは。
株式会社iCAREのデザイナーの高橋名人です。
Carelyは従業員情報や残業時間などを扱うソフトウェアであるため、UIデザインにおけるテキスト情報の割合が非常に多くなります。
「テキストテキストテキスト・・・・・」
というダミーテキストでもUIデザインはできるのですが、
現実的なデータや数値を入れるだけで、一層現場を想像しながらデザインすることができるため、プラグインによってランダムなテキストや数値を入れられるものがないか、と思っていました。
そこでGoogleスプレッドシートと連携して情報を取り込めるプラグイン「Google Sheets for Adobe XD」を見つけたので、実際にデータを取り込んでみながら使い方を紹介したいと思います?
チュートリアル動画（英語）
（※XDは現在もアップデートされているため、2020年8月現在の仕様であることをご了承ください?）
まず、プラグインをインストールします。⬇️
XDの「プラグインを追加」からGoogle Sheetsを検索して追加します。
XDのプラグインを選択し、取り込むスプレッドシートのURLを入力します。
この時に、共有の設定ではじかれてしまうことがあるので気をつけてください。
今回用意したスプレッドシートはこんなデータです。（名称などはダミー）
共有URLをペーストして、スプレッドシートの項目と同一の変数名（テキストであれば内容がオブジェクト名に反映されます。）のグループを選択します。
その状態で、変数名と入力する項目を合わせます。
選択している状態はこんな感じになっています。
そうすると、
こういったデータが、
このようなデータに変換されます。
おおおおおおおぉぉぉ！！！！
いい感じにランダムなデータを入れ込むことができましたね！！
今回はURLより読み込みましたが、CSVデータのアップロードも可能になっています。
たくさんの変数を扱ってXDでデザインをする際はダミーテキストではなくて現実的な内容を反映してリアルなUIデザインにしていけると現実味が大きく違ってきますので、ぜひ試してみてください！！！
以上、
今回は「XDにGoogleスプレッドシートからテキスト情報を流し込むプラグイン」の紹介でした〜?
