実技 XD実習②

By 実技 XD実習

-本日のアジェンダ-

1限目
実技 XD実習②
XDの便利な機能について

2限目
実技 XD実習②
共有リンクについて

3限目
実技 XD実習②
課題制作

4限目
実技 XD実習②
課題制作

5限目
実技 XD実習②
課題制作

本日のテーマ

XD総まとめです。

Adobe XD とは？

Adobe XDは、アドビシステムズが販売しているベクターベースのプロトタイピング作成ツールである。 ウィキペディア

参考サイト

シェイプマスクについて

マスクとは、XDドキュメントのコンテンツを部分的に隠す機能です。 大きな画像の一部のみを見出しとして表示するのにも使用できます。XD. でマスクを作成するには、画像などの素材をシェイプにドラッグする方法と、ドキュメント内のコンテンツのマスクとしてシェイプを使用する方法の2つがあります。

参考サイト

リピートグリットについて

画像サイズを変更すると、要素内のすべての画像が自動的にサイズ変更されます。 例えば一覧ページや、サイドメニューなど同じレイアウト、スタイルのコンテンツをくり返す場合に使うことができます。

参考サイト

補足情報

XDはまだまだ発展途上段階なので、便利な部分もあれば、まだまだ使い勝手の悪い部分もあります。ただし日々アップデートされているのでたまに様子を見てみてください。

参考サイト

補足情報2

グリッドデザインとは？

グリッドレイアウト(グリッドデザイン、グリッドシステム)はホームページのデザイン手法の一つで、画面やページを縦横に分断する直線で格子状に分割し、これを組み合わせてブロック内の要素の大きさや配置を決定していく方法のことです。 … もともとこのようなレイアウト手法は、新聞や雑誌などの印刷物でよく見られるものです。

参考サイト

XDのリンクについて

XDでは、ページデザインに加え、クリックなどでページ遷移をして実際のWebサイトのように操作できる「プロトタイプ」という機能があります。 … PCとスマートフォン、タブレットをUSBでつなぎ、プレビューの左隣にあるスマホのアイコンをクリックすると、実際のモバイルデバイスでもプロトタイプの確認が可能です。

参考サイト

XDの共有について

共有する Adobe XD ファイルを開きます。 「共有」をクリックして、共有モードに切り替えます。 プロパティインスペクター／表示設定から、デザインレビューを選択して、デザインまたはプロトタイプに関するフィードバックを取得します。 デザインやプロトタイプを共同編集者と共有する場合は「開発」をクリックします。

参考サイト