【Adobe XD】テキストを縦書きにするプラグイン「Tategaki for Adobe XD」の使い方

こんにちは、ryohei(@ityryohei)です!

本記事では、Adobe XDでテキストを縦書きにするプラグイン「Tategaki for Adobe XD」のダウンロード・インストール~簡単な使い方をご紹介しています。

Adobe XDでテキストを縦書きで表示したいんだけど、どうすればいいの?

上記の疑問にお答えします。

では、解説していきます。

Adobe XD用プラグイン「Tategaki for Adobe XD」でテキストを縦書きにしよう!

Tategaki for Adobe XDは、Adobe XD用のプラグインです。個人の方が開発しているプラグインで、Adobe XDにプラグインをインストールするだけでテキストを縦書きにする機能を追加することができます。

現状、Adobe XDにはテキストを縦書きにする機能がないため、縦書きの機能を追加したい場合はこちらのプラグインをインストールすることが必要となっています。

私もインストールしてみましたので、ダウンロード・インストール~使用方法まで詳しくご紹介していきたいと思います。

「Tategaki for Adobe XD」をダウンロードする

Tategaki for Adobe XDをGitHubからダウンロードします。下記のURLにアクセスしてください。

Tategaki for Adobe XD:https://github.com/ashryanbeats/tategaki-for-xd

Codeと表示されたボタンをクリックし、Download ZIPを選択してプラグインをダウンロードします。(下記画像の赤枠部分です。)

ZIPファイルが保存出来たら、プラグインのダウンロードは完了です。続いてダウンロードしたプラグインをインストールします。

「Tategaki for Adobe XD」をインストールする

前項でダウンロードしたZIPファイルの拡張子を.zipから.xdxに変更します。具体的には下記のように変更します。

tategaki-for-xd-master.zip → tategaki-for-xd-master.xdx

拡張子を変更したtategaki-for-xd-master.xdxをダブルクリックします。実行すると、Creative Cloud Desktopが起動します。下記のように順にメッセージが表示されますので、それぞれ承認側の青色のボタンをクリックしていきます。

プラグインを確認できませんでした。

「Tategaki」プラグインをインストール

インストール完了

Creative Cloud Desktopのプラグイン管理で緑色のアラートが表示されたら、プラグインのインストールは完了です。Adobe XDを起動して、テキストを縦書きにしてみましょう。

「Tategaki for Adobe XD」でテキストを縦書きにする

Adobe XDを起動し、テキストツールでテキストを入力します。入力したテキストを選択した状態で、ツールバーから下記を選択します。

プラグイン > Tategaki > テキストを縦書きにする

XD上では下記の位置にあります。

テキストを縦書きにするを実行すると下記のようにテキストが縦書きになります。

これでテキストを縦書きにすることができます。

最後に

GitHub上で公開されているソースは、ブラウザ場でソースの内容を確認することができます。本記事でご紹介したプラグインの処理内容を見ていると、テキストを一文字ずつに分解して、各文字の後ろに改行コードを付与する処理が記述されていました。もし縦書きにするケースがほとんどない場合は、プラグインをインストールするのではなく、テキストを一文字ずつ改行するだけでも良いかもしれませんね。

以上、Adobe XDのテキストを縦書きにするプラグイン「Tategaki for Adobe XD」の使い方のご紹介でした!

おすすめの書籍

Adobe Creative Cloudを通常価格で購入していませんか?

Adobe Creative Cloud(Adobe CC)はAdobe社が提供するクリエイター向けのサービスです。WEB制作の幅を広げる「Photoshop・Illustrator・XD」Youtuberや動画クリエイターの編集作業に欠かせない「Premiere Pro・After Effects」など全20以上のアプリが提供されており、幅広いプランが用意されています。

コンプリートプランはAdobe CCの全20以上のアプリが使用できるプランです。多くのアプリが使用できるため定価で購入すると年間7万円以上するプランですが、デジタルハリウッドのAdobeマスター講座では「基礎動画教材+Adobe CC コンプリートプラン(12ヵ月)」がセットになって39,980円(税込)で利用できます。定価より安価にAdobe Creative Cloudのライセンスを購入でき、以降のライセンス更新も可能。動画教材で基礎スキルを習得できるので、入門する方にも便利な講座です。詳しくは下記のリンクからチェックしてみてくださいね。