素早くアプリのUI画面のアイデアを具現化するツールとして便利なAdobe XDですが、XDを拡張してより便利に使うためのプラグイン機能が存在します。プラグインは様々なサードパーティが作成、配布しており、それらを利用することでさらにXDの作業効率を上げるものもあります。 今回はこのプラグインの一つ、Icondropを紹介したいと思います。 関連 Adobe XDの共有機能を200%使い倒す方法

目次

XD用のプラグインIcondropとは?

Icondropは、Web上でアイコンの配布&販売しているWebサービスです。そのIcondropがAdobe XD向けのプラグインとしてサービスを展開しています。 XD内でIcondropのプラグインをインストールして使うことで、XD内でアイコンを検索して素早く挿入でき、わざわざブラウザを開いたり切り替えたりする必要がない便利なサービスとなっています。 紹介の動画です。

プラグインIcondropのインストール

まずは、プラグインのインストールを行います。XDの左上のサイドメニューをクリックします。 Adobe XDのサイドメニュー サイドメニューが開いたら、「プラグイン」、「プラグインを見つける…」とアクセスします。 Adobe XDのプラグインを見つける 新しいウィンドウが開きますので、検索欄で「icondrop」と検索し、「インストール」をクリックしてプラグインをインストールします。 Adobe XDのプライブインIcondropのインストール

プラグインIcondropの使い方

インストールが完了したら使い方を見てみましょう。 サイドメニューから「プラグイン」、「Icondrop」とアクセスします。(あるいはショートカットキーShift + Ctrl + D」) XDでIcondropを開く そうすると、Icondrop専用ウィンドウが開きますので、アイコンを英語で検索します。表示された結果から好きなアイコンを選択、「Insert」でXDの画面に挿入できます。網がかったアイコンは有料ですが、それも挿入することができます。 XDでアイコンを使う 実際に挿入された様子です。 XDに挿入されたIcondrop 最終的なデザインはデザイナーに任せて、完成のイメージを素早く作成してプロトタイプするという意味ではそれなりに役立つプラグインではないかと思います。 XDに挿入されたアイコン

あわせて読みたい記事