見出し画像

時間がない人のためのXD/sketch比較

この記事は両方使えるけど、なんとなく二つのソフトが違うことがわかる。でもそこを検討する時間はない人のための記事として作成しています。
なので値段や歴史、エコシステムや基本的な操作、機能は理解した上で読むことを推奨します。

また、検討の為の情報を載せていますがそれも必要ない方は一番下まで一気にスクロールすると二つのソフトの使い方がすぐにわかります。

まず、XDとsketchについて。

XDとは

謳い文句は「思考の速度でデザインする」
超カッコイイですね。

adobe内の立ち位置ではPsやAiのようなグラフィックツールからUI作成に使用する機能を抜粋し特化型に進化させたUIツールであり、上記二つのソフトウェアを繋ぐHUB的側面もあります。
決してPsやAiに取って代わる百特ナイフではないことを理解しておいてください。PsやAiがあって本当の輝きを取り戻す製品です。

利点
異なるファイルで同期するアセット機能
リピートグリット
ある程度カバーできるアニメーション表現
クラウド共有がやりやすい
Ps,Aiとの連携
webから見ることが出来る
軽い

欠点
選択やガイド生成、距離表示に不安がある
アセットが増えた場合の視認性の悪さ、探しにくさ
レイヤーパネルがアートボード選択>中が見れるという階層構造


ここら辺が目立った点です。
広く色んな職種の人が使えるような機能に特化しているイメージですね。

ロール分けすると以下のような使い方になる気がします。
ディレクター/UXストラテジスト/IA:ワイヤーを切る時はテンプレートを呼び出してそれをライブラリ代わりにし、コピペでペタペタと要素を貼り付けていく
クライアント:WEB上で確認
UIデザイナー:写真、アイコンはPs,Aiを使用。ワイヤーファイルをマスターデータとしそれにデザインデータをパブリッシュしていく。
プログラマー:デザインデータを確認しながらコーディング。

細かな操作や選択に難あり、と書きましたが小規模アプリデザインには十分耐えうるものとなっております。また、それらのバグはこれから取り除かれるのでそれを理由にXDを選択肢から外すのは早計でしょう。

続きましてsketchです。

Sketchとは

謳い文句がなかったので私の感想を
「使うごとに手に馴染むデザイナーの相棒」
なんかかっこいい文言じゃないですか?ぜひ使ってください。

利点
癖があるが慣れたら使いやすいシンボル機能
豊富なプラグイン
デザインシステム作成が容易
アイコン作成には問題ない描画力
atomic design等のオブジェクト指向に近いデザイン作成との相性の良さ

欠点
atomic designや命名規則等の前提知識がないと十分に使えない
プロトタイピング機能は最低限

このように学習コストは高いですが、sketchは変更に強いデザインデータを作成するのに適しています。職を横断しデザインを作るXDと比べると大分尖っていますね。ですが、デザインチームがありデザイナーが2名以上が参入するプロジェクトの場合はこの尖り方が奏功します。
勿論、2名以上のデザイナーがいなくてもその恩恵は十分に得られます。
また、ワイヤーやその確認はXD、デザイン業務はsketchと使い分けるのも一つの手です。

結論

ワイヤー切るならXD
小規模アプリもXD

シンボルの恩恵が嬉しいような大規模アプリならsketch

異論は認めます。
現段階の所見に近いので、何か抜けているところや「ここはどうなの?」みたいな質問をぜひ受け付けております。

この記事が気に入ったらサポートをしてみませんか?