12/3 情報設計
ウェブサイトは物理的に行えない
情報設計
- 情報の自体の整理=カテゴライズ
- 達成手段定理=ナビゲーション
ナビゲーション
ナビゲーションに求められる要件
- リンクの存在・リンクとわかるデザイン
- スクロールせずに操作可能>ファーストビューエリア 各ページで同じ法則を保つ
ナビゲーションの種類
グローバルナビゲーション- トップ第一層のナビ
- 全てのページにスクロース不要な位置に配置
- カテゴリー内を移動するときのナビ
- ページ内容が多い場合見出しとリンクを兼ねたもの
ナビゲーションのレイアウト
水平型主にグローバルナビゲーションに用いられる
- スクロール 不用意で勝手に優れる。
- 項目数・文字数に制約を受ける。
変更の可能性があるローカルナビなどに用いたられる。
- 項目数の増減に柔軟に対応可能
- 下部の操作性は劣る。
- 垂直・水平のメリットを組み合わせられる。
- 使うずらい面もある。
既存のサイト分析と提案
コンテンツの分析
何だろう遊び心とか?きっちりしてるから見て驚くものとかあってもいいと思う。
今日の一言
疲れた
12/10 コンテンツ案とマルチデバイス対応
マルチデバイス対応
デバイスによってレイアウトを切り替える手順は以下の通りである。
- セパートURL>デバイス毎ページを用意し切り替える
- レスポンシブwebデザイン>同一HTMLをデバイスごとcss切り替える。
- 動的配信>DBでデバイスの幅に応じてファイル出力
レスポンシブWEBデザイン
メディアリエでデバイスの幅などの条件分岐させる
企画コンテンツ案
やりたいこと
- 画面が動く
- ちょっとしたゲームができる
- 楽しい
実現可能
- 動かすのはできそう
- でもゲームは作れないと思う
WEB制作物の流れ
- サイトマップ(サイト全体のレイアウト)
- ワイヤーフレーム(ページ構成)
- デザインカンプ(ページデザイン)
- コーディング(ページの作成) 1〜3はXD
今日の一言
XDのアプデした
12/24 ワイヤーフレーム
- ページをデザインする元となる設計図
- ナビゲーションや本文の基本的なデザインを決める
- 好き嫌いが反映しないようデザインと切り離す
今日の一言
XD難しい