もうやめられない！プロトタイプツール Adobe XDの魅力に迫る。

お昼休みが終わっての13:00からの洞窟ステージでは、DREAM RETOUCHの曽川 稔さんによる「もうやめられない！　プロトタイプツール Adobe XDの魅力に迫る。」と題して、Adobe XDのセッションが行われました。そちらのレポートです。

曽川さんは、ご自身のお仕事の他に大分クリエイターズという団体で大分のクリエイターを盛り上げるべく、勉強会やセミナーを企画し登壇も行われていらっしゃいます。昨年のクリエイティブハントでは参加者の一人としてご参加いただきましたが、この度はご登壇者様としてのご参加いただきました。

大分クリエイターズ https://t.co/3JiNMItJ4E 行きたい！ #ゴーハント

— 山本一道@アップルップル (@kazumich) October 27, 2018

Adobe XDとは

Adobe XDは2017年に正式版がリリースされた、プロトタイプを作ることができる、利用者の声を元に毎月バージョンアップされているアプリケーションです。
実は、2017年版のAdobe XDは機能としては充実しているとはいえませんでした。その後、数々のバージョンアップを重ね、非常に使いやすいアプリケーションとなりました。

山口でXDのセッション聞けるの良い #ゴーハント

— Basashi (@dream_exp) October 27, 2018

フリーランスだからこそ感じる魅力が多いAdobe XD

曽川さんは、Adobe XDをお使いになるなか、フリーランスだからこそ感じるAdobe XDのメリットをご紹介されました。

• 起動が非常に軽い
• ワイヤーフレームからノンストップで進行できる
• 非常に連携がスムーズにできる
• ドラッグ&ドロップで適用できるアセット機能が追加され便利に
• イラレやフォトショよりも簡単な操作

また、今までは複数のアプリケーションを使ったりすることでかさばっていた行程が、Adobe XDを利用することにより解消されて、いろいろな煩わしさが軽減したことにも言及されていました。

さらには制作段階の事だけではなく、その周りの行程もAdobe XDを利用したことによってラクになったこともお話いただきました。

• コミュニケーションに優れている機能が用意されている
• プロトタイプをメールでリンクを送るだけで動作確認までできる
• 複数で作業した場合にコメントつけたり、リンクつけたりできる
• グループで連携協力しながら作成できる

 

制作フローの事例のご紹介

また曽川さんが実際に制作されたものを利用してのデモも行われました。

某学校のホームページのリニューアルを行った際のお話では、Adobe XDで提案書をご提示した際、提案する側としてもより魅力的なご提案ができ、クライアント様からの印象もかなり良かったそうです。
今までであれば、提案書はワードやパワポ、そして仕様書はエクセルでご用意されており、いろんなソフトを使わなければいけなかったのですが、その時はAdobe XDを入れることによってデータが複雑になるのを防ぐことができ。データ管理も非常に簡単になったそうです。

制作にかかる効率を少しでも高めることをいつもお考えの曽川さんは、XDがもつ、他のAdobeアプリケーション群のレイヤーを保持したまま読み込むことができる点を非常に魅力なポイントとして挙げられおり、PSDのフォルダ階層をそのままレイヤーとして読み込めることをご紹介いただきました。

その中で実際にご提案・制作された際にAdobe XDの魅力として実感されたこととして、以下のことを挙げられていました。

• 制作チーム内だけでなく、クライアント様含め関わるみなさんとの円滑なコミュニケーションをはかることができる。
• スクロールなどの動きやアニメーションなども、ある程度プロトタイプを提示できる。
• 制作時間も短縮できる。
• 利用ソフトを減らして、データを管理化・簡素化できる。
• XDでほぼデザインまでできる。
• 基本的な使用方法がネットに掲載されている。
• 新しく追加されたアセット機能はレイヤー表示を切り替えられる。
• 文字スタイルやカラーもアセットとして登録できる。

また、クライアント様とお話されたなかで、制作側だけでなく「非常にわかりやすく見る・確認ことができる」など、双方にメリットがあったことが解ったとお話いただきました。

質疑応答タイムでは、さらなる魅力として、

• レイヤーとかで書き出せ、そのままコーディングに渡すことができる。
• 細かなデザインの修正や、再読み込み・置換ができるきる。
• 根本的に簡単に作れるようになっている。
• プロトタイプの発行では、パスワード設定もできる。
• クライアント様にプロトタイプ用のアドレスをお知らせするだけ。
• USBでつないで、実機でテストすることもできる。
• 同じ部品を繰り返すことも簡単にできる。

実際にAdobe XDを操作してデモをされながら、ご紹介いただきました。

XDに取り込んだ時に分かるようにレイヤー名を気をつけている_φ(･_･ #ゴーハント

— 朋茶@取説屋 (@tomochan_1974) October 27, 2018

まとめ

セッション内では、XDの魅力を曽川さんが実際に制作されたものを随所にご紹介・そのデータを使用しての操作をしていただき、プロに手による本物の実例でご説明いただいたので、すごくわかりやすく、Adobe XDの魅力と機能がすごく身近に感じられるセッションでした。また、ステージは追加のイスや立ち見参加もいらっしゃるほどの満員御礼で、曽川さんのお人柄や溢れる魅力も肌に感じられるセッションでした。
曽川さん、楽しくわかりやすいセッション、ありがとうございました！

レポーター：みっちー（茄子川導彦）

DTPの人でありながらWebもやっちゃうすごい人。

来年のクリエイティブハントは実行委員長！よろしくお願いします！！

わたくし謹製webアプリ、タイマーアプリ「atmosphoon」もぜひよろしくお願いします。PCでもスマホでも、スマホのスタンドアローンモードでも。

可視化されたタイマー、現在時刻表示、等々…画面表示がかなりカスタマイズでき、リストや表示設定を転送することも可能です。https://t.co/v4VjcXPoPb

— 茄子川導彦／Solarus (@nskw_g) June 13, 2018