今更やっとXDでWebデザインをやってみた感想

AdobeXDをご存知だろうか?

最近Adobeが開発をやめたとか無くなるとか言われているWebデザインアプリである。

似たようなアプリにFigmaというのがあり、それを超高額で買収したためXDをFigmaに統合して無くす可能性が高い。

そんなタイミングで私はXDを使ってWebデザインを始めたのだがめちゃくちゃ使いやすい事に驚いて思わず紹介ブログを書こうと思ったわけである。

Webデザインは何のツールでやっていたのか?

私の場合は、2007年にWebデザイナーデビューしたわけだがその前趣味でやっていた頃はGoLiveというAdobeのソフトを使ってダッサイサイトをデザインしていた。

それが仕事でやるようになってPhotoshopでデザインするようになる。

なぜか?それはWebの画面がピクセルで作られており、ピクセルでデザインをするソフトであるPhotoshopじゃないとピクセルパーフェクトでウェブサイトがきれいに表示できないからである。

似たようなソフトにIllustratorというのがあるがこちらはベクター画像であり、拡大縮小で劣化しないという特性がある。イラストなどを作る時にはとても便利だがWebデザインで使おうと思うと線がぼやけたりして使いづらいソフトだった。主に紙のデザインを作る時、イラレで作業をしていた。

それがスマホの時代になり、iPhoneが今までのWebの解像度を捨てて2倍きれいなRetinaディスプレイを使い始め、色々な解像度が溢れて今までのウェブサイトは72dpiという解像度の時代が終わった。

その結果、Webデザインもイラレで作るのが当たり前の時代になり、Photoshopは画像加工専門のソフトとなったわけである。

昔はフォトショプで作ったデザインを1ピクセルのズレもないようにスライスツールで切り出して、それをテーブルレイアウトにはめ込んで表示するというのが当たり前だったわけだが、10年で完全に時代がレスポンシブデザインに変った。

ピクセルパーフェクトが終わり、リキッドデザインの時代になったのである。

ということで、リキッドデザインの時代になってからはイラレでデザインデータをもらい、パーツを書き出してコーディングで位置を調整する流れで作成していた。

それがXDというソフトが進化した事により完全にWebデザインはXD一択の時代になったと言える。
(※日本の場合。海外ではFigmaが非常に大きなシェアを取っているとのこと)

なぜ私はXDを今更使い始めたのか?

今までパソコンが古すぎてXDが使えなかったからというのが全てだ。

Adobeがマジで消費者を舐めてるなと思うのがかなりシェアが残っているOSを簡単に非対応OSとしているところ。前の会社でXDを使おうとなった時、私の使っていたPCはまだWindows7であったのだが非対応OSだったので使うことが出来なかった。

そして今の会社のパソコンに関しても前使ってたパソコンはMacのハイセリアからアップデートできない古いモデルだったためXDの非対応環境でありXDが使えなかった…。マジでAdobeはそんなことをしてるからFigmaに圧倒的にシェアを奪われるようなことになっているのだと思う。

私以外の会社の人が全員XDにWebデザインソフトを変えた結果、私だけXD使えないのはめちゃくちゃ仕事がしづらいということになり、在宅勤務になった社員が会社に置いておく用のパソコンが余ったのでそれを使わせてもらってXDを使い始めたのが去年の初め頃。

デザイナーからXDを受け取ってそこからデザインのパーツを書き出してコーディングするためのソフトだったので、自分ではWebデザインを作っていなかったのが去年の段階。

今年、新規案件が入ってデザインからコーディングまで全部やることになったため、ちょっと使い心地を確かめようと最近自分でウェブサイトを作り始めたのが今である。

XDはここが使いやすい

XDの良さはとにかく時短になるというところだ。

1.ツールがわかりやすくなんとなくで使える

今までイラレやフォトショを使ってきた人なら右側のツールが直感的に使えるためXDを使うために勉強する必要がない。

フォントを変えるとか、色を変えるとかドロップシャドウをつけるとか透明度を変えるとか全て直感的に触れば自由自在に設定できる。一切勉強しなくてもめっちゃ簡単に使えるというのはすごく大きいと感じる。

こんな事できないかな?と思って触ると大体できてしまうよく出来たソフトと言う印象。これさえあればWEBデザインが完了するソフトとなっている。

2.左側にあるドキュメントアセットから使い回せる

文字の見出しはこれとか、文章部分はこれとか文字スタイルを設定したり、色もカラーから設定できるし、コンポーネントにブロックまるごと設定すればパーツを使いまわし放題。

これが本当に時短になってここの文字サイズ何だったかな?みたいなことが全く不要になるし、カラーが上で使ったやつと下で使ったやつで微妙に違っちゃうみたいなことも起こらない。

Webデザインではヘッダーとかフッターとか数ページで使い回すことなどしょっちゅうなのだが、コンポーネント化しておけば簡単に使い回せる。

バナーとかもページ内に何個も使ったりするし、複数ページに設置することがあるのでそれをいちいちコピーアンドペーストする必要がなくワンクリックでポチッと設置できるだけでものすごくストレスが減るし時短にもなる。

3.シェアが簡単

シェアボタンを押すだけで共有用のURLが作成される。

そのURLをメールに貼ったり、チャットに貼るだけでチェックが可能となる。

イラレとかだとPDF化したりする面倒くささがあり、ダウンロードして確認とか手間がかかっていた。

作成だけでなくチェック作業も簡単になるソフトと言える。

まとめ

2023年になり、Figmaとの一本化の流れが出来た現在、XDを使い始める価値はあるのか?だがあると断言できる。

おそらくは今後長く使い続けることの出来るソフトではないだろう。

しかし、学習コストが限りなく0に近くメッチャクチャ時短になるこのソフトならどのタイミングで乗り換えても正解と言える。

おそらくはあと1年ぐらいは使い続けることは出来ると思われるのでFigmaと統合されるまではXDでWebデザインをやろうと思う。

\よかったら使ってね/

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

日本語が含まれない投稿は無視されますのでご注意ください。(スパム対策)