Mac

【XD】三角や四角を組み合わせて複雑な図形を作る方法!矢印やひし形を作ろう

xd-object-merge

XDのオブジェクトに「矢印」というものはありませんが、三角と四角を組み合わせて矢印を "つくる" ことはできます。

今回は、複数のオブジェクトを組み合わせて結合させ、ひとつの図形オブジェクトを作る方法をご紹介します。

4種類あるオブジェクトの結合方法

2つ以上のオブジェクトを選択した状態で、右上にある4つのアイコンを選択します。

xd-object-merge_1

すると2つの図形レイヤーがくっついて、ひとつのオブジェクトレイヤーできあがります。

xd-object-merge_2

結合の方法は4種類あり、作りたいオブジェクトに応じて使い分けるようにしましょう。

1.合体:オブジェクト同士を完全にくっつける

これが一番シンプルで、使用シーンも多いと思います。2つ以上の図形を結合させて、ひとつのオブジェクトにします。

図形同士が重なっていても関係なく、選択した図形をくっつけます。その名の通り「合体」ですね。非常にシンプルでわかりやすい。

xd-object-merge_3

矢印を作るときにはこの方法が便利。三角と四角を作って「合体」させるだけで矢印の完成です。

xd-object-merge_4

2.交差:重なった部分を残す

選択した図形同士で、重なった部分だけを残す結合方法です。以下の例だと、黄色と青が交差している真ん中の四角部分だけが残ります。

xd-object-merge_5

正方形をすこし斜めにして重ねて「交差」させてあげるだけで、こんな感じの変わった図形も簡単に作ることができます。

3.型抜き:マスクのように下のレイヤーの一部を抜く

「型抜き」は、マスクのようなイメージを持ってもらうとわかりやすいと思います。

レイヤーとして下にあるオブジェクトに対して、上にあるオブジェクトの分だけを除外します。

xd-object-merge_6

レイヤーの上下関係によって、できあがる形が変わりますので、レイヤーをキチンと整理整頓する必要があります。

xd-object-merge_7

考え方として「ベースとなるオブジェクトを設置して、削りたい形のレイヤーを上に乗せる」と理解するとわかりやすいと思います。

4.中マド:合体しつつ、交差した部分を抜く

「中マド」は、「合体」と「交差」を組み合わせたような方法です。

2つのオブジェクトを「合体」させた形になりますが、図形が重なっている「交差」した部分だけは除外されます。

以下の例だと、形としては「2つの正方形を組み合わせた形」になっていますが、真ん中の重なった部分だけが抜かれています。

xd-object-merge_8

複雑な図形を作る:結合した図形をさらに結合させよう

「結合」の特徴は、2つ以上のオブジェクトを組み合わせて「ひとつの図形」として使えるようになる点にあります。

つまり、結合したオブジェクトは、それ自体が図形オブジェクトになっていますので、それをさらに違う図形と結合させることができるわけです。

たとえば以下のように、まず最初に四角と三角を「合体」させて、ひとつの図形を作ります。

xd-object-merge_9

それをコピペして、さらに真ん中に四角い図形を配置。これら3つの図形をさらに「合体」させて、ひとつの図形にします。

xd-object-merge_10

これを、ベースとなる正方形の図形レイヤーの上において「型抜き」します。すると、食パンなどを止めるアレのような形になります。

xd-object-merge_11

こんな感じで、アイデア次第でいくらでも複雑な図形を形成することが可能です。

また、図形のポイントを増やしたり、曲線を作ったりすれば、もっと自由に図形をつくることができるでしょう。

  • この記事を書いた人

ばんか

Webディレクターとしてサラリーマンをやりつつ、個人でブログや執筆活動をするパラレルキャリアを実施中。 ITツールを日常で活かす方法を広く伝え歩くことをミッションとした「ITツールエバンジェリスト」です。AllAboutやYahooクリエイターズプログラムでも活動中。

-Mac
-, , ,