Ce diaporama a bien été signalé.
Nous utilisons votre profil LinkedIn et vos données d’activité pour vous proposer des publicités personnalisées et pertinentes. Vous pouvez changer vos préférences de publicités à tout moment.

ADC OnAir Season2 vol.01 - Adobe Edge Reflow

2012/02/20のADC OnAir Season2 vol.01 のスライドです。

ADC OnAir Season2 vol.01 - Adobe Edge Reflow

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

×