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.
© 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
モダンなWebはモダンなツールで創ろう!
Andy Hall・アドビジャパン
© 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
@fenomas
だれだこいつ
@fenomas
 日本在住歴もWeb歴も十数年
 物理...
© 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
@fenomas
1.Web開発に
関係なさそうな
いきなりデモの話
© 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
© 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
@fenomas
2.アドビとHTML
についての話
© 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
@fenomas
Adobeとしての活躍
contribute to a better we...
© 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
@fenomas
CSS リージョン
Webの進化の事例:
現状の対応: iOS7 (標準対...
© 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
@fenomas
CSS フィルター
Webの進化の事例:
現状の対応: Chrome, S...
© 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
@fenomas
カスタム フィルター
Webの進化の事例:
現状の対応:
Chrome, ...
© 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
@fenomas
詳細情報:
html.adobe.com/jp
© 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
@fenomas
3.Web開発ツール
の哲学的な話。
© 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
@fenomas
ひと昔のWeb開発:
ツール
作者
HTML
© 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
@fenomas
ひと昔のWeb開発:
作者
HTML
© 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
@fenomas
モダンなWeb開発:
作者
HTML5
ツール ライブラリ
© 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
@fenomas
で、問題はこれ:
HTML5
ツール ライブラリ
デザイナ プログラマ
© 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
@fenomas
で、問題はこれ:
HTML5
ツール ライブラリ
デザイナ プログラマ
壁
© 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
@fenomas
© 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
@fenomas
4.アドビが
提供するWeb開発
ツールの紹介
© 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
@fenomas
アドビが提供HTML5ツールについて
Dreamweaver
一言でいうと...
© 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
@fenomas
アドビが提供HTML5ツールについて
Muse
一言でいうと、
コードいら...
© 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
@fenomas
アドビが提供HTML5ツールについて
Edge Animate
一言でいう...
© 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
@fenomas
アドビが提供HTML5ツールについて
Edge Reflow
一言でいうと...
© 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
@fenomas
アドビが提供HTML5ツールについて
Edge Code/Brackets...
© 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
@fenomas
5.Photoshopと
ワークフローと
Generatorの話
© 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
@fenomas
デザイナ
HTML5
ツール ライブラリ
プログラマ
壁
© 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
@fenomas
Generatorの話
Web開発向けの2新機能
© 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
@fenomas
Generatorの話
Web開発向けの2新機能
アセット生成
© 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
@fenomas
Generatorの話
Web開発向けの2新機能
Reflow連携
アセッ...
© 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
@fenomas
だがホントの主役は
「Generator」
という新機能
© 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
© 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
ExtendScript
© 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
KVLR
ExtendScript
© 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Node.js
KVLR
ExtendScript
Generator!
© 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
generator-core
Node.js
KVLR
ExtendScript
Gener...
© 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
generator-core
Node.js
KVLR
プラグイン
ExtendScript...
© 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
そしてさらに・・
© 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
@fenomas
ソースと説明:
github.com/andyhall/genera
to...
© 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
@fenomas
6.宣伝の話w
© 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
@fenomas
ツールの入手はCreative Cloudから
creative.adob...
© 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
@fenomas
ご清聴ありがとうございました!
詳細情報:
html.adobe.com/...
© 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
Upcoming SlideShare
Loading in …5
×

FITC2014 モダンなWeb

679 views

Published on

My deck from FITC 2014

Published in: Technology
  • Be the first to comment

FITC2014 モダンなWeb

  1. 1. © 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. モダンなWebはモダンなツールで創ろう! Andy Hall・アドビジャパン
  2. 2. © 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. @fenomas だれだこいつ @fenomas  日本在住歴もWeb歴も十数年  物理学専攻 → Web制作 → Flash開発 → アドビで色々  現在の肩書がテクニカルエバンジェリスト  興味はデザインとコードをまたぐところ  カタコトでゴメンね  ゲーム好き、などなど
  3. 3. © 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. @fenomas 1.Web開発に 関係なさそうな いきなりデモの話
  4. 4. © 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
  5. 5. © 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. @fenomas 2.アドビとHTML についての話
  6. 6. © 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. @fenomas Adobeとしての活躍 contribute to a better web better web experience bring innovations to the web better tools for the web
  7. 7. © 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. @fenomas CSS リージョン Webの進化の事例: 現状の対応: iOS7 (標準対応!) IE、Safari (プレフィックス) Chrome, Opera(有効に設定する必要がある) Webkit (ナイトリービルド)
  8. 8. © 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. @fenomas CSS フィルター Webの進化の事例: 現状の対応: Chrome, Safari, iOS, Opera (プレフィックス) filter: sepia(0.8);
  9. 9. © 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. @fenomas カスタム フィルター Webの進化の事例: 現状の対応: Chrome, Opera (有効に設定する必要がある) Webkit (ナイトリービルド)
  10. 10. © 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. @fenomas 詳細情報: html.adobe.com/jp
  11. 11. © 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. @fenomas 3.Web開発ツール の哲学的な話。
  12. 12. © 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. @fenomas ひと昔のWeb開発: ツール 作者 HTML
  13. 13. © 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. @fenomas ひと昔のWeb開発: 作者 HTML
  14. 14. © 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. @fenomas モダンなWeb開発: 作者 HTML5 ツール ライブラリ
  15. 15. © 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. @fenomas で、問題はこれ: HTML5 ツール ライブラリ デザイナ プログラマ
  16. 16. © 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. @fenomas で、問題はこれ: HTML5 ツール ライブラリ デザイナ プログラマ 壁
  17. 17. © 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. @fenomas
  18. 18. © 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. @fenomas 4.アドビが 提供するWeb開発 ツールの紹介
  19. 19. © 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. @fenomas アドビが提供HTML5ツールについて Dreamweaver 一言でいうと、 ページ作りから サイト管理までの 何でも屋さん
  20. 20. © 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. @fenomas アドビが提供HTML5ツールについて Muse 一言でいうと、 コードいらずの Webデザイン
  21. 21. © 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. @fenomas アドビが提供HTML5ツールについて Edge Animate 一言でいうと、 Webコンテンツに インタラクションと 動きを
  22. 22. © 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. @fenomas アドビが提供HTML5ツールについて Edge Reflow 一言でいうと、 レスポンシブWebの デザインツール
  23. 23. © 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. @fenomas アドビが提供HTML5ツールについて Edge Code/Brackets 一言でいうと、 Webに特化した テキストエディター
  24. 24. © 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. @fenomas 5.Photoshopと ワークフローと Generatorの話
  25. 25. © 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. @fenomas デザイナ HTML5 ツール ライブラリ プログラマ 壁
  26. 26. © 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. @fenomas Generatorの話 Web開発向けの2新機能
  27. 27. © 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. @fenomas Generatorの話 Web開発向けの2新機能 アセット生成
  28. 28. © 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. @fenomas Generatorの話 Web開発向けの2新機能 Reflow連携 アセット生成
  29. 29. © 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. @fenomas だがホントの主役は 「Generator」 という新機能
  30. 30. © 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
  31. 31. © 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. ExtendScript
  32. 32. © 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. KVLR ExtendScript
  33. 33. © 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. Node.js KVLR ExtendScript Generator!
  34. 34. © 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. generator-core Node.js KVLR ExtendScript Generator!
  35. 35. © 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. generator-core Node.js KVLR プラグイン ExtendScript プラグイン プラグイ Generator!
  36. 36. © 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. そしてさらに・・
  37. 37. © 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. @fenomas ソースと説明: github.com/andyhall/genera tor-awesome-ja
  38. 38. © 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. @fenomas 6.宣伝の話w
  39. 39. © 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. @fenomas ツールの入手はCreative Cloudから creative.adobe.com/
  40. 40. © 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential. @fenomas ご清聴ありがとうございました! 詳細情報: html.adobe.com/jp aphall.com @fenomas
  41. 41. © 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.

×