Blog
デザインを確認する際のポイント
Webデザイン制作とは?
Webデザインの実務とは?
Adobe Photoshop
Webサイト全体のコンテンツの配置や装飾を行うことが出来ます。画像編集や加工などもソフト内で行うことができます。
Adobe XD
Photoshop同様コンテンツやテキストの配置と装飾を行うことが出来ます。プロトタイプを作成することが出来るためより実際のWebサイトのイメージがしやすくなります。
Adobe llustrator
ベクターデータで図形やイラストを作成することが出来ます。
主にロゴやアイコンを作成します。
Webデザインのチェックポイント
デザインコンセプトに沿っているか?
クライアントやディレクターで決めたWebサイトのコンセプトがしっかり反映されているか確認しましょう。Webサイトを利用するターゲットがあらかじめ決まっているはずなのでそのターゲットに向けたWebサイトとして正しく機能するかをしっかり考えましょう。
設定したトンマナを踏襲しているか?
トンマナとは
トンマナとは、トーン&マナーの略でありWebサイト全体の配色や色調を意味するトーンとWebサイトの形式を意味するマナーを合わせたもので、Webサイト全体のデザインルールを決めます。
トンマナが揃っていることによってWebサイトの利用者が内容の理解をしやすくなります。
逆にWebデザインのトンマナが揃っていないとWebサイト全体の一貫性が損なわれます。
完成したWebデザインを受け取った際は指示通りのトンマナが細部まで揃っているかしっかり確認しましょう。
ワイヤーフレームに沿った構成要素が配置されているか?
Webサイトの構成要素が設計図であるワイヤーフレームに沿って配置されているかを確認しましょう。デザインデータにワイヤーフレームにはない要素が含まれていたり、指示とは異なる構成になっていた場合、Webサイトの完成イメージに差異が出るため、ワイヤーフレームからの変更点があった場合はその理由を確認しましょう。
レイアウトルール、ナビゲーションルールが適合しているか?
Webサイトの要素のレイアウトやページ移動のナビゲーションはとても重要です。同じWebサイト内でレイアウトやナビゲーションに差異があると利用者が混乱しWebサイトからの離脱率が上がります。
Webサイト内ので使用するアイコンやレイアウトのルールが全て統一されているかを確認しましょう。
ワイヤーフレームで定義された意図が反映されているか?
ワイヤーフレーム制作の時点でWebサイト全体のイメージは、ほぼ固まっています。
ワイヤーフレームを制作する際に定義された構成の意図をWebデザイナーに伝えましょう。
Webデザインをワイヤーフレームと照らし合わせて確認する際は配置だけでなくしっかり構成の意図が反映されているかを確認しましょう。
複数ページを確認する場合のチェックポイント
デザインルールが統一されているか?
コーポレートサイトやECサイトなど複数ページがあるWebサイトのデザインを確認する場合は全てのページのデザインルールが統一されているかを確認する必要があります。
特にページ移動のためのナビゲーションがページごとに変わると移動に時間がかかり利用者のストレスになります。
ナビゲーションやボタンのデザインルールが統一されているかを全ページで確認しましょう。