Successfully reported this slideshow.

次世代ツールを使った『マークアップのための』Webデザイン術

1

Share

1 of 45
1 of 45

次世代ツールを使った『マークアップのための』Webデザイン術

1

Share

Download to read offline

2016年9月23日(金)開催「DevLOVE Vol.198 webサイトをマークアップするということ」でのセッションです。

Sketch 3 と Adobe XD を軸に、デザイナーとマークアップエンジニアの連携と「Webサイトに魂を込める」ことについて30分間お話をさせていただきました。

■■■ セッション中でご紹介したSketch プラグイン
https://github.com/utom/sketch-measure
https://github.com/getflourish/Sketch-Style-Inventory

2016年9月23日(金)開催「DevLOVE Vol.198 webサイトをマークアップするということ」でのセッションです。

Sketch 3 と Adobe XD を軸に、デザイナーとマークアップエンジニアの連携と「Webサイトに魂を込める」ことについて30分間お話をさせていただきました。

■■■ セッション中でご紹介したSketch プラグイン
https://github.com/utom/sketch-measure
https://github.com/getflourish/Sketch-Style-Inventory

More Related Content

Related Books

Free with a 14 day trial from Scribd

See all

Related Audiobooks

Free with a 14 day trial from Scribd

See all

次世代ツールを使った『マークアップのための』Webデザイン術

  1. 1. 次世代デザインツールを使った Webデザイン術マークアップのための
  2. 2. t ご注意 2016年9月時点での情報を もとにお話をいたします
  3. 3. t こんな方に向けて ✤マークアップエンジニアさんとの連携を
 見直したいデザイナーさん ✤デザイナーの頭の中身を覗いてみたい
 マークアップエンジニアさん、
 ディレクターさん
  4. 4. 約100名の方に ご受講いただき ましたm(_ _)m
  5. 5. t スキル ✤ Sketchは一番使ってます(プラグイン開発は…) ✤ XDは触り始めたばかり ✤ Photoshop 10年選手 ✤ イラストはIllusrator中心 ✤ ときどきマークアップ
  6. 6. Webデザイナーが バトンを渡すときに 考えていること
  7. 7. 魂を込めるための ノウハウ
  8. 8. t 今日お伝えしたいこと ✤ せっかく込めた魂には、伝える努力を添えて ✤ 次世代ツールはイマドキWeb制作向き ✤ クオリティを上げられるところを見逃さない
  9. 9. t 今回のアジェンダ 01. イマドキデザイナーが魂を込めるポイント 02. 込めた魂には、伝える努力を添えて 03. SketchとXDが好きな理由 04. 次世代ツールとWeb制作事情
 05. 次世代ツールとの付き合い方
  10. 10. 01 イマドキデザイナーが 魂を込めるポイント
  11. 11. t 魂を込めるポイント ✤ フォント ✤ 配色 ✤ 余白感 ✤ ビットマップ画像 ✤ エフェクト ✤ コンテンツとの相性
  12. 12. 02 込めた魂には、 伝える努力を添えて
  13. 13. t 「伝える努力」とは ✤ フォント ✤ 配色 ✤ 余白感 ✤ ビットマップ画像 ✤ エフェクト ✤ コンテンツとの相性
  14. 14. ようするに、思いやり =
  15. 15. フォント
  16. 16. 配色
  17. 17. 余白感
  18. 18. 実演
  19. 19. ビットマップ画像
  20. 20. エフェクト
  21. 21. 実演
  22. 22. コンテンツとの相性
  23. 23. 03 Sketch と XD が 好きな理由
  24. 24. t Sketchが好きな理由 ✤とにかく動作が軽い ✤機能とオペレーションが限定的 ✤ベクターベースなのでSVGも書き出せる ✤これは趣味ですが…コミュニティが活発
  25. 25. t XDがいいなと思う理由 ✤動作が軽い ✤デザインとプロトタイプを同時進行 ✤オペレーションが直感的
  26. 26. 04 次世代ツールと Web制作事情
  27. 27. 次世代ツールは イマドキの制作事情を よく考えられている
  28. 28. 「作業の効率化」を 意識するようになった
  29. 29. 05 次世代ツールとの 付き合い方
  30. 30. 入社半年で FwからSketchに 乗り換えました
  31. 31. t ツールの影響を感じたとき ✤ デザインがフラットになりがち ✤ ツールができることに引っ張られる ✤ 意識的にグラフィカルな要素を足す
  32. 32. 別のチャネルを 持ってみる
  33. 33. t まとめ ✤ せっかく込めた魂には、伝える努力を添えて ✤ 次世代ツールはイマドキWeb制作向き ✤ クオリティを上げられるところを見逃さない
  34. 34. ご清聴ありがとうございました ! " i_mairy Risako Imai

×