fbpx

“配置しただけ”にならないプロデザインのコツ

こんばんは!
ママWebデザイナーの自立&収入UPを
サポートするコンサルタント
みなです。

前回から引き続き、

集客できるホームページの作り方

をテーマにお届け中です。

今回は

トップページデザイン

について、お伝えしますね!

私のコンサルを受ける受講生さんは 大体の方が、下記のような理由で 学びに来られます。

  • ・文字を配置しただけになってしまい
     どうやったらプロらしい
     デザインになるのか分からない
  • ・色が決められない、まとまらない
  • ・デザインについてクライアントに
     「なんか違う」と言われてしまう
  • ・楽天のようなインパクト系
     デザインはできるけど、
     女性向けデザインが難しい
  • ・マーケティングを落とし込んだ
     デザインが分からない

トップページは、
お店の顔・看板です。

ここが
初心者っぽかったり
胡散臭かったり
安っぽかったりすると

狙った見込み客を集められる
サイトにはなり得ません。

その重要性を知っていて

ただそれっぽくデザインする
だけではダメと理解しているからこそ

学んでくださっているんだな~と
思っています^^

では、
どのようにデザインすれば
“配置しただけ”にならない
プロらしいデザインになるのか?

コツはたった2つ!

  1. ペルソナを具体的にする
  2. 使用するパーツに意味付けをする

これだけなんです!

では、それぞれについて
もう少し詳しくお話しますね。

①ペルソナを具体的にする

トップページをデザインする際、
まずは使用カラーを決めていきます。

クライアントさんから
特に指定がなければ
ペルソナをイメージしたカラーに
絞っていきますね?

さぁ!何色にしましょう?

ここで必要となるのが
ペルソナ情報
なんです。

ここで、起業家さんたちの
一番のターゲットになりやすい
30代女性
を例としましょう。

一口に「30代女性」といっても
色々な方がいらっしゃいます。

  • ・独身、バリバリのキャリアOL
  • ・既婚の派遣社員
  • ・ワーキングマザー

もし、バリバリ働いている
キャリアOL向けのサイトなら…

既婚しているので
プライベートも仕事も程よく
自分らしく働きたい女性なら…

育児情報や効率的な働き方情報が
欲しいワーキングマザーなら…

というように、
ペルソナを具体的にすると
サイト全体のテーマ、カラーが
見えてくるようになります。

また、レイアウトに関しても

ビジネス的な要素が多く
しっかりとした印象で見せたいなら
直線的に

女性客向けでやわらか・優しい印象に
したいのなら、曲線的に

他にも

ナチュラル
エレガント
キュート
エネルギッシュ

などなど、

どんな環境にいる
どのような人向けか?

を具体的にすると、
色だけでなく、方向性やパーツなど
大きなところから細かなところまで
決まってきます。

逆をいえば

ペルソナが決まらないと
デザイン的にも何も決められない。

だから、

どんなサイトにしようかな~?
何色にしようかな~?
どうすれば正解なんだろ~?

と悩みが出てきてしまうわけですね。

②の
「使用するパーツに意味付けをする」

については、次回
お伝えしますね!

ママWebデザイナーみなでした^^

前の記事:

次の記事:


Fatal error: Uncaught Error: Call to undefined function wp_related_posts() in /home/soramina/mamawebdesigner.jp/public_html/wp-content/themes/mamawebjp/single.php:36 Stack trace: #0 /home/soramina/mamawebdesigner.jp/public_html/wp-includes/template-loader.php(106): include() #1 /home/soramina/mamawebdesigner.jp/public_html/wp-blog-header.php(19): require_once('/home/soramina/...') #2 /home/soramina/mamawebdesigner.jp/public_html/index.php(17): require('/home/soramina/...') #3 {main} thrown in /home/soramina/mamawebdesigner.jp/public_html/wp-content/themes/mamawebjp/single.php on line 36