デザイン会社が発信するLP制作情報メディア

デザインの知識がなくでもできるLPデザインのディレクション方法

2022.9.13
デザインの知識がなくでもできるLPデザインのディレクション方法
デザイナーとしてもっと経験を積みたい、デザインの勉強方法を知りたい方に必見。


LP(ランディングページ)はただデザインをするのではなく、トレンドや戦略を取り入れながら制作する必要があるため、デザインの引き出しを増やしたい時に最適です。



そこで今回は、デザインの知識が少なくてもLPが制作できるようにディレクションをしていきます。デザインまでの工程や考案の仕方など、重要なポイントをまとめたので、デザイン力を上げたい方は参考にしてください。


目次

LPとは?デザインをするまでに役割を把握

LPとは?デザインをするまでに役割を把握
LPで成果を上げるには、制作する目的やどのような役割を果たすのか、理解していなければ難しいとされます。まずは、LPのことを知ることから始めます。

LPとは

リスティング広告などを見て気になったユーザーがクリックすることで、LPへとアクセスされます。一般的には1枚の縦長で制作。他のページに誘導できないため、1枚の中に必要な情報をまとめます。LPは商品の購入や資料請求、サービスの申込をするときに利用されるため、広告的な役割を果たします。



WEBサイトなどは知っている商品のことを、さらに詳しく知りたいユーザーが閲覧しにくるのに対し、LPは商品のことを知らないユーザーに興味を喚起させ、購入にまで繋げる必要があります。そのため、途中で離脱してしまうとLPとしての役割が果たせなくなるため、デザイナーはコンバージョンを意識した飽きの来ないデザインを考えます。




ノウハウが豊富、トレンドに敏感、デザインの引き出しが多いデザイナーほど、LP制作が有利です。ただ、LPから学べることは沢山あるので、初心者の方も諦めずに1度制作してみてください。

LP構築の流れとデザイン開発

LP構築の流れとデザイン開発
LPを構築していくなかで特に必要な工程や、デザインを考案する時に重要なポイントをディレクションします。

zoom_in画像クリックで拡大

制作費用はこちら

LP構築の全体的な流れ

LP構築の全体的な流れ
①商材を決める


②商材のリサーチ


③ターゲットの選定


④レイアウトの選定


⑤カラーや素材の準備


⑥デザイン構築


⑦コーティング



大まかな流れになりますが、この中でデザインに関係する②~⑥をディレクションしていきます。

商材のリサーチ

どのような商品・サービスか知ることは、デザインにも大きく影響します。


クライアントからの依頼であれば、商材の強みや弱み、特徴、他社との差別化などを細かくヒアリングしてください。取り扱う商材のことを把握できれば、次に類似商品を扱っている競合他社のLPを確認します。



どのようなLPが人気か、デザインや打ち出し方など魅力的な部分を参考にしながら、


競合他社に負けないデザインを考える必要があります。

ターゲットの選定

WEBサイトのように不特定多数に閲覧してもらうのではなく、LPはターゲットしっかり定めて情報を伝える必要があります。自分に関係ないとユーザーが思ってしまうと、離脱の原因になるため、ターゲットの選定は忘れないようにしてください。


難しく考えず、どんな人に商品を使ってほしいかイメージすることが大切です。


基礎代謝が落ちやすくなった40代の女性に向けたダイエットサプリ、ということが一目で分かりデザインにすれば、ターゲットに当たります。

レイアウトの選定

商材の情報がまとまれば、次にレイアウトを考えていくため、LPに入れたい内容を確認します。


商材によって異なることもありますが、基本的には上部にイメージ画像とキャッチコピー、中部には効果やメリットなどの商品説明、下部にはお問い合わせや申込フォームを配置します。



クライアント依頼の場合は、どのような配置にしたいのかヒアリングをした上で、コンバージョンに繋がるレイアウトを提案してみてください。



