Webディレクションはじめの一歩(構成編)

WEBデザインを作成する際に一番大事なのはストーリーを意識して作成する事です。
本や映画などでもよく言われると思いますが、
起承転結を意識してサイトを作る事により、ユーザーがサイトを見ても飽きさせない又、必要な情報が何なのか？
を伝えないといけません。
重要な内容がページの下部にあると中々みてくれませんよね？
難しく考えなくても重要な情報や見てもらいたい情報は必然的に構成の上部に配置するのがベターです。
ただ重要な情報をならべるだけでなく、どんな会社なのか？
何が強みなのか？
どんなことをしてくれるのか？
がわかりやすく記載されているとユーザーもどんな会社やサイトなのか認識しやすくなります。
その流れの中で必要な情報は、下層ページの誘導ボタンを配置する事により回遊率を高めお問い合わせにつながるサイトに必然的になると思います。

WEBデザインはいきなりデザインは行いません。全体の構成をワイヤで書かれたワイヤーフレームといわれる、配置図(図面)のようなものを作成致します。

ワイヤーフレームを作成する際には色々なツールがございます。下記にて紹介させていただきます。

いきなりツールじゃないじゃんと思うかもしれませんが、手書きで書いても問題ないです。

メリット

• 紙とペンがあればすぐに作成できます。
• パソコンを使わない為時間の短縮ができます。
• ネット環境に影響されません。

デメリット

• ボールペンなどを使用するため、間違いの修正が難しい
• 線や図形をきれいに書くことがむずかしい。
• 補足のサイトやURLなどを書くのが大変。
• 同じのようなサイトの際に流用できない。
• お客さんへ確認が難しい。

Excelにて□や〇、テキストや線などを組み合わせて全体の構成を決めていきます。

メリット

• 綺麗に図形がかけ、また画像なども張り付けれるため見やすい。
• Adobeのソフトの様に使用も難しくなくだれでも修正が可能。
• Excelはもっているお客様が多いので共有も確認も可能。
• 同じ内容などは流用もしやすい。

デメリット

• Macとの互換性が難しい。
• バージョンにより、崩れることがある。
• データが手元にないと作業ができない。

Illustratorに慣れている人は図形などの挿入が簡単。
また直線曲線も綺麗に書ける。

メリット

• デザインに近い形でワイヤーが作れる
• 図形なども用意されていて直感的に作業ができる。
• データを残しておくと似てる案件の際に流用できる。

デメリット

• ソフトが使えないと作業ができない
• 使えない人と作業の分担が難しい。
• 互換性などもあり崩れる可能性がある。

Photoshopに慣れている人は図形などの挿入が簡単。
また直線曲線も綺麗に書ける。

メリット

• デザインに近い形でワイヤーが作れる
• 図形なども用意されていて直感的に作業ができる。
• データを残しておくと似てる案件の際に流用できる。
• 使って欲しい画像など加工して配置もできる

デメリット

• ソフトが使えないと作業ができない
• 使えない人と作業の分担が難しい。
• 互換性などもあり崩れる可能性がある。

Cacooに登録すると無料で6ページまで使うことができます。
サイトマップやワイヤーフレーム用の図形なども揃っているので便利です。

メリット

• クラウドなのでネット環境があれば作業ができる
• 図形なども用意されていて直感的に作業ができる。
• 簡単なテンプレートなども用意されている。

デメリット

• ネット環境がないと作業ができない
• 無料サービスなので仕様が変わる場合がある。
• 上記と一緒でデータがなくなる可能性がある。