デザイナー必見!デザインを上達させるならLP制作が効果的?
WEBデザインは経験とセンスが必要になるため、常に磨き上げる必要があります。
とにかく数を熟すことが大切にですが、なかでもLPの制作がおすすめ。
比較的自由に制作できるという点がLPの強みなため、自分なりに制作できるほか、色々なデザインパターンに挑戦できるので上達させるのに適しています。
最初はデザインに悩むかもしれません。しかし、制作を繰り変えすことでオリジナリティのあるLP制作ができるようになる、と思えば腕が鳴るはず。
そこで、デザインする時のポイントや上達のコツなど、LPを使ったデザインの勉強方法をご紹介します。見習いデザイナーの方はぜひ参考にしてみてください。
目次
デザイン制作前にする重要な2つの作業
デザイナーとしての経験が少ないと、いきなりLPのデザインは浮かんでこないと思われます。まずはLPを制作する目的をしっかり把握すること、そして色々なサイトを参考にしてデザインを考案していく方法がおすすめ。事前準備をしっかり整えてから、デザイン制作のステップに繋げます。
ヒアリング
集客や購入など、LPを使って最終的にどのようなゴールにもっていきたいのか、明確にします。次に、商品・サービスの特徴や魅力、差別化できる部分などを把握しておくことで、サイトのテーマが作りやすくなるので、細かくヒアリングしてください。
そのほか、ターゲット層やクライアントの希望、使用可能な素材など、制作するときに必要となる要素は漏れなく、聞き出しておきましょう。
参考ページの閲覧
ヒアリングをすることである程度イメージが湧くと思いますが、デザインを固めていくためにも、様々なLPサイトを閲覧してアイデアを明確化する必要があります。
LPの制作実績がない場合、まずはジャンル問わず、人気のLPや有名なデザイナーが制作しているLPを探して、目を鍛えることから始めてください。
WEBデザインはセンスや経験のほか、見て学ぶということも大切です。
他のLPを見て、良いと感じた部分はできるだけ吸収して引き出しを増やしてください。
使いにくいなど、デメリットに感じた部分も、自分が制作するとき同じにならないように覚えておくと役立ちます。
LPのデザインがどういう風に制作されているのかイメージが湧けば、次に今から制作するLPの商品やサービスを取り扱っているページを探し出します。
競合他社との差別化を図るというほか、クライアントのイメージに近いサイトを聞き出すことが目的です。
複数ピックアップしたLPを表にまとめるなどして、クライアントに1度相談してみてください。
業界最大級の登録数!LP参考サイト
クオリティの高いランディングページ(LP)参考サイト。リスティング広告や楽天市場、ヤフーショッピングでランキングに入っている様なハイクオリティなLPデザインをまとめたサイトです。毎日更新しているので、昔のLPから最新のLPまでデザイン制作の参考に活用出来ます。
LPをデザインするときのポイント
デザインの下準備が整ったところで、作業する工程へと移っていきます。
LPデザインの難しいところは、ただおしゃれなページに仕上げることが目的ではないこと。成果に繋がるLPを制作するために、デザイナーもコンバージョンを意識したデザインを取り入れる必要があります。
おしゃれなデザインだけを作り続けるより、戦略を考えながらデザインをする方がモチベーションが高まり、上達スピードも上がるはず。
では、デザインをするときに気を付けたいポイントや戦略方法をいくつか厳選したので、参考にしてください。
色彩設計
サイト全体のイメージが大きく決まるメインカラー、申し込みボタンなどメリハリを付けたいときに使うアクセントカラーのバランスが取れた色彩設計を行う必要があります。
白はクリアな印象、黒は高級な雰囲気、赤はアピールしたい時など、カラーによって異なった印象を与えることができます。商品やサービス、ターゲットに合わせた配色を選んでください。
赤や緑、青は目立たせるには最適ですが、重要なコンテンツやアクションボタンが控えめな存在になり、差別化が難しいです。また、分かりづらさはユーザーがストレスを感じてしまい離脱の原因になるため、3色ほどを目安にメリハリのある配色にしてみてください。
ファーストビュー
ユーザーが最初に目を通す部分によって、滞在または離脱が決まると言われています。
ユーザーを惹きつけるデザインにするためにも、ファーストビューはデザイナーの見せ所。
どのような商品か、何を伝えたいのか、どのようなメリットがあるのかなど、ユーザーがすぐに理解できるようなデザインを取り入れてください。
写真や動画、アニメーションなど、一瞬見ただけでイメージが湧くようなデザインパターンは人気があります。加えて、ユーザーを惹きつけるようなキャッチコピーや売上1位などの権威付けを添えてあげると購入意欲の後押しをすることができます。
ファーストビュー次第で、ユーザーが読み進めていくのか決まってしまうことも考えられるため、一瞬見ただけでも惹きつけてしまうデザインを意識してみてください。
デザインを模写してみよう
模写をする目的は以下の3つです。
1.スキルアップのため
LPデザインを模写することで、デザイン技術を向上させられます。
模写を通して、他のデザイナーがどのような技術や手法を使っているのかを学べます。
また、慣れない技術や手法に挑戦することで、自分のスキルをアップできます。
2.アイデアの発想のため
他のデザイナーが作成したLPデザインを模写することで、新しいアイデアを発想できます。
模写をすることで、どのような色使いやレイアウトが良いのか、どのようなフォントが適切なのかを学べます。
トレンドにも敏感になれ、WEBデザインの流行の最先端を走れることでしょう。
3.ポートフォリオ作成のため
模写をすることで、ポートフォリオに掲載するLPデザインを作成できます。
ポートフォリオを通して、自分のスキルをアピールし、キャリアアップに繋げていきましょう。
LPデザインを模写する方法とは?
1.HTML、CSSの基礎知識を身に着ける
様々なLPデザインを模写するためには、基礎知識が必要です。
基礎を理解することで、構造やレイアウトを理解できます。
2.PhotoshopやSketchなどのデザインツールを使う
ウェブデザインを模写するためには、PhotoshopやSketchなどのデザインツールを使うのが一般的です。
デザインツールを使うことで、LPデザインのカラースキームやレイアウトを分析しましょう。
3.レスポンシブデザインにも対応する
レスポンシブデザインとは、画像サイズが異なるデバイスでも閲覧できるようにするデザインです。
たとえば、スマートフォンやデスクトップなど異なるデバイスでの閲覧に対応するために、レイアウトやフォントサイズなどを調整する必要があります。
様々なデバイスが普及している現在では、必須の技術と言えるでしょう。
4.オリジナルとの違いを理解する
完全に模写するのは難しいです。
LPデザインを模写する際には、模写する対象との違いを理解することが重要です。
まず、違いを把握するため、2つのデザインの比較を行いましょう。
違いが見つかれば、違いが生じた原因、改善点を洗い出します。
たとえば、オリジナルのLPと自分が作成したLPのレイアウトが異なる場合、自分が作成したサイトのレイアウトに問題がある可能性があります。
そこで、オリジナルを参考にして、改善点を見つけられます。
模写をする際には、元のデザインから離れすぎないように注意しながら、自分なりの工夫を加えたり、改善点を発見したりするようにしましょう。
5.複数のLPを模写する
LPデザインを模写する際には、複数のLPを模写することで、様々なデザインのパターンを学べます。
また、異なるタイプのLPを模写することで、自分のデザインスキルを幅広く磨けますね。
6.コミュニティでフィードバックを受ける
デザインを公開し、他のデザイナーやコミュニティからフィードバックを受けることで、自分のスキルを向上できます。
適切なフィードバックを受けるためには、レベルに合ったコミュニティを選び、目的を持ってフィードバックを受けるようにしましょう。
また、模写を公開する場合は、著作権に留意する必要があります。
改善点を洗い出すためにネガティブな意見を聞き入れるのはもちろん重要です。
それと同じくらいに重要なのがポジティブなフィードバックを受け入れることです。
得意な所をのばして、唯一無二のスキルを手に入れましょう。
LPは効果的なデザインを知ることができる
WEBデザインはおしゃれな装飾だけで終わらず、成果のあるデザインを生み出すことが重要です。LPはユーザーのアクションを促しながら、最後まで読んでもらうデザインに仕上げる必要があるため、効果的なデザインを知るための勉強法に最適。
まずは最初は他の人が制作したLPを参考にしながら、デザインの引き出しを増やしてください。自分のデザインに足りない部分はどこか、明確に知ることができます。
また、数をこなしていくことで、ユーザーが飽きない配置や配色などが分かってくると思うので、最終的にはオリジナリティのあるLPの制作を目標に取り組んでみてください。














へのお問い合わせはこちらから
