【XDアウトラインの罠】複数色のテキストをアウトライン化すると文字色が一色になる問題を解決

皆さんXDを使っていますか？

XDとはシンプルなUIでワイヤーフレームから本格的なデザイン作成、更にはデザインのURLを発行して他者にも気軽に見せることが出来たり、その他にも色々な事ができるデザインツールです。

業務で使っているのですが、困ったことが起きました。
複数色を使っているテキストをアウトライン化したら何故か一色になってしまいました。

この問題を解決している記事も少なかったので原因を解説してきます。

状況

例えば２色のテキスト（ユーザーファースト第一）を画像化する為にアウトライン化しようとします。

すると下画像のように「第一」だけに適用したはずの色が全体に適用されています。

原因

XDのバグのようです。
検証した結果、複数色使用した場合にアウトライン化した場合、末尾の文字色に合わせてすべて同じ色になります。

解決策

強引に解決します。
テキストのブロックを色の数だけコピペして以下２つに分割します。

1. ①色を変えたテキスト
2. ②色を変えていないテキスト

分割したら①と②を結合させます。完成。

まとめ

テキストをアウトライン化して色がおかしくなったら複数色使っている事が原因になります。回避策は別々のテキストブロックに分けて結合することです。

XDは軽量で使い勝手もいい最高のデザインツールですが、比較的新しいツールで新しい故のバグも潜在化しています。

早くアップデートで修正してもらうことを願います。