Adobe MAX japanに行ってきました。セッションで学んだことメモ（Sessionレポート） 勉強会/展示 2016/09/04 Tweet Pocket 9/2（金）のイベント、Adobe MAX japanで私が気になった内容とか、感想とか書かせていただきます。個人の意見も混ざっておりますがご容赦ください。うろ覚えで間違ってたら申し訳ございません。長くなるので、key note編とSession編で分けてます。こちらはSession編です。 Session編は行った所だけ、メモの掲載です。気になるところいっぱいで悩みました〜！ ちなみに動画Adobe MAX japanの公式サイトで動画配信されてるので、そちらも貼っときます。（一応です…） 目次 アドビ初のUI/UXデザインツール、Adobe XDの使い方とロードマップ[A-05] プロトタイプで舵を取れ！Adobe XDを使った最強のUI/UXデザイン手法[C-15] （ちょっとだけ拝聴）ベテランほど知らずに損してるIllustratorの新常識―あ、それ、今のIllustratorならこうします！[C-13] 作ったデザインを形にする人（エンジニア）のことを知ってほしい デキるWebデザイナーを目指せ！本当に現場で使えるCC活用テクニック[E-25] Sass/LESSにも対応！モダンツールへと新しく生まれ変わる次世代Dreamweaver[F-35] アドビ初のUI/UXデザインツール、Adobe XDの使い方とロードマップ[A-05] 登壇：轟 啓介さん（アドビ システムズ 株式会社） お話メモ Adobe XDでやれる3つのこと UIデザイン（ワイヤーフレーム・デザインカンプ） プロトタイプ（画面遷移・インタラクション） 共有（フィードバック・コンセンサス） Adobe XDをオススメする3つの理由 Adobeの製品とは思えないほど軽い かなり簡単で初心者でも扱える サクサク早い 機能数を絞って集中開発。短期間でリリース（ユーザーの声も反映されやすい）。クオリティ担保。 シェイプの合成も非破壊でできる（イラレもオプション押しながら合成したらちゃんと編集できますよ〜） テキストデータをドラッグしたら自動流し込み 画像データを複数選択してドラッグしても自動流し込み リピートグリッド 領域内を広げるとオブジェクトがリピートで表示 カラムに対応させるため、横幅があれば横に並び下に落ちる。狭ければ縦一列に並ぶ。 録画できるし、リンク共有もできる。 標準UIキットがある リリース予定機能はこちら 私的な感想 レイヤーのサポートがどうなるかも気になるところです。以前受けたセミナーでも「レイヤー機能入れたら重くなりそう」ってちょっと話が出てましたので。 また、シンボル機能のほうが必要ですよねって株式会社まぼろしの松田さんにtwitter上で声をかけていただきました。確かにこれだけアートボード分かれて同じオブジェクト使う可能性高いならシンボルがないと管理きついですよね。ってことで同意でした。（意味違ってたらどうしよう） プロトタイプで舵を取れ！Adobe XDを使った最強のUI/UXデザイン手法[C-15] 登壇：荒木 脩人さん（株式会社ビジネスアーキテクツ） お話メモ プロトタイプの必要性 クライアントのビジネススピードが早い デザインの知見があり優秀 プロトタイプについて知ってる ハードルは高くスケジュールは短い プロトタイプをやってみてわかったこと 事前にプロトタイプで進めるという合意をとる 議論したい内容とやらないことを明確にしておく プロトタイプは議論のたたき台。説得のためではない でもいい感じの見た目にしておく レイヤーなくても結構いけました。 状況に応じて、ツールを使い分ける。このプロジェクトで最速と判断したからXDを使った 画面遷移・共有の容易さ モックの動画撮影ができるので使い方の説明が省ける 引き際が大事。泣く泣く別のアプリに落とし込むこともある 実際にやったプロジェクトの体験談として、とても響きましたし、現状の問題（Macユーザーだけとか、アプリの連携がまだ弱い部分とか）と、いい部分（上記）のお話が参考になりました。 それに加えてこちらのセッションではXDを超えて…いや、むしろXDに乗せて制作現場で意識しておきたいデザインのお話が深く入っていたのでメモ書かせていただきます。 お話メモ わからなくてもとにかくやってみる。やってみればわかる。意外とできる。 失敗してもいいから、まだできてないと相手が思ってるタイミングでも動く。やったことが評価につながるし、うまくいけばプロジェクトはスムーズに動く。どちらにせよ、デザイナーが手綱を握り、導けるように動かせる。 ユーザーの使い慣れた普通のUIを使うのも一つの手。そのためにはいろんなサイトを見て学び、ルールや仕様を調べる。 クライアントのビジネスパートナーを目指す。事業の方向性を見極める。実現するためのデザイン提案をできるように。 新聞や業界紙を読む、クライアントの記事を読む、ビジネスのユーザーになる、ファンになる、応援する、上流工程から参加する。 デザイナーは説明する力をつけないといけない。 デザインを文章で説明する。話せるようにする。同僚や家族に練習させてもらう。クライアントに何度も会ってみる。 デザインの８割は話すことが仕事とだと思う。 急がないといけないという事実に違和感を感じる人も多いと思います。良いユーザー体験を作り、想いを届けるなら、ユーザーの分析もクライアント自身の分析も必要です。 それでも現実的に急がないといけないことは多く、その中で良い仕事をするために出来ることがぐっと詰まったスライドとセッションでした。 聞けて本当に良かったです。 （ちょっとだけ拝聴）ベテランほど知らずに損してるIllustratorの新常識―あ、それ、今のIllustratorならこうします！[C-13] 登壇：鷹野 雅弘さん（DTP Transit） 大人気！株式会社swwwitch 鷹野さんのセッションをこっそり横目で聞いてました。隣だったし立ち見だったので。。。 オブジェクトを管理でき、制作において時間短縮にもつながるダイナミックシンボルの話とか、複雑なオブジェクトを使いやすくするシェイプ形成ツールのお話をききました。 フォローアップされてるのでご紹介させていただきます。（DTPtransit） いーっつもお世話になってます。 デキるWebデザイナーを目指せ！本当に現場で使えるCC活用テクニック[E-25] 登壇：黒野 明子さん（crema design） 登壇：浅野 桜さん（株式会社タガス） お話メモ セッション資料の通達が。ありがたいです。 ということで、スライド以外のお話を書きます。（多分） 章の始まりで漫談が入ります。楽しませようとしてくれてるお気持ちにこちらも身が入ります。 IllustratorもPhotoshopも使えるのができるデザイナーです（大事なので書いておきます。記事書いてる私はillustratorばっかりですけど！） オブジェクト形成後に多角形の数増やす方法初めて知りました。こちらに詳細をご案内します。Adobe ライブシェイプの操作（ライブ多角形を描画する→側辺数の部分です） Photoshopにもアートボード機能があるのでそれ使ってバナー作ると管理も楽です。 スマートオブジェクトを複数のアートボードに配置することで、一つの編集で全てのアートボードの内容が同時にアップデートされます。 裏技：Adobe Preview（アプリ）はイラレ未対応です。黒野さんの裏技は「イラレデータを配置すること」イラレデータを修正→保存でもちろん内容も更新されます。いい裏技！ レイヤーぐちゃぐちゃのファイルは機能の話の前に気遣いがなってない 私的な感想 女性お二人でご説明いただきました。制作の流れってなかなか人それぞれで難しいなーっと思ってるので、それでもこうして伝えていただけることに感謝。 聞き手を考えて楽しく実例を話していただけました（足腰バキバキに弱ってましたが、かなり癒されました。） Sass/LESSにも対応！モダンツールへと新しく生まれ変わる次世代Dreamweaver[F-35] 登壇：久保 知己氏（株式会社まぼろし） お話メモ ツールバーのカスタマイズができる。分かりやすい。 ブラウザプレビューは修正もスクロールも連動。作業しながら確認できる。 DOMパネルは親タグで複製できるのでコピペ不要です。 従来通りライブビューでカラムの調整も直感的にできます。 行の複製、行の移動、マルチカーソル、矩形選択 クイックエディット cssのカラー選択 transitionのイージングが曲線で編集可 検索機能が上部に。そして検索箇所が直接ハイライトに Emmetは前と同様使えますよー スニペットにトリガーキーを追加できるそうです。 jsのコードヒントや補完機能の話も。 DreamweaverをインストールするだけでCSSプリプロセッサーの環境が構築されます 私的な感想 随分昔にDw触ってすぐ使うのやめてしまった記憶があったのですが、去年Bootstrapが入った辺りからまた使うようになりました。個人てきにですが、Dw結構いい感じですよー。 Dwのペーストスペシャルって名前、なんかかわいいって思うのは私だけでしょうか。私だけですよね。 コーディングの流れがとても見やすく聞きやすく、クールなセッションでした。 超個人的な感想と、読んでくださった方へ感謝です フォントのお勉強やデザインの歴史に関わることを大学時代から勉強していたので、フォントのセッションに行けなかったことが苦しい、ツライ〜〜〜！笑 たくさんの方にお会いできてうれしかったです。 もっとお勉強して、人を巻き込み幸せに出来るディレクションとデザインを行っていきたいです。 ここまで読んでいただいた方、ありがとうございます。取り急ぎレポートとしてアップしてますが、追々情報を追記したりまとめて、見返しても楽しめる記事にしていきますね。（多分。） みなさまのお役に立っていたら幸いです。 key noteについての話は次の記事に分けてます Tweet Pocket