第47回 岡山WEBクリエイターズ「WebデザインのワークフローとXD」に参加

2018年8月25日(土)に専門学校岡山情報ビジネス学院で開催された『第47回 岡山WEBクリエイターズ「WebデザインのワークフローとXD」』に参加してきました。
写真:第47回 岡山WEBクリエイターズオープニング風景

Adobe XD」は以前参加した「広島フロントエンド勉強会 〜デザイン部〜 Vol.6」で少し勉強した後、最近業務でXDファイルを基にコーディングをしているところでした。実際に業務で使用してみると、「このXDファイルからはメインビジュアルが上手く書き出せないな」とか「写真を2xで書き出しても荒れるのはなぜだろう」等、色々と疑問が沸いてきました。あとはそもそもXDはPhotoshopでビジュアルデザインを作るという作業を完全に置き換えるものなのかという根本的な疑問もありました。XDの役割というか立ち位置がいまいち掴めない感じでした。

当日参加してとても印象に残ったのはツキアカリ 松下絵梨さんの「コツをつかんでもっと時短! Adobe XDの導入・活用レシピ」のセッションでした。ワイヤーフレームを作り、続いてビジュアルデザインを作っていくデモを見て、コーディングに入る前の工程でどのようにXDが活用されるのかよく理解できました。またリピートグリッドでワイヤーフレームやビジュアルデザインの作成が効率的に行えること、またプロトタイプの特定の箇所にフィードバック(コメント)を付ける機能を利用してコミュニケーションが円滑に行えること、コーダーはデザインスペックを利用することでエレメントの情報やテキストが容易に取得できること等が分かりました。こういったこと理解できないと「僕はCSS Hat 2とか使えるPSDがいいからPSDで入稿してよ…」と言いたくなるかもしれませんね。

XDを上手く活用すると、Webサイトやアプリ制作のさまざまな場面で効率よくコミュニケーションを取りながら作業ができるのかなと考えました。

  • ディレクターとクライアント(但しクライアントさんのリテラシーによるかな)
  • ディレクターとデザイナー
  • デザイナーとコーダー

ただ、例えばデザイナーとコーダーの仕事の範囲でオーバーラップする領域があると思うので、縦割りのお役所的というか相互に理解とかしようとする姿勢がないとXDがあっても辛いかなとも思うなど…。

また、TIMING Design 北村崇さんのセッションで聞いた「XDはWeb用のInDesign」「XDで全部やらない」というのもとても参考になりました。最初に疑問として書いたXDの役割が明確に分かりました。

これからも継続してXDについて情報収集していき、業務に役立てていきたいと思います。松下さん、北村さん、岡山WEBクリエイターズのみなさん、ありがとうございました。

※記事中の写真撮影: イメージフォト 田中 秀和さん