フレームワーク制作はAdobe XDで

『WordPressはじめました』でも書きましたが、
3Do Design(8/18追記:最初に作ったサイトに飛びます)のフレームワークはAdobe XDで作りました。

このAdobe XDというアプリケーション、正式名称はAdobe Experience Design CC
2016年8月14日現在ではプレビュー版 v.0.5.10。正式リリースまで、ユーザーの意見を取り入れ、毎月アップデートされています。

Adobe XDのサイトによると、

Webサイトやモバイルアプリのデザインとプロトタイプ作成が、これ1本でできるAdobe Experience Design CC(旧Project Comet)は、UXデザイナー向けの初めてのオールインワンツールです。

静的なフレームワークだけでなく、PCやスマホで画面遷移の確認ができるように
簡単に設定することができます。

そして、同じようなデザインを作る場合に超便利なリピートグリッド機能。
コピペなんて不要! 複数の違う画像も個別に反映される素晴らしいですね。
言葉だけだとわかりずらいので、動画で。

【関連リンク】

『アドビの新しいUXデザインツール、Adobe XD (Preview 1) 登場!使い方をクイックに解説』

『Adobe XD Preview 2 リリース!テキストデータのダイレクト読み込みやグリッドなど』

『Adobe XD Preview 3 リリース!アートボードのスクロールやテキストの部分スタイリングなど』

『Adobe XD Preview 4 リリース!日本語UI、オブジェクト間の距離計測、ぼかし機能など』

『Adobe XD Preview 5 リリース!ズームツール、前のアートボードへ戻る設定、PDF書き出し、パワポからのコピペなど』


3Do Designのフレームワークは1ファイルでPC表示とスマホ表示を作りました。

【デザインビュー】
Adobe XD デザインビュー

【プロトタイプビュー】

Adobe XD プロトタイプビュー

クライアントに画面で確認してもらうための共有リンクも簡単に書き出せます。

3do_design_framework_link
こちらが書き出したリンク
http://adobe.ly/2arLv7e

左上のロゴをクリックするとスマホ表示、PC表示が行ったり来たりするだけですが、
スマホ表示を実際のスマホで見ると画面にジャストフィットするので、
スマホで見たときの文字の大きさなどもこの段階で確認できます。

また、Illustratorなどのようにバージョンアップを何年も重ねてきたアプリケーションではなく、
1から開発したアプリケーションなのでサクサク動きます。

Illustratorでフレームワークを作るのは古い!
昨今、縦に長いサイトが多い世の中。縦長にできないフレームワークを作るのはPower Pointではできないですしね。
しかも、思うようにキレイに作れませんし。。。
フレームワークとは言え、デザイナーですから人に見せるのはキレイな状態で見せたい!
そして、Adobe XDならそれが簡単にできる! 素晴らしいですね。
これから、フレームワークはAdobe XDで作っていきます!

あっ、あと今はWindows版ないですけど、リリースされる予定はあるみたいです。

それから、毎週木曜日20時からYou tubeライブ放送で配信されている
CREATIVE CLOUD道場、この番組の早ツイートクイズの賞品が昨日届きました!
ありがとうございました!

Adobe ノベルティ

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です