1/9 サイトの構成
ワイヤーフレーム
- ページをデザインする元になる設計図
- ナビゲーションや本分の基本的レイアウトをここで決めていく
- 好き嫌いが影響を与えないようデザインと切り離して設計
今日の一言
XDは基本操作を覚えたつもりだったがコピーの仕方などまだ知らないことがあるので、勉強になりました。
1/16 サイトのデザイン
コンテンツの構成 ＊テスト
- 要素の抽出
- 項目を全てあげる
- カテゴライズ
- グループごとにまとめる
- インデックス付け
- グループにふさわしい見出しをつける
- 一般的なキーワード＝スキーマ
- グループにふさわしい見出しをつける
デザインと実装の分離 ＊テスト
webではデザインとコーディングが分離されていてデザイン完成後実装に入る
- デザイン修正はコーディングのやり直しにつながる
- コーディングのしやすさにとらわれずデザインのバランスを保てる
- 実装できるかを考えながらデザインする
デザイン
デザインテイスト
無意味な作り直しを防ぐためにクライアントとどのようなテイストにするかを事前に決定しておく
複数案
・デザインで使用するディテールをメインに使用してデザイン科を表しました。
今日の一言
デザインと実装の分離をすることで、グループワーク同様適材適所で仕事を行えるので効率が良いなと思いました。
1/23 デザイン
カラースキーム
カテゴリ毎の違いがわかりやすいようにカラーを設計し、それをキーカラーにページを展開する
メニューとタイトルの関係性の整理
メニューをクリックしたところがリンク先だとわかる必要がある
- メニューとタイトルの位置関係
- 極力メニュー近くへ配置し関係性を明確に
- カラースキーム
- 統一を図り関係性を明快に
- 表記の統一
- 統一を図り関連性を明快に
デザインカンプ
デザイン完成状態のダミー
- クライアントへのデザインの承認
- 画像パーツはここから切り出しコーディングで再現
今日の一言
的確な値でレイアウトを決めることで、サイト作りのコーディングの点で便利であるとわかりました