レイアウトが分かりづらいと、ユーザーが離脱する可能性もあるため、コンテンツの区切りや配置場所、カラー分けなど工夫をしておくと良いです。

カラーや素材の準備

使用する写真や画像などはデザイン構築する前に、加工や解像をしておくとスムーズに作業できます。また、LPのデザインのなかでもカラー選択は慎重に行う部分。商材に合ったカラーを選ぶことを最優先に、色彩効果なども意識しながら設計しましょう。

デザイン構築

下準備が整えば、デザイン構築に取り掛かります。


デザインをする時に注意したいポイントは多数ありますが、初めはUIを意識したインパクトのあるデザインを心掛けてみてください。



例えば、フォントサイズにメリハリを付けて、重要な文章は大きめにすることで、読み取ってもらいやすいようにする。そのほか、同じ並びにコンテンツを続けるより、左右差を付けることや動画を挿入するなど、切れ目が分かりやすいです。



また、大きく分けて3つのカラーが使われるLPですが、色調に変化を与えることや、近い色味を使ってコンテンツごとに変えれば、区切りが分かりやすいくメリハリが付きます。



このように、ユーザーの視点に立ちながらデザインすれば、自然とUIを意識したLPに仕上がります。



実際に運用して成果があまり出ないときは、ファーストビューとなるメインビジュアルのデザインを変更してみることや、アクションボタンのメリハリを付けるなど、細かくデザイン調整をして効果的なデザインを探し出してください。

デザインディレクションの手順

1.案件の全体像を明確にする

プロジェクトの初動として、案件の全体像をデザイナーと共有することが必要不可欠です。
目的や背景、ターゲット層といった要素は、デザインの方向性を決定づける基盤となります。
抽象的な指示ではなく、具体的な情報を提供することで、デザイナーは方向性に迷わず、集中してクリエイティブな作業に取り組めるようになります。


このステップが不明確なまま進行すると、後に大きな修正が必要になるかもしれません。
具体的なモチーフや類似サイトを用いてイメージを擦り合わせることで、デザイナーはより明確な方向性を持って作業に取り組めます。

2.修正指示には「意図」も添える

修正が必要な場合、「何を」だけでなく「なぜ」も伝えることが重要です。
この一見単純な行為が、デザインプロセスにおいて多大な影響を与えることがあります。
たとえば、「見出しの色を変更する」という指示に、「目立たせたい」という意図を添えることで、デザイナーは多角的な解決策を考える余地が生まれます。
この余地は、デザイナーが自身のクリエイティビティを最大限に発揮するための土壌となります。


このようなアプローチは、デザインのクオリティを向上させるだけでなく、作業時間の効率化にも貢献します。
具体的には、デザイナーが修正の背後にある「目的」を理解することで、その他の部分でも連鎖的な改善が行える場合があります。
たとえば見出しの色を変更するだけでなく、その周辺の要素との調和も考慮することができるでしょう。


修正の意図を把握することで、デザイナーはその修正によってデザインの整合性が崩れていないか、全体をチェックする癖をつけられます。
この「癖」は、プロジェクト全体のクオリティを一貫して高めるための重要なスキルとなります。
修正一つ一つが積み重なって全体のデザインが形成されるため、その一つ一つに意味と目的を持たせることで、最終的な成果物も高品質なものとなるでしょう。
このように、「意図」を明確にすることは、単なる修正作業を超えて、プロジェクト全体の成功に寄与する要素となります。
修正指示の際に「意図」を添えることで、デザイナーとディレクター双方がより高いレベルでのコミュニケーションを実現し、結果としてプロジェクト全体がスムーズに進行する可能性が高まるのです。

3.ターゲットの視点で再評価する

