
みなさんこんにちは。
最近個人的に非常にバタバタしておりまして、やるべきタスクが貯まってたまって目が回る…
そう思っていたら完全に目を回し(ただ単に風邪)、ヨボヨボになったまえだです。
いやーほんと体調管理の1つも出来ずお恥ずかしい限り。皆さんも寒い季節なので体調には十分お気をつけくださいね!!
あと、道端をよぼよぼと歩いている人がいたらきっと私なので、見かけたら後ろから「よぉヨボヨボ!!」と元気よく飛び蹴りで活を入れてください。
WEB制作にとっても役立つAdobe XD(Experience Design)
今日はサイト制作において初歩的段階でかなりお世話になるツールについてお伝えします。
まず、サイト制作をお願いしたい!とご依頼を頂いたら、私たちはページ数や内容を確認し、必要ページ全てのレイアウトを考えていきます。
家でいうと部屋の家具配置みたいなものですね。テーブルはここでベッドはここ…みたいな感じ。
どこに隣の部屋との扉を付けるかも自由ですが、ベースとしてユーザーの使いやすさや見易さをしっかり判断し、アクション率を上げていく仕組みを考えるのも私達のお仕事なので、マーケティング的要素をしっかり考えた上でこの配置をご提案していきます。
そして、登場が遅くなりましたが、その図面を引くために使っているのが、これからお伝えするAdobeXDというツールです!
AdobeXDとは
まずはそのツールなんぞや、の部分から。
このAdobe XDは、UXデザインに関わる多くのデザイナーの声をもとに開発されたUI/UXデザインツールです。
ワイヤフレームからプロトタイプまで、この1本で制作できるというオールインワンタイプの製品で、世界中のデザイナーから支持されています。
2016年3月にパブリックプレビュー版が公開されて以降、改良・機能追加が重ねられ、2017年10月に正式版がリリースされました。
その後もユーザーのフィードバックを受けながら、ほぼ毎月アップデートが行われているそう。
機能を絞ったUI/UXツールだから覚えるのがカンタン!
このAdobeXDですが、Webデザイン制作に必要な機能のみに特化しています。
そのため、動作が軽くて早いというのも嬉しいところ!
IllustratorやPhotoshopなどのAdobe製品との親和性が高く、ショートカットはPhotoshopとほとんど変わりません。
なのでAdobe製品を既に何か使っている人には違和感も少なく、すぐに使いこなせるようになると思います。
また、2018年3月のアップデートではPhotoshopとの連携が強化されました。
XDから直接PSDファイルを開き、Photoshopで作成したデザインを使用することができます。
また、Sketchとの互換性も強化され、SketchファイルをAdobe XDに読み込めるようにもなりました。
さらに2018年10月のアップデートからは、Illustratorファイルの読み込みも可能です。
またMac版では、XDで作成したデザインをZeplin、Avocode、Sympliなどのデザインツールへ転送することもできます。
「そもそもPhotoshopやIllustratorを使ったことがない」という人も心配いりません。
基本的な操作から順番に学習できる『Adobe XDスターターキット基礎編』が用意されています。
図を描くツールの使い方から始まって、作成したプロトタイプを共有する手順まで、ひと通りの流れを学ぶことができるので、Web制作に携わる人はもちろん、これからチャレンジしたいという人にもおすすめです。
コメントが書き込める共有機能
XDには、パスワード付きのURLを発行し、クライアントやチームメンバーと共有できる機能があります。
特定の部分にコメントを書き込むことができるためイメージが伝わりやすく、よりスムーズにプロジェクトを進めることができるようになります。
また、コメントに対して返信を書き込むことも可能です。
https://blogs.adobe.com/creativestation/web-march-update-of-adobe-xd
さらにXDには、デザインの仕様を公開するデザインスペックという機能が搭載されています。
オブジェクトを選択すると、カラーコードやフォントプロパティ、マージンなどをプロパティパネル上で確認することができるという便利なツールです。
2018年7月のアップデートでは、このデザインスペックにもコメント機能が追加され、デザイナーとエンジニアのコミュニケーションに役立っています。
これらの機能によって、今までデザインチェックをしてからチャットやメールでフィードバックを返し、「これはどこのことですか?」「いやいやそこですよ」
みたいな見にくいトゲトゲ攻撃が起こることもなくなりますね☆
使い方に応じて選べるプラン
XDは「Adobe Creative Cloud」に含まれるアプリですが、単体での利用ももちろん可能です。
また2018年5月からは、なんと無料で利用できるスタータープランも公開されました!!!
スタータープランでは共有機能に制限があるものの、ドキュメントは無制限で作成することができます。
これから使用する機械がある人は、まずは気軽に無料版から試してみてはいかがでしょうか。
以上、まえだの便利ツール紹介コーナーでしたーー。さらば。