アセットとは?
「アセット」という言葉の意味として”資産・資源”や”素材・成分”という意味合いがあります。
Xdにおけるアセットは、くり返し使うデザイン要素(素材)のことを差します。
デザイン上の色やボタン等、繰り返し使う要素やパーツを登録して
- いつでも引き出せるようにしておく
- 要素の変更を一括で反映できるようにする
機能です。
統制のとれたデザインにするためには
世界観を構成するカラーセットや、
見出しはこのデザイン、ボタンはこの形とバリエーション、など
ある程度ルール化された要素ができてくると思います。
他のデザインツールであれば、作ったパーツを複製して使いまわすこともあるかと思いますが、Xdでは要素やパーツ=アセットとして
xdファイルがもつドキュメントアセットというデータに登録しておくことができます。
イメージとしては、デザインを構成する設計図をアセットとすると、
xdファイルはそれぞれ独自にドキュメントアセットという設計図を格納するフォルダを持っています。そのxdで使用するアセットはドキュメントアセットに格納される、という構造です。
- アセットを登録する利点
アセットとして登録しておく利点は、
使いまわす場合にアセットパネルからドラック&ドロップで引き出すことができるのはもちろん、
制作途中で「カラーセットの色味を少しだけ変更したい」「ボタンの形が変更になった」等があった場合に
登録しているアセット情報を更新することで、
デザイン画面上にある、アセット情報から配置した要素全てに変更を反映することができます。
一つひとつを修正しなくていいので手間が少なく済みますし、
デザインの規模が大きい程、手間の削減効果が高くなります。
アセットの登録方法
では、実際に登録する方法をみていきましょう。
作業は簡単で、登録したいカラーや文字スタイル等のオブジェクトを【右クリック】します。
【アセットに〇〇を追加】や【コンポーネントにする】等をクリックして完了です。
登録が完了すると、ドキュメントアセットのパネルにアセットが追加されています。
複数ファイルでデザインを管理する場合(アセットとライブラリ)→後日別ページにて公開します
アセットは作業をするxd、1ファイルごとに登録しますが、
デザインデータが広範囲にわたり、複数ファイルで共通のパーツを使いたい場合もあるかと思います。
その場合には、リンクアセットの形で登録することで、ファイルをまたいでパーツ情報の一元管理が可能です。
詳細や具体的な設定方法は後日別ページにて公開します。
結論
アセットとは、繰り返し使う要素やパーツを登録する機能です。
登録すると、要素がいつでも引き出せるようになります。
また、要素の変更を一括で反映できるようになるため、作業効率がアップします。
xdはファイルごとにドキュメントアセットというデータを持っていて、
そのxdで使用するアセットはそこに格納されていきます。
登録方法は、オブジェクトを【右クリック】して、【アセットに〇〇を追加】や【コンポーネントにする】等をクリックして完了です。
ドキュメントアセットのパネルで、アセットが追加されているか確認できます。