ADC OnAir Season2 vol.01 - Adobe Edge Reflow
-
Upload
naoki-matsuda -
Category
Documents
-
view
1.024 -
download
0
description
Transcript of ADC OnAir Season2 vol.01 - Adobe Edge Reflow
RWDのワークフローのおさらい
•早めの段階でのプロトタイプ設計がキモ
•デザインカンプ、各デバイスごとに作ってられない
•デザイナー/実装者の相互理解
従来通りの
ワークフローでは
無理が生じてくる
レスポンシブWebデザイン煩雑になるワークフローの救世主?
AdobeEdge
Re!ow
ほんの少し触ってみましょう
何ができる?
• Break Point (Media Queries) の設定• 可変グリッドに沿ったボックスの配置• Fluidな画像の挿入• box-shadow, text-shadow,border-radiusなど、CSS3による装飾
コードを記述することなく、
他製品との連携も
• CSSスニペットの生成 ( → DWなどへ)• ブラウザでのPreview• Edge Web Fonts サービスの導入• Edge Inspect との連携による、実機でのリアルタイム確認
Edge Inspect との連携による実機でのリアルタイム確認
直接Previewできる!
でもまだまだ、プレビュー版。
お忘れなく。
どういったケースで
使える?
デザイナー・ディレクターがクライアントワークで使ってみる
• コードを書く必要がないので、本実装に入る前のプロトタイプ設計に使える
• 実際に動くデザインカンプの代わり、として使える
つまり、ワークフロー上の早い段階でレスポンシブのイメージを共有するためのプロタイプ作りに最適
(と思う)
こんなケースには向いていない
• コーダーやエンジニアが、本実装のオーサリングツールとして使う
• コードを直接調整できない• サイト定義的な、複数ページの制作に非対応
• まだまだ操作性がいまいち• だって、プレビュー版ですから
あくまで、「デザイン(設計)ツール」としての位置づけ
こんな感じで育ってほしい(個人的には)
プロトタイピングツールとしての機能向上求む!
• CSSでの装飾機能よりも、レイアウト機能に柔軟さを
• モジュール(ステンシル)機能• 複数人でのコラボレーション機能
CSSフレームワークの取り込みできたらなぁ
• 主要なフレームワークの Componentsを流用できたら神ツール
Edge シリーズはユーザーの声を多く拾っていく
コンセプトとのこと
みんなで使って育てましょう
Adobe Edge Re!owでよりよいワークフローを