emuramemo

製品レビュー、HTML/CSS、webデザイン、音楽、その他いろいろ

WindowsでAdobe XD(ベータ版)を使ってみた感想(2017年4月現在 ※7月7日更新)

WindowsでもAdobe XD(ベータ版)がインストールできるようになったので使ってみました。2017年4月現在の感想をずらずらと書いておきます。

 

Adobe XDとは?

UI/UXのデザインからプロトタイプの作成、共有まで。すべてを1つのアプリケーションで. Adobe Experience Design CC(ベータ版)(以下、Adobe XD)

Adobe Experience Design CC | Adobe UXプロトタイプ制作ツールのダウンロード

 

Adobeが2016年に出した新しいツールです。しかも無料

 

今回、ワイヤーフレームの作成のためにXDを使ってみましたが、

はじめに結論を書いておくとWindows版XDはは2017年4月の現段階で、いい感じだけどまだ実務で使うにはつらいかなぁというのが第一印象です。

4/20 追記:4月20日のアップデートで日本語化され、かなりとっつきやすくなりました。

7/7 追記:6月のアップデートでシンボル・レイヤーなど主要な機能が使えるようになりだいぶMac版に近づきました。ワイヤー制作ツールとして十分に使えます!

 

 

 

 

なぜ、まだまだ実務で使いづらいのか?

Windows版はMac版より開発が後発なので、すべての機能がまだ使えません
まだ実装されていない機能が優秀なだけあって致命的に感じます。

7/7 追記:Mac版と同じように主要な機能が出揃いました

 

 

以下のリンクの下の方にWindows版で現在使える機能一覧表がありますので参考に。

Adobe XD の Windows サポート

 

Windows版のリリース情報も随時上がっているので要チェック。

Adobe XDベータ版3月リリース!コメントの解決済み設定やWin10版でのズームツール、Ps/Aiからのコピーなど | Adobe Creative Station

Adobe XD ベータ版 2月リリース!コメントのピン留め、プロトタイプ共有(Win)など | Adobe Creative Station

 

 

 

Windows版XDが2017年4月現在対応していなくて不便だったところ

後に改修されるでしょうが、とりあえず。

 

7/7 修正シンボル化ができない→シンボル化に対応

パーツをシンボル化しておくと、あとからの調整作業が楽になりますし、それがデザインのガイドラインにもなります。モジュール化みたいなものです。

シンボル化ができないと同じパーツを何度も作らないといけなかったり、後から修正したい場合に大変。

 

気になるのはプロトタイプ制作時に、ヘッダーなどの共通ナビのリンクもシンボル化することでリンクをいちいちつなぎ合わせる問題は解決できるのでしょうか?

 

 

7/7 修正PDF書き出しができない→PDF書き出しに対応

クライアントに確認してもらう時にはPDFで渡すのが便利だと思います。

7/7 追記:6月のアップデートで対応されました!書き出ししたPDFからはテキスト情報をコピーできるので便利!

 

現在のWindows版の書き出し方法はPNGとSVGのみPDFも対応済み

試しにSVGで書き出してIllustratorで開いてみると、グループ化した部分とリピートグリッド化した部分が空白になり、うまく書き出しできませんでした。実質使えるのはPNG書き出しのみですね。

 

XD本体をクライアントにインストールしてもらうのもなかなかの手間なので、XDビュアーみたいなソフトがあればよさそう。

4/20 追記:シェア機能を使えば、ネット上でプロトタイプを共有・確認できるのでいちいちPDF化する心配がなくなりました。

 

 

4/20 修正コメント機能がない→シェア機能でコメント可能

Mac版にはコメントを設置できる機能があるらしいのですが、Windows版では現在確認できず。。

XDのシェア機能を使うことでコメント機能が使えるようになるみたいです。その提案に対して、解決・未解決でコメントを分類することが可能。

 

 

コピーペーストの互換性

XD→Illustratorへの貼付けはできませんでした。Illustrator→XDの貼り付けはできるものの、テキストデータが分解されてしまったり、少し使いづらい。

 

 

 

Adobe XDの便利なところ

便利なところを知ると、応援せざるを得ません。

 

リピートグリッドがすごい

スーパー便利です。コピーペーストの概念を超えたのではないでしょうか。

繰り返しコンテンツを作成する時は作業効率がかなり良くなります。

 

 

プロトタイプ機能が楽しい

ワイヤーづくりにもってこいの機能。感覚的にページをつなぎ合わせるのが簡単で楽しい。そしてプレビューするのも楽しい。

しかし、ページが増えると共通ヘッダーのリンクをどうするのだろうという疑問も。シンボル化で解決可能か??

 

 

スマートガイド(?)がよい

Illustratorのスマートガイドをもっと見やすくシンプルにした感じ。

オブジェクトを移動させる時に、整列や余白のピクセル数の表示をサポートしてくれるので、感覚的にコンテンツをきれいに並べることができます。

 

 

色の管理が楽

