「第2回 D2D WEBグラフィックツール ～デザインワークフローの転換～」で発表したスライドです。

1. わたしはこうしてSketchに辿り着いた
D2D Webグラフィックツール
∼デザインワークフローの転換∼
制作フローにおける各ツールの連携

2. 完 山 祐 毅
Motoyama Yuki
フリーランスWebデザイナー
http://motoyamayuki.com/
sns @motolevel

3. 完 山 祐 毅
Motoyama Yuki
フリーランスWebデザイナー
http://motoyamayuki.com/
sns @motolevel
トレーナーLv: 8

4. わたしはこうしてSketchに辿り着いた

5. Webデザインツールの遍歴
• Photoshop
2009∼2014
• Illustrator
2014∼2016.4
• Sketch
2016.4∼

6. Webデザインツールの遍歴
• Photoshop
2009∼2014
• Illustrator
2014∼2016.4
• Sketch
2016.4∼
レスポンシブ
フラットデザイン

7. Webデザインツールの遍歴
• Photoshop
2009∼2014
• Illustrator
2014∼2016.4
• Sketch
2016.4∼
第１回
D2D
レスポンシブ
フラットデザイン

8. ツールを選ぶポイント

9. ツールを選ぶポイント
慣れ
必須ツール
の代替

10. ツールを選ぶポイント
慣れ
必須ツール
の代替
価格 言語対応

11. Sketchを選んだ理由

12. Sketchを選んだ理由
• 軽い
• Web制作に特化している
• 個人的に必須の機能が備わっていた
• 画像のエクスポートが楽
• 意識しない自動保存

13. Webデザインツールに必須の機能
• アートボード
• シンボルでモジュール化
• グローバルカラー
個人的に

14. 主な使用ツール
Sketch
Illustrator
Photoshop
Prott
Gyazo
JPEGmini
Adobe Stock

15. 制作フロー
• Sketch や XD でワイヤーフレーム
• Sketch で デザイン制作
• Prott や Gyazo でクライアント確認
• パーツや画像はSketchで書き出し

16. Sketchのご紹介
• アートボード
• シンボルでモジュール化
• グローバルカラー
• craftで複製

17. Prottでクライアント確認
• ProttプラグインでSketchからアップロード
• ページのリンクを設定
• クライアントにURLを送信

18. Gyazoでさくっと確認
JPEGminiでさくっと圧縮

19. ご清聴ありがとうございました