design

この記事ではAdobe XDでWEBサイトで良くあるスライダー式のメインビジュアルを表現する方法を紹介します。XDを使用すれば約5分と超簡単にスライダーを表現する事が出来ます。 ディレクション時や先方や外注先にスライダーの動きを伝えたい時などに便利なので是非覚えてみて下さい。

この記事ではAdobe XDでWEBサイトで良く使われているグローバルナビゲーションのUIデザインの作成の仕方を紹介します。 またより理解しやすくするために、今回紹介するサンプルのXDデータも配布しています。 実際のデータを確認して実際にいじってみるのが一番理解できるかと思います。

この記事では春夏秋冬の各々のイメージを連想させる色をまるっと紹介します。カラーコードの詳細情報も載っけていますがXDファイルを無料で配っていますので、そっちで確認する方がお勧めです。

今回は、Adobe XDで3D調の地球オブジェクトと「Paris」や「New York」などの都市名をリンクさせて、地球がリアルタイムで回転し該当部分にピン立てしてくれるアニメーションを作りました。

今回はAdobeXDでWEBサイトに良くあるあるタブで切り替える要素を表現する方法を分かりやすく紹介します。 WEBサイトでは結構ある要素なので、XDで表現できると便利な場面もあるので基本的な部分は頭に入れておきましょう。

今回はAdobe XDで音楽サイト風の3Dギャラリーを作成してみました。 最近流行っているUI/UXなので基本となる考え方とデザイン表現の見本になって頂ければ幸いです。

今回はAdobe XDを使って、WEBでよく使用されるライトボックス（ポップアップ）の表現の仕方を紹介します。 ライトボックスはCSSのz-indexとpositionプロパティでコーディングされ、画面を覆う様（オーバーレイ）に表示されるのが一般的な方法です。 今回はなるべくWEBの挙動に近いオーバーレイをXDで使って表現します。

今回は、Adobe XDを使ってスクロール可能な多項目あるドロップダウンリスト（プルダウンメニュー）を作成する方法を紹介します。

今回はXDを使ってオブジェクトがくるっと回転するアニメーションの作成の仕方を紹介します。 アニメーションはプロトタイプを利用すれば簡単なのだが、回転アニメーションに関しては若干癖のある作り方です。ただやり方を理解すれば超簡単に作成できます。