ワイヤーフレームについて知るべきこと!基本概念と効果的な作成方法を解説!

2024.08.02(FRI)

ワイヤーフレームとは?

まず、ワイヤーフレームとは何かについて説明しましょう。
ワイヤーフレームとは、簡単に言えば、設計図のことです。
デザイナーがクリエイティブを依頼された際、そのサービスやキャンペーンについて事前知識が全くないことがほとんどです。
デザイナーもプロジェクトに参加後、自分でサービスを使って研究したり競合を調査したりしますが、短期間でそのサービスやキャンペーンの概要を100%理解し解決することは不可能です。
したがって、プロジェクトマネージャーや営業の方は、デザイナーに対して「誰が、いつ、どこで、どのような課題を、なぜ、どのように解決しようとしているのか」をわかりやすく伝える必要があります。

ワイヤーフレームとは、企業の担当者がデザイナーやエンジニアに対して「こういう問題をこう解決してほしい」という企画書や設計図なのです。

良いワイヤーフレームの条件

では、どのようなワイヤーフレームが良いのでしょうか?
個人的には制作サイドに対して要件定義が済んでおり、なるべく画面設計まで固めつつも、デザイナーが提案できる余地があるワイヤーフレームが良いと考えます。

要件定義とは、プロジェクトの開発においてどのような機能が必要かがまとめられているドキュメントのことです。
画面設計とは、ユーザーに対してどのような体験をさせたいかを決めた上で、そのユーザー体験を達成するために必須最低限の要素をまとめてレイアウトしたドキュメントのことです。

自走できるデザイナーは、ある程度必要な情報や要件を共有してもらえれば、自分でどのようにすればターゲットが満足するかを考えて提案してくれます。
そのため、要件を固めすぎないのも一つのポイントです。提案が出せないデザイナーは、問題を解決するマインドが欠けているので、クライアントに提案して期待値をフルスロットルで実現できるようになりましょう。
提案できないデザイナーは、今後厳しい状況に直面するでしょう。

ワイヤーフレームを作成するためのツール

次に、ワイヤーフレームを作成するためのツールについてお話しします。
多くのオフィスではExcelやPowerPointが使われていますが、これにはいくつかの問題点があります。
一つ目は、ソフトの値段が高いため、Officeを持っていないという問題です。
別のソフトで開いて表示が崩れたり、先方の意図がクリエイティブサイドに伝わりにくかったり、ドキュメント名が文字化けしてしまったりすることがあります。

二つ目の問題点は、ワイヤーフレームの段階では画像や文章の変更が多いため、変更があるたびにオフィスソフトを送らなければならず、そのメールでのやり取りで時間効率が非常に悪いことです。

そこでおすすめなのがGoogleスライドをです。
Googleスライドとは、Googleが提供するクラウドのプレゼン資料をオンラインで複数人で編集することが可能な、とても素晴らしいツールです。
しかもGoogleアカウントさえあれば無料で利用することができます。

5W1Hの記入

まず最初に、なぜこのクリエイティブを作ることになったのか、5W1Hを書き出します。
つまり、「誰が、いつ、どこで、どのような課題を、なぜ、どのように解決しようとしているのか」を明確にします。
主語を明確に表記することも重要なポイントです。

情報属性の分け方

次に、フライヤーの内容のテキストを情報属性に分けて記入します。
今回は、ユーザーの注目を集めるためのキービジュアル、キャンペーンの概要、お問い合わせ詳細の3つの情報属性に分けてテキストを書いていきます。

フライヤーの中のテキストを入れる際に、ダミーテキストではなく、できるだけ事前に決めておいたテキストを入れることが望ましいです。
ダミーテキストだと後から何度も変更が必要になることがあり、その度にデザイナーが作業を繰り返すことになります。
テキストの必要な文字数を先行して伝えておくことで、再度の調整を防ぐことができます。

サンプルの提供

最後に、自分がクリエイティブサイドでない場合や、新しくジョインしたデザイナーに仕事を依頼する際には、最終アウトプットがイメージと異なるものになることがあります。
そこで、Webで目指しているデザインや現状のクリエイティブを数点見つけてサンプルとして提供しておくと、着地点が大きく異なるクリエイティブが出ることを防げます。

まとめ

ワイヤーフレームは、デザインプロジェクトの成功に欠かせない重要な要素です。
良いワイヤーフレームを作成するためには、要件定義と画面設計をしっかりと行い、デザイナーが提案できる余地を残しておくことが大切です。
また、ツール選びも重要で、Googleスライドのようなオンラインで複数人で編集できるツールを利用することで、効率的な作業が可能になります。
ワイヤーフレームを効果的に活用して、素晴らしいクリエイティブを実現しましょう。

一覧に戻る
思いをカタチに
私たちはお客様の想いやストーリーを掬い取って形にするトータルブランディングを得意としています。WEBサイト/ロゴ/パンフレット/チラシ/名刺など、一貫して制作が可能です。新しくご事業を始められる方・リニューアルをお考えの方など是非一度私たちにお気軽にご相談ください。