Adobe XDへのテキスト流し込み最強ツール『Docs 2 Design』を紹介

こんな疑問にお答えします。

この記事を読んでいる方の中にはWebサイト制作において、クライアントとのテキスト確認作業に時間がかかって悩んでいる方もいると思います。

そんなときに便利なのが『Docs 2 Design』というXDのプラグインです。

無料かつ高機能なので、上手く使えば作業を大きく時短することができます。

ぼくもよく実案件で使用しているくらい便利なプラグインなのでぜひ参考にしてみてください！

Docs 2 Designとは？

『Docs 2 Design』とは、Adobe XDで作成したデザインのテキストをエクセルファイルで編集できる作業効率化に適したXDのプラグインです。

無料版と有料版の違い

『Docs 2 Design』には無料版と有料版があります。

	無料版	有料版
値段	０円	w
アートボード数	10点まで無料	無制限
対応ファイル形式	エクセルのみ	エクセル スプレッドシート など

『Docs 2 Design』をインストールする

それでは早速インストールして使っていきましょう。

まずはXDを開き、左下の双眼鏡のアイコンをクリックし、『プラグインを見つける』ボタンを押します。

検索窓に『Docs 2 Design』と入力します。

プラグインが表示されるので『インストール』をクリックします。

画面左上に『Docs 2 Design』が表示されていればインストール完了です。

テキストをエクセルファイルで流し込む方法

それでは実際に、テキストをエクセルファイルで編集してみます。

まずはアートボードを選択した上で、『Extract』を押し、エクセルファイルをエクスポートします。

エクスポートしたエクセルファイルを開きます。

ファイルを開くと、下記のように左にアートボード、右にテキストが自動抽出されています。

編集したいテキストを選択しましょう。

今回はファーストビューのキャッチコピーを変更したいと思います。

テキストを編集したらエクセルファイルを保存します。

このままではまだXDに変更が反映されていません。

XDに戻り『Update』ボタンを押し先ほどのエクセルファイルを選択すれば、自動的にXDに変更した内容が反映されます。

テキストを一括で流し込みたい時やクライアントの作業環境がエクセルに適している時などは、とても便利なプラグインです。

『Docs 2 Design』の注意点

便利すぎるDocs 2 Designですが、１点注意点が。

以下の条件に当てはまるテキストは、エクセル変換時にうまく反映されません。

• コンポーネントされたテキスト
• リピートグリット
• グループ内のテキスト

上記にあてはまるテキストは、エクセルに変換する前に全て解除しておく必要があります。