斜め読み

//24ways.org/2008/easing-the-path-from-design-to-development">Easing The Path from Design to Development:24 waysの今年版のエントリより。定番の開発者とデザイナの協業がお題。以下斜め読んだこと

技術的観点から検討されたデザインは、進捗・予算面でプロジェクトが破綻させないようにしてくれる・・・、ということでページカンプ作る人が意識すると大変有益なポイントを列挙してる。ウィンドウサイズは可変、ズームできること、JSがいつもオンとは限らない、ログイン／ログアウトがある、ユーザのアクションにフィードバックがあるか、以下斜め読んだ限りでのまとめ。

• レイアウト
  • 固定？リキッド？
  • ウィンドウサイズが変わるとき／変えるときに表示がどう変わるか
• テキストサイズとコンテンツの分量
  • ブラウザのテキストズームに対して柔軟か？
  • グラフィックがウィンドウサイズなどの可変に対して柔軟か？
• JSを使った／使わないインタラクション
  • ページ内のインタラクティブな要素は、jsオン環境／jsオフ環境を想定した振る舞いか？
• ログイン／ログアウト
  • ログインユーザ／ログアウトユーザに応じたページ表示があるか？
    • ログインユーザのみが見れるコンテンツ
  • jsオン環境／jsオフ環境どちらでもログインできるように設計されてるか？
• フォント
  • タイプフェイスの選択には控えめであるべき
  • OSにバンドルされてるフォントを把握
  • sIFRやcanvas要素を使うと使えるtypefaceの幅は広がるが、トレードオフを意識してどうするか決める
• メッセージング
  • インタラクティブ要素がエラー／successメッセージをユーザに返す設計になってるか？
• フォーム要素
  • 各フィールドがラベルを持ってるか？
  • sugmitがフォームごとにあるか
• 実践的tips
  • カンプ(psd、png）は、レイヤーをグループ化しておく。グループやレイヤーには名前をつける
    • jsオフ／オン、ログイン／ログアウトの各状態に応じたデザインが把握しやすくしておく
  • 閲覧用にpdfを作って、各ページ、各状態が一覧できるようにする
    • 開発者が使うリファレンスになる。
  • 色見本を作成する。
    • 開発者が何度も何度もカラーピッカーを使う手間を割愛できる