シェア
濱口 まさみつ
2021年7月5日 19:00
2021年6月7日にXDのアップデート【XD41】がリリースされました。アップデートで追加された機能は下記になります。 ①シャドウ（内側） ②パスのアウトライン ③円錐形グラデーションシャドウ（内側）などは、下の図の検索入力フォームのようなニューモーフィズムデザインのくぼんだパーツも再現できます！■ニューモーフィズムとは：ベース（背景）から要素が押し出されていたり、窪んでいたり
2020年9月24日 19:28
前回は「スタック」を使ってオブジェクトの並び順や間隔を調整しました。今回は「デザイントークン」について説明します。【追加機能-3】デザイントークン「デザイントークン」は、カラーや文字スタイルに任意の名前を付けられる機能で、共有機能を使用してCSSをダウンロードすることができます。デザイナーはXDのアセットパネル上でカラーや文字スタイルにカスタム名を追加でき、変更された内容もWEB上
2020年9月14日 19:00
今回はヘッダーにインタラクション（動的要素）を付けていきます。XDではインタラクションを付ける時にステート機能を使います。ステートとは「状態」のことを指し、ホバー状態やクリック状態など、ユーザー操作によって変わる様々な状態のデザインをXDは作ることができます。この回では、メニューにホバーした時のインタラクションを付けてみたいと思います。具体的には、ホバー時に下線を表示する方法と、ドロップダウ
2020年8月18日 19:21
前回は「スクロールグループ」を使って、画像をいろいろな方向に自由にスクロールできる機能を紹介しました。今回は「スタック」を使ってオブジェクトの並び順や間隔を調整していきます。【追加機能-2】スタック「スタック」は、複数あるオブジェクトの並びを簡単に入れ替えたり、他のオブジェクトとの間隔を保ちながらオブジェクトの大きさを変更できたりします。①オブジェクトの入れ替えはじめにオブジ
2020年7月10日 19:50
プロトタイプとは？Webデザインにおけるプロトタイプ（模型試作）とは、画面遷移やボタン操作など、アニメーションも含まれるデザインの事を言います。今までは、ワイヤーフレームなどの平面デザインが中心でしたが、近年様々なデバイスが増えてきたことで表現の多様化が進み、1枚絵だけではデザインを表現することが難しくなってきました。そこで、見た目だけでなく、操作感やユーザー満足度を考慮したデザインをする上
2020年7月27日 21:28
Adobe XDは2020年6月に更新があり、下記機能が追加されました！ １．スクロールグループ ２．スタック ３．デザイントークン他にも共有リンク機能などが強化されています。今回はこれらの機能を２回に渡って実例でご紹介します。（その１）では「スクロールグループ」を使って画像などのコンテンツをスクロールできるようにします。追加された便利な機能を使いこなして、効率的にデザインして
2020年8月11日 11:12
前回はプロトタイプとは？という話とXDでアートボードを作成しました。今回からはWebコンテンツを作っていきます。まずはヘッダーメニューを作成してみましょう。ヘッダーのベース部分を作成する■長方形を描画するツールの [長方形] に持ち替えてください。アートボードの左上からドラッグし、ヘッダーのベースを描画します。幅は1920px、高さは100pxとなるよう調整します。マウスでの調整が難し
