コーディングの代行・外注は
デザインデータはPhotoShopからXD・Figmaへ
コーディングをご依頼いただく際、クライアントによって様々な入稿形式でご依頼をいただきます。
以前はPhotoshopが主流の中で、たまにJPGや手書きのラフ画をベースに写真だけ別途お送りいただいて頑張ってコーディングで再現することもありました。
現在多くの案件はAdobe XD・Figmaでいただいております。
今回はAdobe XDについてメリットをご紹介します。
PhotoshopよりもAdobe XDの方が圧倒的に作業効率が良いです。
これはコーダー目線はもちろんクライアントにとってもメリットが多いのでその理由についてご紹介します。
全体像を把握できる
Photoshopが1ページにつき1ファイルでデザインデータを作成するのに対して、
Adobe XDは全ページを1ファイルで管理できる為、サイトの全体像を把握しやすいです。
全体像が見えることで以下のようなメリットがあります。
- ・全体の作業ボリュームを算出しやすい
- ・デザインの統一感を確認しやすい
- ・必要なページを精査しやすい
動作が軽い
Adobe XDのメリットは全体像を俯瞰できる点を述べましたが、ではページの細部をチェックする事には不向きではないか？と思う人もいるかもしれません。
Adobe XDではCommand（windowsの場合はコントロール）を押しながらマウスをスクロールするだけで、滑らかに画面のズームイン・ズームアウトが可能です。
UI・UXはズームアウトして全体像を確認し、細かなグラフィックはズームインしてチェックすると良いでしょう！
レイヤーの管理が不要
Photoshopの場合「レイヤーを選択してから編集」が一般的な手順だと思います。
その為レイヤー構造が複雑になりレイヤーの管理自体に工数が莫大に発生しがちです。
一方Adobe XDはオブジェクトをクリックして直感的に編集できる為、どれだけ凝ったデザインになってもどこのレイヤーに入ってたかな？という考えもいらずシームレスに作業が可能です。
キャンバスの余白にはやり取りメモも
Photoshopはあくまでグラフィックに特化したソフトですので細かな指示や質問はメールや管理ツールに頼るしかありませんでしたが、Adobe XDは直接ファイルにメモを書き込む事ができる為、どの部分に対しての指示なのかが直感的にわかる点も優れています。
詳細な画像加工はやっぱりPhotoshop
逆にAdobe XDは写真の加工などには不向きです。
簡単なトリミング・ドロップシャドウ・角丸加工などはAdobe XD側で手軽にできますが、写真の合成や詳細な色調整などはやはりグラフィックに特化したPhotoshopで行った方が良いです。
会議用資料やマニュアルもAdobe XDの方が楽
少し前まで会議用資料やマニュアルはPowerPointで作るのが主流でした。
PowerPointもオブジェクトをクリックして直感的に操作ができる点は非常に優れているのですが、Adobe XDは直感的な操作に加えて大きな描画エリアで全体を見ながら資料を作成できる点が大きな魅力です。
