Download - FITC2014 モダンなWeb
© 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
モダンなWebはモダンなツールで創ろう!Andy Hall・アドビジャパン
© 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
@fenomas
だれだこいつ
@fenomas
日本在住歴もWeb歴も十数年
物理学専攻→ Web制作→ Flash開発→アドビで色々
現在の肩書がテクニカルエバンジェリスト
興味はデザインとコードをまたぐところ
カタコトでゴメンね
ゲーム好き、などなど
© 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
@fenomas
1.Web開発に関係なさそうないきなりデモの話
© 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 web
better web experience
bring innovations to the web better tools for the web
© 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
@fenomas
CSS リージョン
Webの進化の事例:
現状の対応: iOS7 (標準対応!)IE、Safari (プレフィックス)Chrome, Opera(有効に設定する必要がある)Webkit (ナイトリービルド)
© 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
@fenomas
CSS フィルター
Webの進化の事例:
現状の対応: Chrome, Safari, iOS, Opera(プレフィックス)
filter: sepia(0.8);
© 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
@fenomas
カスタムフィルター
Webの進化の事例:
現状の対応:Chrome, Opera(有効に設定する必要がある)
Webkit (ナイトリービルド)
© 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
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
一言でいうと、
コードいらずのWebデザイン
© 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
@fenomas
アドビが提供HTML5ツールについて
Edge Animate
一言でいうと、
Webコンテンツにインタラクションと動きを
© 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
@fenomas
アドビが提供HTML5ツールについて
Edge Reflow
一言でいうと、
レスポンシブWebのデザインツール
© 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
@fenomas
アドビが提供HTML5ツールについて
Edge Code/Brackets
一言でいうと、
Webに特化したテキストエディター
© 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.
Node.js
KVLR
ExtendScript
Generator!
© 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
generator-core
Node.js
KVLR
ExtendScript
Generator!
© 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
generator-core
Node.js
KVLR
プラグイン
ExtendScript
プラグイン プラグイン
Generator!
© 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
@fenomas
ソースと説明:
github.com/andyhall/genera
tor-awesome-ja
© 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
@fenomas
ツールの入手はCreative Cloudから
creative.adobe.com/
© 2012 Adobe Systems Incorporated. All Rights Reserved. Adobe Confidential.
@fenomas
ご清聴ありがとうございました!
詳細情報:
html.adobe.com/jp
aphall.com
@fenomas