ワイヤーフレーム作成

web制作

■ワイヤーフレームを作成
ワイヤーフレーム…webサイトの骨組み、設計図、構成図。header,content,bannerなどブロック分け。

  1. 好きなホームページをスクリーンショット。
    全面表示→Pearl Crescent／Flashコンテンツをキャプチャー
  2. Illustratorにテンプレートで配置。
    アートボード左上に画像の基準を合わせる。
  3. ブロック毎に枠で囲む。
    テンプレート非表示でレイアウト確認。サイトの方でもWebDeveloper／枠表示で比較してみる。
  4. ブロック毎に、色分け＆レイヤー分け。
  5. ブロック以外のレイヤー（テンプレート）を削除。
  6. カラーモード変更
    ファイル／ドキュメントのカラーモード／RGBカラー
  7. psdファイルへ書き出し
    ファイル／書き出し／Photoshop形式（RGB、スクリーン、レイヤー保持、アンチエイリアス-OFF）