Adobe XD CCでシンプルなシェイプからアイコンを描画し、それをシンボルにしてデザイン内で簡単に変更できるようにします。
create-map-pin-icon_1000x560

2つの同心円からマップピンを描画し、ブール演算を使ってシェイプの型抜きをします。Ctrl(またはCommand)キーを押しながら外側の円をクリックして選択します。次に、シェイプに変換するためにダブルクリックしてアンカーポイントを表示します。下のアンカーポイントを引き下げて、ダブルクリックして曲線パスから直線パスに変換します。最後に、アイコンに塗りのカラーとシャドウを適用します。

create-map-pin-icon_step1

デザイン内で繰り返し使用できるようにマップアイコンをシンボルに変換します。アイコンをクリックし、アセットパネルでシンボルの横にある「+」をクリックします。ラベルをダブルクリックし、後で探しやすいように名前を変更します。デザイン内で必要なだけアイコンを配置します。

create-map-pin-icon_step2

アイコンをシンボルにすると、カラーやスタイルをいろいろ試すことができます。ひとつのシンボルのアピアランスを変更すると、デザインに配置したすべてのシンボルに反映されることを確認します。

create-map-pin-icon_step3

このアプリのデザインでは、このマップピンのスタイルが気に入りました。

create-map-pin-icon_step4

このように、いくつかの基本的なシェイプとシンボルを使ってアプリのアイコンを作成できます。

11/12/2018

Adobe Stock提供元:ty

 

このページは役に立ちましたか。