「ウェブ構築プロセスのまとめ」の版間の差分
編集の要約なし |
編集の要約なし |
||
| 1行目: | 1行目: | ||
<div id="manual"> | <div id="manual"> | ||
ウェブ構築におけるデザインプロセスのまとめです。<br> | |||
ここでは、Jesse James Garrettの「5 Planes Model」を参考にしていますが、ここでまとめたプロセスはゴールに至るまでの手法の一つに過ぎません。そもそも、デザインプロセスに正解はないのです。そのプロジェクトの目的や状況や様々な制約により、メンバーたちがその都度考え、柔軟に対応していくことが求められます。 | |||
==第1フェーズ:戦略== | ==第1フェーズ:戦略== | ||
| 6行目: | 8行目: | ||
まず戦略面で明確にすべきは以下の2点です。 | まず戦略面で明確にすべきは以下の2点です。 | ||
●'''サイトの目的''' | ●'''サイトの目的'''…サイトから、自分たち(クライアントのこと)は何を得たいのか。あるいは、ウェブサイトから得たいビジネス上の成果は何か。 | ||
●'''ユーザーニーズ''' | ●'''ユーザーニーズ'''…訪れるユーザーは何を求めているのか。どのような問題を抱えているのか。 | ||
<p> | <p>この2つ(ビジネス側/ユーザー側)の両視点から、「なぜデザインするのか?」、「何をデザインするのか?」を最初に定義します。問題の定義とは、どんな問題を解決しなければいけないのかという哲学であり、どう解決するかを示すビジョンです。あるべき姿であり、それとのギャップを計るための現状の理解です。</p> | ||
| 20行目: | 22行目: | ||
===[[コアメンバーの決定]]=== | ===[[コアメンバーの決定]]=== | ||
今回のプロジェクトに中核となるメンバーを決定します。 | |||
===[[プロジェクト定義書]]=== | ===[[プロジェクト定義書]]=== | ||
====役割==== | |||
定義書は | |||
====項目==== | ====項目==== | ||
・プロジェクトの目的(あるいは哲学) | ・プロジェクトの目的(あるいは哲学) | ||
| 38行目: | 44行目: | ||
===[[競合調査]]=== | ===[[競合調査]]=== | ||
競合サイトを調査して、品質、機能、コンテンツの有無などを比較し、その特徴を把握します。 | |||
===[[ブレインストリーミング]]=== | |||
アイディア出しの場であるブレストは、あくまで必要に応じて、その都度行います。 | |||
===[[ユーザーセグメント]]=== | ===[[ユーザーセグメント]]=== | ||
| 54行目: | 62行目: | ||
==第3フェーズ:構造== | ==第3フェーズ:構造== | ||
ここでは、戦略や要件といった抽象的な問題から、具体的な要素へと論点は移行します。ディレクトリ設計、ページ数、ナビゲーション設計などを行います。 | |||
==第4フェーズ:骨格== | ==第4フェーズ:骨格== | ||
画面設計、ワイヤーフレームです。ページ内の要素を全て決めるため、マークアップも可能です。 | |||
==第5フェーズ:表層== | ==第5フェーズ:表層== | ||
表層フェーズでは、ビジュアルデザイン、最終的な見た目のデザインを行います。 | |||
==第6フェーズ:実装== | ==第6フェーズ:実装== | ||
2009年1月16日 (金) 15:59時点における版
ウェブ構築におけるデザインプロセスのまとめです。
ここでは、Jesse James Garrettの「5 Planes Model」を参考にしていますが、ここでまとめたプロセスはゴールに至るまでの手法の一つに過ぎません。そもそも、デザインプロセスに正解はないのです。そのプロジェクトの目的や状況や様々な制約により、メンバーたちがその都度考え、柔軟に対応していくことが求められます。
第1フェーズ:戦略
まず戦略面で明確にすべきは以下の2点です。
●サイトの目的…サイトから、自分たち(クライアントのこと)は何を得たいのか。あるいは、ウェブサイトから得たいビジネス上の成果は何か。
●ユーザーニーズ…訪れるユーザーは何を求めているのか。どのような問題を抱えているのか。
この2つ(ビジネス側/ユーザー側)の両視点から、「なぜデザインするのか?」、「何をデザインするのか?」を最初に定義します。問題の定義とは、どんな問題を解決しなければいけないのかという哲学であり、どう解決するかを示すビジョンです。あるべき姿であり、それとのギャップを計るための現状の理解です。
ヒアリング
クライアントの担当者と会って、依頼内容と目的、予算、スケジュール、現状の把握、問題の洗い出しなど聞いた上でまとめます。
ヒアリングは直接会う前に、あらかじめメールでヒアリングシートを送り、事前に文章で答えてもらいます。そうすることで、あらかじめ整理してもらった情報を理解したうえで、さらに詳しくヒアリングする内容を検討できますし、質問を受ける側も問題を整理しやすく、ヒアリング時の受け答えがズムーズになります。
コアメンバーの決定
今回のプロジェクトに中核となるメンバーを決定します。
プロジェクト定義書
役割
定義書は
項目
・プロジェクトの目的(あるいは哲学) ・プロジェクトのゴール(あるいはビジョン) ・ターゲットユーザー ・スコープ(範囲) ・実現の方法 ・実現の期間 ・調査が必要な事柄 ・制約条件、前提条件 ・プロジェクト体制、利害関係 ・コミュニケーションの方法
現状サイト調査・分析
競合調査
競合サイトを調査して、品質、機能、コンテンツの有無などを比較し、その特徴を把握します。
ブレインストリーミング
アイディア出しの場であるブレストは、あくまで必要に応じて、その都度行います。
ユーザーセグメント
プロジェクト体制図
戦略策定書
第2フェーズ:要件
サイトの目的(ビジネスのゴール)とターゲットユーザーのニーズを満足する機能要求とコンテンツを決める。
第3フェーズ:構造
ここでは、戦略や要件といった抽象的な問題から、具体的な要素へと論点は移行します。ディレクトリ設計、ページ数、ナビゲーション設計などを行います。
第4フェーズ:骨格
画面設計、ワイヤーフレームです。ページ内の要素を全て決めるため、マークアップも可能です。
第5フェーズ:表層
表層フェーズでは、ビジュアルデザイン、最終的な見た目のデザインを行います。