1月の授業日記

1/2 サイトの構成

ワイヤーフレーム

  • ページのデザインする元となる設計時
  • ナビゲージョンや本文の基本的レイアウトをここで決めてくる
  • 好き嫌いが影響をあたえないようデザインと切り離して設計

    きょうのひとこと

    今日一日眠くて、午前中も死んでたのに午後もだめでした。

1/16 サイトのデザイン

コンテンツの構成

  1. 要素の抽出
    • 項目名を全てあげる
  2. カテゴライズ
    • グループごとにまとめる
  3. インデックス付け
    • グループごとにふさわしい見出しをつける
      • 一般的なキーワード=スキーマ

デザインと実装の分離

webではデザインとコーディングが分離されていてデザイン完成後、実装に入る

  • デザイン修正はコーディングもやり直しになる
  • コーディングのしやすさにとらわれず、デザインのバランスを保てる
  • 実装できるかを考えながらデザインする

デザイン

デザインテイスト

無意味な作り直しを避けるためにクライアントとどのようなテイストにするかを事前に決定しておく

複数案

クライアントが介在する場合、複数案を与えて選ばせることで制作への連帯感と選択への責任感を共有してもらえる

A案

  • メディアのイメージが具体的ではないためデザインしている感のあるTOPにしました

B案

  • おもちゃコースといえば「子供」のイメージですが、大人っぽいイメージをつけるためシンプルにしました

きょうのひとこと

授業が短く感じました。

1/23 デザイン

カラースキーム

カテゴリ毎の違いがわかりやすいようにカラーを設計し、それをキーカラーにページを展開する

メニューとタイトルの関係性の整理

メニューをクリックしたところがリンク先だとわかる必要がある

  • メニューとタイトルの位置関係
    • 極力メニューの近くへ配置し関係性を明確に
  • カラースキーム
    • 統一を周図り関係性を明快に
  • デザインカンプ

    デザインの完成状態のダミー

  • クライアントへのデザイン承認
  • 画像パーツはここから切り出しコーディングで再現

きょうのひとこと

眠くて飛ばしている部分があるかもしれません。。。こんなに眠いのは久々でした。