プロジェクトが長期にわたる場合、途中で方向性がブレることは少なくありません。
このような状況は、多くの場合、プロジェクト初期に設定した目的やゴールが曖昧になっているか、新たな課題や変化が生じた結果として発生します。
そうした瞬間には、最終的なユーザー、すなわちターゲットの視点に立ち返ることが有用です。
この行為は、プロジェクトが本来目指すべき方向に再度焦点を合わせるための重要なステップです。


ターゲットが何を求め、どのような状況でデザインに触れるのかを考慮することで、プロジェクトの目的とデザインが一致する確率が高まります。
たとえば、ターゲットが主にモバイルでサービスを利用すると知っていれば、デザインはモバイルファーストで考えるべきです。
また、ターゲットが特定の時間帯に活動する傾向があれば、その時間帯に合わせたデザインや機能を提供することも考慮に入れた方が良いでしょう。
ターゲットが他の人にこのサービス内容を伝えたくなるか、などの項目でチェックしてみてはいかがでしょうか。
この点は、口コミやソーシャルシェアによる拡散力を考慮する上で非常に重要です。
ターゲットが自らのネットワークでサービスを推薦する可能性が高いデザインであれば、それはビジネス成功に直結する要素とも言えます。
このように、ターゲットの視点での再評価は、プロジェクトの各ステージで行うべき継続的なプロセスです。
それは、プロジェクトが目指すゴールに対して常に最適なルートを選び、変化に柔軟に対応するための基盤となるのです。
この視点を持つことで、デザインプロジェクトは単なる「作成活動」から「解決策を提供する活動」へと格上げされるでしょう。

デザインを制作する際のポイントについて

1つ目は、メインカラーとなる1色と、サブカラーとなる1、2色を決めましょう。
メインカラーは本サイトの色やコーポレートカラーと統一する場合が多いです。
サブカラーはメインカラーの補色や、濃い同系色で揃えましょう。
またボタンカラーは目立つ補色を使用します。
コンバージョン地点が2つあるのであれば、ボタンは大きさや色などに変えて強弱を揃えましょう。

2つ目は、フォントを決めましょう。
デザインのイメージはフォントによって大きく左右されます。
例えば、明朝体は高級感があって繊細な雰囲気となります。
またゴシック体は、モダンとなり親しみやすさが生まれて、行書体であれば伝統的で和風な雰囲気となります。
ターゲットや伝えるイメージに合ったフォントを選ぶようにしましょう。

3つ目は、構成案の要素に優先順位を付けましょう。
校正案を整理する際には、優先順位がデザイナーに伝わりやすいように工夫をしましょう。
ファーストビューの視線の流れは重要となるため、優先順位と指定している視線の流れを伝えられるようにしておきましょう。

4つ目は、ベンチマークとなるような他のサイトを見つけておきましょう。
デザインの制作を依頼するのであれば、できるかぎりベンチマークのサイトを示すようにしましょう。
それによって、より自分のイメージに近づけて仕上げてもらえます。

確実に認識のすり合わせを行うためには、参考サイトを示しながら色や文字、イメージ、ボタンを伝えられるとよいでしょう。
デザイナーはデザインに取り掛かる前に、校正案を見てからデザインをイメージします。
そのため構成案が決まり次第、事前の共有をしておくとよりスムーズに始められるでしょう。

Webデザインの注意点とポイントについて

WebディレクターがWebデザインにおいて注意すべきポイントについて解説します。

1つ目は、スケジュールはバッファをとることです。
スケジュールに余裕を持たせることを、バッファといいます。
バッファを持たないままスケジュールに取り組むと、もしトラブルが起こった場合にうまく対応ができません。

また、最悪の場合は納期が遅れてしまいます。
必ずバッファをとって、スケジュール通りにプロジェクトを進められるようにしておきましょう。

2つ目は、デザイナーに対して曖昧な指示を出さないことです。
Webディレクターの指示が曖昧であると、Webデザイナーは困惑してしまいます。
サイトの目的に合わせて、ユーザーに伝えるべき内容と、目立たせるポイントを言語化して指示しましょう。
また、その際には、細かく指示をするようにしましょう。

