2018年6月30日（土）大崎ブライトコアホールで開催したCSS Nite LP57「All About XD」再演版のフォローアップとして、池原 健治さん（ソニー・インタラクティブエンタテインメント）の『コミュニケーションを可視化する！XDストーミング』セッションのスライドなどを公開します。
フォローアップメッセージは、イベント開催直後（2018年6月）の時点のものです。
フォローアップ
Adobe XD漬けの半日という長時間に渡ってご参加いただき、ありがとうございました。
Adobe XDの機能的な説明などは他のセッションの方々におまかせして、私からはコミュニケーションツールとして情報伝達を最適化したり、自由な発想で様々な使い方ができるXDの懐の深さをお伝えできるように心がけました。
自分の中では初めての試みとして、ステージ上スタンディングでのプレゼンにてお話をさせていただきましたが、スライド送りのミスなどで一部お見苦しいところもあり、申し訳ありません（もっと練習します！）。
まずは皆さまに「Adobe XDは楽しい！使ってみよう！」と感じてもらえたら幸いです。
セッションでもお伝えした弊社リクルートサイト制作にAdobe XDを活用した事例については、過去のインタビュー記事もご参考までに共有させていただきます。
参考リンク
セッション中にお見せしたデモ
ご意見、ご質問に関して
（質問）XDストーミングは、修正・確認がスピーディーで簡単になるよ、と受け取ればよいでしょうか？
集まった関係者が頭の中で考えていることを、ラフでよいのでその場でイメージや動きを作成・修正して共有することで、「認識のずれを無くす」ということが最大の目的と考えています。
もちろん他のツールでもやろうと思えば同じことはできるのですが、Adobe XDのレスポンスの速さと修正に強い機能が、特にこの手法に適していると思っています。
（感想）デザイナーがXDに慣れていないとスピード感が落ちると感じました
もちろん操作に慣れているに越したことはありませんが、XDはデザインツールとしてはとてもシンプルな操作体系で、初めて触るユーザーでも比較的短時間で主要な操作を直感的に行えるようになります。
まずはご自分でいくつかプロトタイプまで作ってみて、慣れてきたところでブレストでも使用してみると良いかもしれません。
（感想）デザイナーとエンジニアのコミュニケーションが大事
弊社ではエンジニア（として動くこともある）の私からデザイナー側にAdobe XDを広めたという経緯から、比較的導入は楽でしたが、 学習コストの低さにより、その逆（デザイナーからエンジニアへ）も有りだと思っています。
（質問）エンジニア的に実装のつなぎこみでどうやってるのか気になる
弊社の場合デザインスペックが（物理的に）使えないので、基本XDファイルをデザイナーとエンジニアで直接やり取りしています。位置情報や色やフォントなどを取得するのもPhotoshopなどと比べてもやり易いと感じています。作り込んだイラストなどは一部Illustratorファイルから直接書き出したり、写真素材などは別途まとめて手配してもらうこともあります。
私自身がXDでデザインしたり、XDからコーディングしたりすることがあるため、デザイナーとエンジニアでお互いに見易いXDファイルを作るように心がけています（マークアップを意識したレイヤー・グループ構成など）。
（キーワード）イケてない要望はイケてないデザインを作って見せたほうが説得力がある
いかに最小限のパワーでイケてなさを見せるかがポイントです。・・が、イケてないと思われる中にキラリと光るものがあるときもあるので、生かすか殺すかはあなた次第です！
（感想）XDストーミングは時間がとれないクライアントとの会議の時に使えそう
田中さんのセッションでもおっしゃっていましたが、まさに「井戸端会議」感覚でイメージや動きの共有と、その場でちょっとした修正までできるのは短時間のミーティングでも効果がありそうです。
（感想）XDストーミングは使いどころは選びそう。クライアントのリテラシーが低いと、かえってUIのディテールばかりの話になってしまう気がしました
「なんとなく頭には浮かんでるんだけど、やりたいことをうまく伝えられない」という場面にも「例えばこんな感じにしたらどうでしょう」とラフなイメージを作りながら提案することができるのは、「考える速度でデザインできる」XDならではのミーティングスタイルです。クライアントとのレビューではディテールよりも、どちらかというと全体のストーリーや画面構成、デザインの方向性などの認識を合わせることを重視し、その分内部確認でUI設計などのディテールを詰めるようにしています。
（感想）複数の人間をアサインして時間と場を共有するのはいろいろ難しいのでは？
確かにクライアントまで巻き込んだXDストーミングを行うのは、まずセッティングするのが一番大変かもしれませんが、作り込んだ状態でレビューしてちゃぶ台返しがあるよりは、短い時間でも途中の段階で見せながらその場で修正していくほうが、結果的には近道になる場合もあります。
（質問）リアルタイムブレストはどの程度の時間をとっているのでしょうか？
デザイナー同士やエンジニアなど、実作業する人間の場合は2時間程度長く行うこともありますが、マネージャーやクライアント、仮想ユーザーなどの場合は予定を確保できる現実的な時間として1時間程度で行うことが多いです。
（質問）ブレストしてもしゃべらない人はどうすればよいですか？
日本人はシャイな方が多いので、そこは議長が適度に話題を振るなど、欧米式が良いかと思います。
（感想）同じくセキュリティの関係でクラウド機能が使えないため、参考になりました（他同意見）
クラウドを使えないことで、かなり機能的な制限を受けるAdobe XDですが、リアルタイムなコミュニケーションならではのメリットと、（デザインスペックではなく）XDファイルそのものを下流工程にやり取りするワークフローを突き詰めていきたいと考えています。
（もちろんクラウドが使えるに越したことはないですが！）
（感想）社内サーバーのみで（セキュアに）クラウドが使えるようにAdobeにリクエストしたいです
是非！
（質問）クラウド機能を使えないところも多いと思います。何か外部とのやりとりでできる方法があれば知りたいです
上記ご意見のように、社内サーバーのみでのクラウド利用などができれば望ましいですが、Adobe XDは無料で利用できるスタータープランがあるため、XDファイルを開ける環境を導入することは可能です。ブラウザを介した共有はできませんが、XDファイルをやり取りして、直接プロトタイプを実行することである程度は代用できるかもしれません。
（質問）できるだけアートボードは増やさないほうが管理は楽？
確かにアートボードが少ないほうが管理しやすいですが、優れたUI/UXの模索にはどうしてもアートボードは煩雑化しがちです。無理に増やさないように考えるよりも、シンボルやアセット機能をうまく使って、アートボードが増えてもまとめて修正できる構造にしたり、過去のバージョンと住み分けて、複数のパターンを常に把握できるようにするなど、地味ですが整理整頓も大事です。
（感想）カルーセルのプロトタイピングのヒントになる情報が入手できてとてもよかった
実は今回お見せしたデモは、前回のCSS Niteのときにアンケートで頂いたご意見
「メインビジュアルのスライドを見せるときなどに（埋め込みコードが）使えそうだと思いました！」
を参考に制作しております（笑）
誰もがアイデア次第で面白い使い方ができる可能性を秘めているのもXDの魅力です。
（質問）埋め込みコードを利用したスライダー部分などはそのままHTMLに配置、本番運用できるのでしょうか？
見た目だけでいうとコーディングで実装したものに近いイメージ・動きはできるかもしれませんが、実態はAdobeのサーバーに置かれたプロトタイプのため、急な仕様変更なども起こり得ます。また、アクセシビリティ、SEOの観点からも、あくまでコンポーネントベースでのプロトタイプとして利用するのがよいかと思われます。
（感想）埋め込み機能の利用方法がわかったのが嬉しい
本来は例えばブログ記事などで、作成したプロトタイプを埋め込んで紹介する、といった使い方が想定されます（笑）
Webページそのものに違和感なく埋め込みプロトタイプを同化できるので、より実装に近い状態でのプレビューも可能です。
（キーワード）シュウゴ（他同意見）
シュウゴはあなたの心の中に・・・
（感想）どこいつキャラたちに会えたのも嬉しかったです！
ありがとうございます！（最近ゲームのほうが出ていませんが…）弊社どこいつ担当プロデューサーも喜ぶと思います！
ベストセッション2019
2019年、CSS Niteでは49回の関連イベントを通して123セッションが行われました。その中からベスト・セッション＋αを選びました。
