Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

デキるWebデザイナーを目指せ!本当に現場で使えるCC活用テクニック

24,512 views

Published on

2016年9月2日に開催された「Adobe MAX Japan」にて、crema design黒野明子と株式会社タガス浅野桜が発表したセッションのスライドです。

Published in: Design
  • Be the first to comment

デキるWebデザイナーを目指せ!本当に現場で使えるCC活用テクニック

  1. 1. デキるWebデザイナーを目指せ! 本当に現場で使えるCC活用テクニック Adobe MAX Japan 2016 株式会社タガス 浅野 桜crema design 黒野 明子
  2. 2. 私たちは、 です。 くれま &さくら
  3. 3. Adobe Creative Stationで連載中
  4. 4. Webデザイナーの実体験に 基づいたワークフロー!
  5. 5. 架空のクライアント 家事代行会社 の、Webサイトを制作
  6. 6. 資料のダウンロード bit.ly/maxjapan
  7. 7. Webデザインのプロセス?
  8. 8. アイディア出し/モック制作 デザイン作業前の準備 カンプ作り込み アセット書き出し 曖昧な要望に対して素早くイメージ共有 プロジェクトの要件に合った制作環境を整える 新機能を活用して手早く作り、直しに強いデータ コーディング担当者に分かりやすいデータを作成
  9. 9. アイディア出し/モック制作 デザイン作業前の準備 カンプ作り込み アセット書き出し
  10. 10. こんなことないですか? 持ち帰って、寝かせてからカンプ提出 先日の打ち合わせ を元に、カンプを 作ってきました! あれ? こんなイメージ でしたっけ��?
  11. 11. デキるポイント! その場でイメージを具体化して 共有できるのが、デキるデザイナー!
  12. 12. ジェスチャでさくっとカンプ作成 簡単にストックフォトを挿入
  13. 13. 画面遷移の情報も含んだモックを 気軽に作成&共有
  14. 14. アイディア出し/モック制作 デザイン作業前の準備 カンプ作り込み アセット書き出し
  15. 15. こんなことないですか? ガイドがずれたページを量産した>< このデータって 全部ガイドが ずれてますけど�� よし! 全ページのカンプが 完成しました^^ design
  16. 16. 適切な設定でミスを防ぐのが、 デキるデザイナー! デキるポイント!
  17. 17. o r
  18. 18. チートシート 配布します bit.ly/maxjapan
  19. 19. ユーザーが多い=デファクトスタンダード 写真を加工しながら、レイアウトもできる アセットの書き出しが非常に便利 Photoshopのメリット
  20. 20. 新規ガイドレイアウト 複数のアートボード作成
  21. 21. Illustratorのメリット 非ピクセルパーフェクトな時流の中で、 Aiでのカンプ作成が求められている フラットな色面メインのデザインをしやすい オブジェクトの管理を数字で行いやすい アセット書き出しも便利になりました
  22. 22. 段組設定機能でグリッド作成
  23. 23. 両方使えるのがデキるデザイナー! &
  24. 24. アイディア出し/モック制作 デザイン作業前の準備 カンプ作り込み アセット書き出し
  25. 25. ゆっくり&手癖で仕事して、時間単価があがらない こんなことないですか? 働けど働けど なお、我が暮らし 楽にならざり��
  26. 26. デキるポイント! なおしに強いデータを 手早く作るのが、デキるデザイナー!
  27. 27. コンテンツに応じた切り抜き 複数アートボード スマートオブジェクト の新機能を徹底活用!
  28. 28. Photoshopのアートボードを iPhoneに表示させ、実機確認
  29. 29. ライブシェイプ ダイナミックシンボル Capture CCとの連携 の新機能を徹底活用!
  30. 30. アイディア出し/モック制作 デザイン作業前の準備 カンプ作り込み アセット書き出し
  31. 31. こんなことないですか? こんな面倒そうなデータ、コーディングしたくない� うちのデザイナーが 作ったデータ 後はよろしく! ひー>< レイヤーもグループも ぐちゃぐちゃ��!
  32. 32. デキるポイント! コーダーに優しいデータを 作るのが、デキるデザイナー!
  33. 33. 便利になった画像書き出し
  34. 34. アセット書き出し機能搭載!
  35. 35. まとめ
  36. 36. アイディア出し/モック制作 デザイン作業前の準備 カンプ作り込み アセット書き出し 曖昧な要望に対して素早くイメージ共有 プロジェクトの要件に合った制作環境を整える 新機能を活用して手早く作り、直しに強いデータ コーディング担当者に分かりやすいデータを作成
  37. 37. 資料のダウンロード bit.ly/maxjapan
  38. 38. ありがとうございました! が、お送りしました! くれま &さくら 連載もよろしくね!

×