興味があって、実際に簡単なデザイン作業を試してみたい人のために、シンプルなモバイルサイトのデザインおよびプロトタイプ制作の手順を全4パートにまとめたワークショップです。簡単なモバイルサイト(3ページ程度)を制作します。ワイヤーフレームから始めてスタイルを適用し、さらにインタラクションの設定と、デザインの共有を行います。ワイヤーフレームの作成】XDの描画ツールやテキストツールを使って、ワイヤーフレームを作成します。スタイルの適用】ワイヤーフレームにスタイルを適用し画像を配置します。実際に画面遷移の操作ができるようにインタラクションを設定します。画像の書き出しや共同編集によるデザイン作業を行います。font-sizeの継承ができないことが多いです。テキストを選んで文字ツールでクリックしてから次のテキストを入力しようとするのですが、うまくいきません。文字を選択しただけでは、次のテキスト入力にスタイルが引き継がれません。XDでは、最後にテキストのスタイルを「変更」したときのスタイルが記憶されます。使用する文字スタイルは、アセットパネルに登録しておくようにすると便利です。☆カーニングはできますか?Illustratorのようなカーニングは残念ながらありませんが、全体、もしくは、選択した文字間を調整することはできます。Alt/Cmd+矢印キーをよく使います。ショートカットキーの一覧も参考に!☆オーバーレイで開いた画面を閉じるにはどうすればいいでしょうか?オーバーレイを設定したアートボードには、タップすると「前のアートボードに戻る」設定が自動的に行われます。そのため、たとえば、「閉じる」ボタンを押した時のみオーバーレイ表示した画面を閉じたいといった場合を除き、特に設定する必要はありません。☆「ひとつ前のアートボード」のインタラクションでは、遷移する前の表示位置(クリックしたときに表示されていた位置)に戻すことはできますか?こちらは現在はできません。☆背景のぼかし具合や動きをつける部分(ホバーすると色が変わる等)などの情報はどのようにコーダーに共有するのが良いでしょうか?(デザインスペックでは共有できる部分に限りがあるようなので...)ホバーを含むコンポーネントのステート関連の情報は、現在デザインスペックには表示されません。コンポーネントのステートはすべてアセット用のアートボードに並べて伝えるという方法があります。アニメーションの情報については、トリガーをタップで代用して共有することができます。☆リピートグリッドで配置した画像を書き出すときの面倒さを解消できる方法はありますか?リピートグリッドにドラッグ&ドロップで配置した画像は、リピートグリッドを解除しても書き出し対象として記録されているため、これを活用すると最初から設定をやり直さなくても済みます。1/3(長方形)長方形や正方形を描画するには、長方形ツールを選択します。アートボード上で希望のサイズになるまで斜めにドラッグすると長方形を描画できます。キーを押しながらドラッグすると正...UIデザイン繰り返しオブジェクトの作成リピートグリッド機能は、カードUIの様にオブジェクトを繰り返し配置するデザインの作成を効率化します。2/2(画面遷移のアニメーション)画面遷移のインタラクションにはデフォルトで「ディゾルブ」のアニメーションが設定されています。これを「左にスライド」「右にスライド」のアニメーションに変更すると、一覧画面と詳細画面の...プロトタイピングデザインスペックからのデザイン素材の書き出し書き出し用にマークされたレイヤーは、共有リンクから画像としてダウンロードできます。利用条件Cookieについて。