Designer meets Designers 04 "IA" 20081002

1,006 views

Published on

Published in: Design
  • Be the first to comment

Designer meets Designers 04 "IA" 20081002

  1. 1. そのサイトが そのデザインである理由 坂本貴史 Designer meets Designers 04 2008.10.02
  2. 2. コンセプト Concept Design デザイン
  3. 3. ネットイヤーグループ 指針の重要性 デザイン実例
  4. 4. http://www.netyear.net
  5. 5. 大規模プロジェクトの経験 サイトガバナンスのコンサルティング能力 ユーザー視点での情報設計能力 ブランド力を高める最高のクリエイティブ
  6. 6. 戦略 設計 制作 運用 マーケティング戦略 ブランド戦略 ウェブガバナンス戦略 情報設計 デザイン システム設計 制作・開発 検証 ガイドライン サイト更新 効果測定・ログ解析 システム保守
  7. 7. 戦略 1∼4カ月 設計 1∼4カ月 制作 2∼8カ月 運用 継続 全体 6カ月∼1年
  8. 8. インフォメーション アーキテクト アート ディレクター テクニカル ディレクター プロジェクト マネージャー クライアント クリエイティブ ディレクター プロデューサー
  9. 9. プロデューサー 営業窓口 プロジェクトマネージャー プロジェクト責任 クリエイティブディレクター クリエイティブ責任 インフォメーションアーキテクト 情報アーキテクチャ アートディレクター デザイン テクニカルディレクター テクノロジー
  10. 10. プロジェクト 責任 顧客 情報アーキテクチャ デザイン テクノロジー クリエイティブ責任 営業窓口
  11. 11. 営業窓口 クリエイティブ責任 プロジェクト責任 情報アーキテクチャ デザイン テクノロジー ?
  12. 12. インフォメーション アーキテクト アート ディレクター テクニカル ディレクター プロジェクト マネージャー クライアント クリエイティブ ディレクター プロデューサー パートナー会社
  13. 13. ワークフロー 体制 役割 用語の解説 成果物サンプル コミュニケーションルール
  14. 14. 認知 興味・比較 購入 体験  雑誌 店頭 口コミ 営業 Webを中心に考えるコミュニケーション Web-Centric Communication CM Web
  15. 15. Web情報アーキテクチャ The Three Circles of Information Architecture だれに どのように なにを
  16. 16. 企業理念 Corporate Philosophy
  17. 17. 経営理念 サイトコンセプト 行動指針 表現指針 ブランドコミュニケーション デザイン 企業理念
  18. 18. 戦略 設計 制作 運用 4つのフェーズのうち、前半2つが考えるフェーズである
  19. 19. 手を動かすタスク考えるタスク
  20. 20. 企画 定義・ルール 主要作成 量産・更新 画面設計というタスクのうち、前半2つが考えるタスク これがスケジュール(ガントチャート)に入っていないと、そもそも考える時間がない
  21. 21. サイトコンセプト Site Concept
  22. 22. 定量調査 定性調査 DATA IMAGE 意識調査 インタビュー アンケート …… アクセス ログ解析 コンバージョン ……
  23. 23. 企業サイト調査 Websites Ranking
  24. 24. 企業ブランド調査 Brands TOP 100 Ranking
  25. 25. 事例 サイトミッション サイトの使命・任務 「……機会と行動を生み出す」で終わるコピー サイトビジョン サイトの理想像 訪れたユーザーにどうなってほしいか サイトバリュー サイトを構築・運営していく上で 配慮すべき取り組みや姿勢・原則など
  26. 26. サイトコンセプト ビジネスニーズ ユーザーニーズ Business Needs Site Concept User Needs
  27. 27. ビジネスニーズ 企業の資産 担当者へのヒアリング ユーザーニーズ ユーザーへのインタビュー グループインタビュー
  28. 28. 表現指針 Creative Brief 
  29. 29. サイトコンセプト 表現指針 デザイン Creative Brief 
  30. 30. 事例 サイトミッション 社外、社内ともにブランドの再認識 表現指針 「安定感を基本としつつ……」から始 まるキーワードが含まれたコピー
  31. 31. ブランドアイデンティティ ブランドイメージ Brand Identity Brand Image ユーザーの持つイメージ企業が持つブランドの源泉 企業の資産 担当者へのヒアリング アンケート調査
  32. 32. 5つの因子 肯定的な ブランド資産 望ましい ブランド資産 伝わっている イメージ 伝わりきれていない イメージ 誠実因子 刺激 能力 洗練 素朴 ブランドアイデンティティとブランドイメージの比較 Compare
  33. 33. サイトコンセプト 表現指針 デザイン Creative Brief  文字 カラー フォルム インタラクション
  34. 34. 文字 例)標準的な文章にはすべてゴシック体、魅力のあるキャッ チコピーやメッセージには明朝体を使用します。 Typography あア安 あア安
  35. 35. カラー 例)コーポレートカラーのほかにアクティブな配色とダーク な配色で組み合わせます。 Color 言語スケール カラースケール
  36. 36. フォルム 例)矢印「→」のようなアイコンにはすべて三角形「▲」を 使って表現します。 Form
  37. 37. インタラクション 例)モノクロのイメージにマウスオーバーをすると、色がつ く、音が出る、映像が動きだす Interaction !♪
  38. 38. デザイン Design
  39. 39. サイトコンセプト 表現指針 デザイン Design デザイン
  40. 40. 論理的なレイアウト 構造のわかりやすさ 目的とナビゲーション 検索のしやすさ Design デザイン
  41. 41. 論理的なレイアウト 構造のわかりやすさ 目的とナビゲーション 検索のしやすさ Design デザイン
  42. 42. コンテンツ(本文) 文脈(現在位置を示すナビ) 関連(関連リンク) コンテンツページデザインにおける最善の方法 Content Page Design Best Practice
  43. 43. エリア定義 Area Definition
  44. 44. 論理的なレイアウト 構造のわかりやすさ 目的とナビゲーション 検索のしやすさ Design デザイン
  45. 45. ニュース イントロダクション 予告編 ダウンロード 劇場情報 映画のプロモーションサイトのメニュー標準
  46. 46. サービス サポート 企業 ニュース 企業サイトのメニュー標準
  47. 47. サービス サポート 企業 ニュース 独自
  48. 48. サービス サポート 企業ニュース ? 独自の情報分類と企業の主張
  49. 49. サービス サポート 企業 独自 ブランド 目的 ニュース 独自の情報分類をメニューとして独立した例
  50. 50. 論理的なレイアウト 構造のわかりやすさ 目的とナビゲーション 検索のしやすさ Design デザイン
  51. 51. 目的 Structure Goal 基本構造
  52. 52. ニュース サービス サポート 企業情報 目的の情報 目的 Structure Goal 基本構造
  53. 53. 論理的なレイアウト 構造のわかりやすさ 目的とナビゲーション 検索のしやすさ Design デザイン
  54. 54. 検索 Search 目的別 画面にキーワードとビジュアルを掲載 サイト内検索 サジェスト機能を追加 履歴 過去の履歴をナビゲーションとして活用
  55. 55. 論理的なレイアウト 構造のわかりやすさ 目的とナビゲーション 検索のしやすさ Design デザイン
  56. 56. ネットイヤーグループ 指針の重要性 デザイン実例
  57. 57. スキルIAInformation Architect Skill 書籍 連載 講演 ブログ
  58. 58. Thank you. http://www.bookslope.jp/blog/

×