3つ目は、具体例を出してデザインイメージを伝えることです。
デザインのイメージを伝える際には、口頭だけではなくサイトを活用しながら認識を合わせるようにしましょう。

ただし、丸投げにしてはいけません。
このサイトのこの部分を参考にする、このような背景色を避ける、など細かく指示を出しましょう。

4つ目は、デザイナーに対して修正指示を出す場合は明確にすることです。
修正を依頼する場合には、なぜ修正が必要なのか理由も併せて伝えましょう。
その理由が曖昧だとデザイナーは困惑してしまい、モチベーションも下がってしまいます。
例えば、イメージを共有できるような資料を提出して、具体的な指示を出せるように工夫するとよいでしょう。

良いデザインを作るためには、Webディレクターとデザイナーとのコミュニケーションが非常に重要です。
日ごろから良い信頼関係を築いておくことで、仕事の場においても積極的に意見を交換できます。
また、イメージがすれ違ったり細かな修正が続いたりするトラブルも抑えられるでしょう。

色々なLPをとにかく見て参考にする

LPデザインについてディレクションを行いましたが、慣れるまではデザインを構築することに時間が掛かり、挫折しそうになることも考えられます。


そんな時は、ジャンル問わず色々なLPを見てください。まずは目を鍛えて、トレンドを掴むことから始めてみましょう。良いと思った部分は同じようにデザインに取り入れみてください。効果があれば引き続き採用し、効果がなければ新しいデザインを探し出してみましょう。また、他のLPを見てデメリットに感じた部分も覚えておくと、品質向上に繋がります。



初めはとにかく他の人が制作したLPから参考にして、デザインの引き出しを増やしましょう。そして、最終的にはオリジナリティのあるLPが制作できることを目標にしてみてください。


色々なLPをとにかく見て参考にする

まとめ

LPの成功は、デザインの力によって大いに左右されます。
商材の選定からレイアウト、色彩、素材の準備、そしてデザインの構築まで、目的とターゲットに対する明確なビジョンを持つことで、より高い成果を生む可能性があります。
デザインの修正に際しては、「何を」だけでなく「なぜ」を明確にし、デザイナーが自身のクリエイティビティを最大限に発揮できる環境を整えることが重要です。


また、ターゲットの視点での再評価は、プロジェクトの各ステージで行うべき継続的なプロセスです。
これによって、LPは単なる「作成活動」から「解決策を提供する活動」へと格上げされる
でしょう。
最後に、デザインのポイントについても触れましたが、これらを踏まえ、次なるLPプロジェクトに生かしていただければ幸いです。
LPの世界は深く、その奥行きを理解し、磨き続けることで、より多くのユーザーに訴求力のあるページを提供できるでしょう。
この記事を書いたライター
LPの制作に特化したデザイン会社(LP制作実績)。累計では数千LPデザインを手掛けております。すべて内製化しており、構成からデザイン、コーディングまですべてご対応可能です。各種サーバーのご対応はもちろん、楽天市場、ヤフーショッピングなどのモール系などへの反映もご対応可能です。
この記事の画像を作成したデザイナー
所属:株式会社Ryuki Design / 部署:デザイン部
※デザイナー一覧

紙媒体のデザインからwebデザイン(LP制作・バナー制作)までオールマイティーにデザインが可能。
デザインだけではなく構成も得意なハイスペックデザイナー。毎回クオリティの高いデザインをクライアントに提供しています。

LP制作.jpへのお問い合わせはこちらから

お電話でも承ります
050-3541-5719

    ※アンケートモニター提供元:ゼネラルリサーチ 
    調査期間:2020年8月7日~12日
    調査方法:インターネット調査 
    調査概要:デザイン制作会社10社を対象にしたサイト比較イメージ調査
    調査対象:全国の20代~50代の男女 1052名

    LPアーカイブ
    mitekaku