【Adobe XD】余白をつけたアセットの書き出し方法

2018.09.27

こんにちは。sitoです。

先日、kourakuから

「XDで余白をつけてアイコンを書き出すにはどうしたらいいの？」

と聞かれたときに、

「・・・・・・（はて、どうしたらいいんだろう・・・？）」

となったので、その解決策を書きたいと思います。

解決方法：下に透明なオブジェクトを敷く

結局どうやったのかというと、
書き出したいサイズの透明なオブジェクトを敷くことで解決しました！

↓

この透明オブジェクトとアイコンをグループ化して書き出せば、このように余白がついた状態で書き出しできます。

私より先にkourakuが気がつきました。さすがです！

XDは９月のアップデートで「レスポンシブリサイズ」「タイマートランジション」の機能も追加され、引き続き、その進化から目が離せませんね。