f:id:emj1025:20170707142629p:plain

よく使う色をカラーピッカーウィンドウにシンプルにまとめられるので、いちいちスポイトで色を探す手間がかなり短縮されます。

 

 

軽い

アートボードを増やしてもサクサク動く。

Illustratorはアートボードを増やすと画像を埋め込んでいないにも関わらず重くなってしまうのでXDの軽快さはよいですね。

 

 

 

XDの操作感や気になったところ

これらもある程度は改修されるとは思いますが。

 

動作が不安定

IllustratorやPhotoshopに比べるとクラッシュする事がちょくちょくあります。

フリーズしたのかな?と思うと突然動いたりするのでローディングなどインジケータがほしい。

7/7 追記:ファイルを開く時、インジケータが表示されるようになりました

 

4/20 修正テキストが英語しか打ち込めない→日本語化対応

テキストは外部から持ってきて貼りつけろってこと?もしかして設定で解決できるのかしら?そもそもWindows版はまだ日本語化されていません(英語でもだいたい感覚で使えますが)。バージョンアップで解消されるのを待ちます。

f:id:emj1025:20170420222357p:plain

4/20 追記4月20日のアップデートで日本語入力できるようになりました!メニューも日本語化されました。

 

会社のPCで試した所、また英語しか入力できなかったのでIMEを切り替えてみると日本語で打てるようになりました。Google日本語入力との相性が良くないのか、なんなのか…(自宅のPCもGoogle日本語入力)。

 

7/7 追記:XDでGoogle日本語入力を使うと英語しか入力できないときの対処方法

どうやらWindows7→10へアップデートした時に起こる固有の問題のようでした。

Twitterで以下の記事で解決できると教えていただきました。無事解決。

Windows 7 から Windows 10 へアップデート後、Edge やコルタナなどで、Google 日本語入力が利用できない場合の対応方法

 

 

 

テキストをコピペすると改行が増える

エディタで打ち込んだテキストをXDに貼り付けると改行が倍になります。

7/7 追記:不要な改行が増えないように修正されておりました。

 

文字サイズの変更方法

わざわざキーボードで数値入力しないといけない?と思いきや、数値の選択中にマウスカーソルを上下にドラッグすれば値が変わります。IllustratorやPhotoshopと同じようにプリセットされた数値をセレクトする形式がよかったような。でもこれはこれで使いやすい。

 

選択ツールへの切り替え

ctrl押下時にカーソルが選択ツールに切り替わりません。IllustratorやPhotoshopと統一してほしかったです。そのため慣れるのに少し時間がかかりました。今のところ「v」で切り替えています。

 

 

 

XDだけでデザインは完結できるのか?

フラットデザインなら可能。といった感じでしょうか。

 

角丸、シャドウ、画像のブラー(ぼかし)はXDで可能ですので、シンプルな図形と写真で成り立つような最近のサイトには向いていると思います。

 

XDは細かい調整が苦手ですのでビジュアル的に見せたいものは他のソフトを使って加工したり、素材を事前に用意する必要があります。

 

個人的にはあくまでワイヤー制作用かなという印象でした。

 

 

今後、装飾関係の機能もアップデートされるみたいです。

UXデザインツール、Adobe XD (Preview) は毎月アップデート ー 気になる今後の追加機能は? | Adobe Creative Station

 

完成形に近づいたら無料で使うのが不安になりそうなくらい。途中で頓挫したりしてFireworksみたいにならないことを祈ります…。

 

 

 

みんながXDを使うようになるか?

Adobeの最近の傾向として、なんでもかんでもCreative Croud(CC)のプラットフォーム内に囲い込んでしまって、Adobe製品愛用者以外の人がAdobeのソフトを使いにくくしている印象を受けます。

 

デザイナーだけでなくでディレクターも使えそうなツールなので、このフットワークの重さが今後どう響くのか気になるところ。

4/20 追記シェア機能を使うことでXDをインストールしていない人にも閲覧してもらえるし、コメントつけることも可能なようです

 

 

 

さいごに

ワイヤーフレームを作る時、いまいち、どのツールが最適なのか自分の中で定まっていません。現在、自分が作るときはIllustrator。他社からもらうときはExcelだったりPowerPointだったりもします。Cacooは一度使ってみたけど操作感に馴染めずあきらめました。

 

現在、Windows界隈ではワイヤーフレーム作成ツールがしっちゃかめっちゃかな状態です。


XDに似たツールでSketchが有能という声をよく聞きますが、こちらはそもそもWindows版がありません。ということはAdobeさん、XDをWindowsユーザーに広めるのは今がチャンスです! 

 


とにかく、アップデート楽しみにしています!

 

 

Adobe Creative Cloud コンプリート 2017年版 |オンラインコード版|12か月版|Win/Mac対応

Adobe Creative Cloud コンプリート 2017年版 |オンラインコード版|12か月版|Win/Mac対応

 

 

emuramemo(c) All Rights Reserved.