Adobe XD でのビデオの操作 XD は動画を埋め込んだプロトタイプを作成し、レビュー用に共有できます。XD にビデオを読み込むには、アートボードに動画ファイルをドラッグするか、メニューからファイル/読み込みを選...
Adobe XD での Lottie アニメーションの操作 XD はアートボードに Lottie アニメーションを配置して、プロトタイプとして共有できます。XD に Lottie アニメーションを読み込むには、アートボードにファイルをドラッ...
スタックを使用した動的なデザイン 2/2(スタックの使用方法) スタックはネストして利用できます。例えば、水平方向スタックを有効にしたカード型 UI をいくつか縦に並べてグループ化し、そのグループに垂直方向スタックを有効にすると、スタックがネス...
スタックを使用した動的なデザイン 1/2(スタックの作成方法) スタックを利用するには、グループまたはコンポーネントのレスポンシブサイズ変更を有効にします。次に、プロパティインスペクター内のスタックのチェックボックスをオンにすると、グループのレ...
3D変形を使用したデザインの作成 2/2(3D変形の使用したプロトタイプの作成) 3D 変形はプロトタイプの動きの表現に利用できます。立体感のある動きが欲しいときに有効な使い方です。 まず、同じオブジェクトを配置した2つのアートボードを用意します。次に、どちらか...
3D変形を使用したデザインの作成 1/2(3D変形の使用方法) オブジェクトやグループに対して3D変形を有効にすると、X 軸と Y 軸に沿って回転させたり、Z 軸方向に移動できるようになります。 3D 変形を有効にするには、プロパティインスペク...
オブジェクトの整列、分布 列パネルを使用すると、オブジェクトを整列させたり、等間隔に並べることができます。整列に使用できるオプションは以下の通りです。 上揃え、上下中央揃え、下揃え 左揃え、左右中央揃え、右...
オブジェクトの配置 Adobe XD ではオブジェクトを描画すると、描画した順に手前に表示されます。 レイヤーパネル内のレイヤーは、オブジェクトの重なり順に並べられています。最前面に表示されているオブ...
オブジェクトの移動 オブジェクトの移動には、いくつかの方法が利用できます。 マウスをつかってオブジェクトをドラッグ キーボードの矢印キーを使用 プロパティインスペクターに XY 座標を入力 マウスを使...
オブジェクトの複製、コピー、反転 オブジェクトを複製するには、目的のオブジェクトを選択し、Opt/Alt キーを押しながら選択されたオブジェクトをドラッグします。Mac では編集/複製をクリックしてオブジェクトを複...
オブジェクトのグループ化、ロック 複数のオブジェクトをグループ化すると、まとめて移動や拡大縮小したり、線の塗りなどのプロパティを変更できます。グループ化するには、対象のオブジェクトをすべて選択した状態で右クリックし...
シェイプの合成 単純なシェイプの組み合わせから複雑なシェイプを作成することができます。そのためには、組み合わせたいシェイプを選択し、プロパティインスペクター内の次のいずれかのオプションをクリックし...
グリッドの操作 Adobe XD では、方眼グリッドとレイアウトグリッドの 2 種類のグリッドが利用できます。方眼グリッドはマス目に沿って、レイアウトグリッドはカラムに沿って、オブジェクトを整列し...
アートボードの操作 2/2(サイズ変更、移動、ズーム) アートボードを選択するには、選択ツールを使用して、アートボードのタイトルをクリック、またはアートボードの背景をダブルクリックします。Mac では Cmd+3 、Windows では...
アートボードの操作 1/2(作成、名前の変更、スクロール) XD ドキュメントには複数のアートボードを含めることができます。モバイル、タブレット、デスクトップ用など異なるサイズのアートボードを並べることもできます。アートボードの作成は、事前...
スクロールグループの作成 スクロールグループを使用すると、アートボード内に、独立したクロール領域を定義できます。水平方向、垂直方向、または両方向へのスクロールを指定できます。 スクロールグループを作成するに...
スクロール可能なアートボードの作成 アートボードの長さが足りないために、コンテンツをすべて配置できない場合、アートボードを長くしてスクロール可能にすることができます。アートボードを縦に伸ばすには、アートボードの下辺を...
ブレンド効果の適用 Adobe XDのブレンド効果を使用すると、複数レイヤーを組み合わせて、目を引くユニークな効果をつくり出したり、画像を自然に合成することができます。 ブレンド効果はデフォルトでは「...
ぼかし効果の適用 Adobe XDでは、オブジェクト全体をぼかしたり、オブジェクトにぼかしマスクを追加することができます。 オブジェクト全体をぼかすには、ぼかしたいオブジェクトを選択してから、プロパ...
レイヤーの操作 1/2(レイヤーパネルの表示、検索と絞り込み) Adobe XD のレイヤーパネルを開くと、アートボード一覧を表示したり、作業中のアートボードに関連付けられたレイヤーを確認できます。レイヤーパネルにアクセスするには、ツールバーの...
レイヤーの操作 2/2(追加、並び替え、グループ化、名前変更など) ドキュメント内のオブジェクトは、それぞれ個別のレイヤー内に配置されます。そのため、レイヤーをグループすると、それらのレイヤーに含まれるオブジェクトをグループ化できます。レイヤーをグ...
描画ツール 1/3(長方形) 長方形や正方形を描画するには、長方形ツールを選択します。アートボード上で希望のサイズになるまで斜めにドラッグすると長方形を描画できます。Shift キーを押しながらドラッグすると正...
描画ツール 2/3(楕円形、多角形) 楕円や円を描画するには、楕円形ツールを選択します。アートボード上で希望のサイズになるまで斜めにドラッグすると楕円を描画できます。Shift キーを押しながらドラッグすると円を描画で...
描画ツール 3/3(線、ペン) 線ツールを選択し、始点をクリックして終点までドラッグすると、直線を描画できます。Shift キーを押しながらドラッグすると、水平、垂直、45度の線を描画できます。 ペンツールを使用...
オブジェクトの選択、サイズ変更および回転 1/2(選択) オブジェクトを選択するには、選択ツールを使い、目的のオブジェクトをクリックします。複数のオブジェクトを選択するには、選択ツールをドラッグして選択範囲を指定するか、Shift キーを...
オブジェクトの選択、サイズ変更および回転 2/2(サイズ変更と回転) オブジェクトのサイズを変更するには、オブジェクトを選択して、丸形のハンドルをドラッグします。サイズ変更時にアスペクト比を固定するには、プロパティインスペクターでロックアイコンをクリ...
オブジェクトの塗り、線、ドロップシャドウの設定 1/3(塗り) Adobe XD でオブジェクトへカラーの塗りを適用するには、まずオブジェクトを選択して、次にカラーピッカーを表示します。 カラーフィールドとカラースライダーを使用して色を調整する...
オブジェクトの塗り、線、ドロップシャドウの設定 2/3(線、アウトライン) Adobe XD でオブジェクトへ線を適用するには、まずオブジェクトを選択します。プロパティインスペクターで「線」が有効になっていると、カラーピッカーを表示して色を変えたり、サイズ...
オブジェクトの塗り、線、ドロップシャドウの設定 3/3(ドロップシャドウ、シャドウ内側) Adobe XD でオブジェクトにドロップシャドウを追加するには、対象のオブジェクトを選択し、プロパティインスペクターの「ドロップシャドウ」をクリックして有効にします。 ドロップシ...
テキストツール 1/2(テキストの作成と編集) テキストツールを選択し、テキストを開始する場所をクリックすると、テキスト入力を開始できます。Esc キーを押してテキストの変更を確定するか、Return キーを押して次の行に移動す...
テキストツール 2/2(その他の機能) テキスト変換として適用可能なオプションには、テキストを「すべて大文字/小文字にする」、「単語の先頭の文字のみ大文字にする」、「上付き文字や下付き文字にする」が用意されていあます。テ...
繰り返しオブジェクトの作成 リピートグリッド機能は、カードUIの様にオブジェクトを繰り返し配置するデザインの作成を効率化します。 繰り返し配置したい一連のオブジェクトを選択し、リピートグリッド機能では、オブジ...
デザイン素材の書き出し Adobe XD からデザイン素材を PNG、SVG、JPG、PDF 形式で書き出せます。書き出したいオブジェクトを選択し、ファイル/書き出し/選択したオブジェクトを選択するか、シ...
レスポンシブサイズ変更とレイアウトの制約 近年では数々な解像度を持つデバイス向けのデザインを作成する必要があります。Adobe XD のレスポンシブサイズを使うと、オブジェクトのサイズを変更する際、オブジェクトの関係を維持...
コンポーネントへの複数ステートの追加 1/3(ホバーステート) コンポーネントに複数のステートを追加すると、ユーザーの操作によって外観が変化するインタラクティブなコンポーネントを開発できます。 ステートを持つコンポーネントの代表的な例には、ボタ...
コンポーネントとグループへの固定パディングの設定 Adobe XD では、グループまたはコンポーネントに固定パディング値を設定できます、パディングを固定すると、コンテンツに応じて自動的に背景の大きさが変わります。たとえばラベルに合...
コンポーネントへの複数ステートの追加 2/3(インタラクションの追加) コンポーネントのステートにインタラクションを指定して、タップ操作で表示するステートを切り替えることが可能です。アートボード間のインタラクションと同様の指定を行いますが、接続先にステ...
コンポーネントへの複数ステートの追加 3/3(リピートグリッドでの応用) マスターコンポーネントに追加されたステートは、そのコピーであるインスタンスでも利用できます。リピートグリッドにインスタンスを配置すれば、複数インスタンスの配置を一度にまとめて行えま...
デザインの共同編集 Adobe XD では、他のデザイナーとのリアルタイム共同編集から、関係者やユーザーの協力によるフィードバックの収集まで、デザインプロセスのあらゆる段階でエンドツーエンドの共同作業...