12月の授業日記

12/2 企業サイト制作

商業デザイン

お金をもらって作るデザイン

価値判断の基準

どこに優先順位を置くか

制約の中で制作

  • 時間
  • 予算
  • web制作に関わるスタッフ

    1. クライアント
    2. プロヂューサー(予算配分)
    3. ディレクター(実制作の総指揮)
    4. デザイナー(html・CSSレベルは担当することも)
    5. プログラマー・コーダー

    web制作のワークフロー

    プレゼンテーション

    1. オリエン
    2. 企画・構成・デザイン案
    3. プレゼン

    実制作

    1. 原稿作成・編集
    2. パーツデザイン
    3. コーディング
    4. テスト・デバック

    完成・納品

    更新

    コンテンツ

    • どのようなコンテンツがあるか

    メニュー

    • グローバル項目。ローカル項目数/どういったナビゲーションか

    技術

    CMS、動画等どのような技術を用いるかはスタッフィングや予算設定に大きな影響を与えます。また、スマートフォンの普及に伴い、スマートフォン専用のレイアウトを持つサイトが増えてきています。スマートフォンレイアウトに対応させる場合、それぞれのレイアウトやCSS指定が必要。

    第一印象

    第一印象として簡単に箇条書きで記録しておきましょう。

    好ましい点

    良いと思った点を挙げて自社サイト企画に取り入れる参考にしましょう。

    問題点

    問題点を把握して自社サイトが陥らないように記録しておきましょう。

    企画・構成

    既存サイトの分析

    客観性

    評価の指標には客観性が求められる

    1. 市場調査・分析
    2. 競合分析
    3. 既存サイト分析

    ユーザーニーズや競合との比較からどうあるべきかを導く

    競合分析

    きょうのひとこと

    他の県の専門学校を調べました。それぞれに特徴があり、楽しい調査でした。

    12/9 情報設計

    ウェブは物理的にページ遷移が行えない

    情報設計

    1.  到達手段の整備=ナビゲーション
    2. 情報自体の整理=カテゴライズ 

    ナビゲーション

    ナビゲーションに求められる要件

    • リンクの存在・リンクと判るデザイン
    • スクロールせずに操作可能>ファーストビューエリア
    • 各ページ同じ法則を保つ

    ナビゲーションの種類

    グローバルナビゲーション

    • トップ第一階層のナビ
    • 全てのページのスクロール不要な同じ場所に配置

    ローカルナビゲーション

    • カテゴリー内の移動するためのナビ

    コンテンツ内ナビゲーション

    • ページ内要素が多い場合の見出しとリンクを兼ねたもの

    ナビゲーションのレイアウト

    水平線

    主にグローバルナビゲーション

    • スクロール不要で使い勝手に優れる
    • 項目数・文字数の制約を受ける

    垂直型

    変更の可能性があるローカルナビなど

    • 項目数の増減に柔軟に対応
    • 下部は操作性が劣る

    プルダウンメニュー

    • 垂直・水平のメリットを組み合わせられる
    • 使いづらい側面も

    既存サイト分析と提案

    コンテンツの分析

    • どれもYDAほどごちゃごちゃしていませんでした
    • 動画や校内360°見学など、魅力的なコンテンツがあった

    きょうのひとこと

    今日は学校の回線が弱いなと思いました。あまり時間がなくて学科分析しっかりとできませんでした。

    12/16 コンテンツ提案とマルチデバイス対応

    マルチデバイス対応

     セパレートURL デバイスごとのページを用意し切り替える 
     レスポンシブwebデザイン  同一ページをデバイス毎のCSSで切り替え
     動的配置  DBで切り替える

    レスポンシブwebデザイン

    メディアクエリでデバイス幅に応じCSSを切り替え 

    既存コンテンツの分析と提案

    コンテンツの分析

  • 写真が多く学生生活が伝わる
  • ごちゃごちゃして見辛い
  • スクロールが大変
  • 学科・コースがわかりづらい
  • スマートフォンレイアウトがない
  • 作品紹介がない
  • 具体的な授業内容がわかりづらい
  • 課題と解決策

  • ごちゃごちゃして見辛い
  • スクロールが大変
  • 学科・コースがわかりづらい
  • スマートフォンレイアウトがない
  • 作品紹介がない・具体的な授業内容がわかりづらい
  • スペシャルコンテンツの導入
  • 企画コンテンツ案

    やりたいもの

    実現性の高いもの

    web制作物の流れ

    きょうのひとこと

    企画考案が難しかったです。もう少ししっかり考えたいと思います。

    12/22 ワイヤーフレーム

    きょうのひとこと

    今日はXDの作業だったのでスムーズにできました。