Adobe XDをもっと使いこなすヒント! 第10回 シェイプの回転とスタイル(とインタラクション)のコピー

連載

Adobe XDをもっと使いこなすヒント!

この連載では、Adobe XDを便利に使うための様々なテクニックを、Adobe XDチームのツイートからピックアップしてご紹介します。今回は、シェイプの回転とちょっと特別なコピー(スタイル&インタラクション)に関連する4つのツイートを取り上げます。

Tip 1. シェイプの回転

#adobexd #protip Hover outside any resize point (including the center points) to engage the free resize tool for your object. @adobexd pic.twitter.com/BWt0wEDxXS

— Elaine Chao (@elainecchao) July 10, 2018

シェイプを選択すると、角と辺の中央に、小さな円が表示されます。その円をドラッグするとシェイプを伸縮できますが、円のちょっとだけ外側にカーソルを置いてドラッグすると、シェイプの回転操作ができます。どの円の外側でもOKです。

回転操作が可能な位置にカーソルが移動すると、カーソルの形が変化して知らせてくれます。その様子は上のビデオでご確認ください。

Tip 2.シェイプの回転(15°単位)

#adobexd #protip Hold down shift while in free rotation to snap to 15º increments. @adobexd pic.twitter.com/YqnGczTrEK

— Elaine Chao (@elainecchao) July 11, 2018

シェイプを回転する際にシフトキーを押してみましょう。すると、シェイプが15°ずつ回転するようになります。きっちり30°とか45°回転させたいときに便利な機能です。

もちろん、プロパティインスペクタの「回転」のフィールドに明示的に角度を指定して回転させることもできます。

Tip 3. アピアランスのコピー&ペースト

#adobexd #protip Apply the styles from one object to another using the special Paste Appearance command in Design Mode. @adobexd pic.twitter.com/if3PJ0i0ss

— Elaine Chao (@elainecchao) July 12, 2018

上のビデオのように、既存のオブジェクトのスタイルを、他のオブジェクトに適用できます。スタイルを適用したいオブジェクトを選択し、コンテキストメニューを表示したら、「アピアランスをペースト」を実行すれば、コピーしたオブジェクトのスタイルが適用されます。

ショートカットキーは、通常のペースト操作にキーをひとつ追加した組み合わせで、Cmd+Opt+V (Mac) またはCtrl+Alt+V (Win) です。

なお、このショートカットキーをプロトタイプモードで使用すると、「インタラクションをペースト」(参考:第7回 プロトタイプモードでのワイヤーのコピー)になります。モードにより意味が異なるショートカットキーなので、ご注意ください。

ということで、

おまけ. インタラクションのコピー&ペースト

#adobexd #protip You can paste your interaction to multiple objects – simply multiselect in Prototype mode and apply. @adobexd pic.twitter.com/1lJU9XgS3Y

— Elaine Chao (@elainecchao) September 17, 2018

プロトタイプモードでは、コピーしたオブジェクトのインタラクションだけペーストするという操作が可能です。上のビデオのように、複数のオブジェクトを選択してからペーストすると、まとめてワイヤーが設定されます。この点は、ショートカットキーが同じだけあって、「アピアランスをペースト」と一貫した振る舞いです。

いかがでしたか?
これは便利そうだ!という使い方はあったでしょうか?

次回をお楽しみに!