No content

⾃⼰紹介 00 メンバーズキャリアカンパニー 新卒2年⽬・デザイナー XD歴は約1年半 イラレフォトショ歴は約4年 ⽟川 未佑 たまがわ みう 

これからお話すること 00 01 03 04 02 はじめに 共有してみる まとめ 作ってみる 

01 はじめに 

はじめに 01 「XDを使うこと」に 対するハードルを下げる 今回の⽬標 今回は初級編的なお話をします。デザイン系のツールであることや 難しそうなことは⼀旦忘れましょう。 

02 作ってみる 

作ってみる 02 

ツールパネル…ツールを選択できるところ 選択ツール (V) 図形や⽂字を選択する ペンツール (P) パスが書ける(ほぼ使わない) テキストツール (T) ⽂字が書ける(テキストの「T」) アートボードツール (A) アートボード (画⽤紙)を作成 ズームツール (Z) 拡⼤・縮⼩できる(縮⼩は+altキー) ※()内はショートカットキー ⻑⽅形ツール (R) 四⾓形を書く 楕円形ツール (E) 丸を書く 多⾓形ツール (Y) 多⾓形を書く 線ツール (L) 線を書く 作ってみる 02 

ツールパネル…ツールを選択できるところ 選択ツール (V) 図形や⽂字を選択する ペンツール (P) パスが書ける(ほぼ使わない) テキストツール (T) ⽂字が書ける(テキストの「T」) アートボードツール (A) アートボード (画⽤紙)を作成 ズームツール (Z) 拡⼤・縮⼩できる(縮⼩は+altキー) ※()内はショートカットキー ⻑⽅形ツール (R) 四⾓形を書く 楕円形ツール (E) 丸を書く 多⾓形ツール (Y) 多⾓形を書く 線ツール (L) 線を書く 作ってみる 02 ⾒たままのツールを選べば だいたい使える直感的な仕様 

作ってみる 02 テキストや⾊まわりもわかりやすい 

作ってみる〈知っておくと便利〉 02 ①検索機能 レイヤーパネル内の 表⽰を絞ることができる 発展途上の機能かもしれない けれど⽂⾔差し替え後の チェックなどで地味に便利。 きちんとレイヤーに名前を つけて管理しておくと 検索でレイヤーを探しやすい かもしれない。 ここから検索 

②コンポーネント 共通のデザインを持つ要素を管理するための雛形となるもの。 親であるマスターコンポーネントを編集すれば ⼦に当たる他のコンポーネントも⼀括で内容の編集ができる。 →後から「これコンポーネントにしておけばよかった…」と思うことが  意外と多い。 作ってみる〈知っておくと便利〉 02 

プラグインを使ってコンポーネントに差し替える ReplaceItems ※⼀番最後に選択したものがキーオブジェクトになる https://sttk3.com/blog/tips/xd/replace-items-xd.html 選択したアイテムの位置にキーオブジェクトを複製する Adobe XD⽤プラグインです。 作ってみる〈知っておくと便利〉 02 

03 共有してみる 

共有してみる 03 

作ったものをリンクで共有できる リンクを更新 リンクを作成 から作成/更新した または リンクを送るだけで共有できる 共有してみる 03 ※アートボード内の要素のみ共有可能 → XDスタータープラン（無料版）は共有リンクの作成が1つのみ →有料版無料版に限らず  同じPC・同じアカウント・同じファイルでリンクを更新しないと  リンクが上書きされてしまう 

リンクで共有するメリットは？ → 修正などを反映した後、更新ボタンを押せば   そのまま修正後の状態がすぐに   共有されるため、リンクの共有ができれば   何度もファイルを送ることや   ファイルの書き出しの⼿間がなくなる リアルタイムで更新が可能 共有してみる 03 

共有してみる〈番外編〉 03 様々なデータをXDに⼀元化してみる リンクでの共有というよりも XDのファイルをみんなで共有している場合向き デザインはもちろん、プロトタイプ、企画概要やスケジュールなど、 様々なデータを1つのXDファイルの中に集約して1ファイルに 共有すべき情報をまとめることが可能。 

04 まとめ 

まとめ 04 ・ ・ リンクで共有することにより、環境を問わずに リアルタイムでの情報共有が可能になる XDは⼀⾒ハードルが⾼く感じるかもしれないけれど ツールのアイコンなどがわかりやすくなっているため、 直感的に操作をすることができる 

関連資料 Adobe XD Trail 今年の6⽉にリリースされたXDを動画で学ぶ総合学習プログラム https://xdtrail.com/ 「03 共有してみる」で使ったワイヤーフレームのサンプル Sketch・Figma・InVision Studioのファイルもダウンロード可能 https://note.com/yoshikikojima/n/n1b3a10709978 

ありがとうございました