こんにちは。中川瞬(@shun01224)です。
この記事を読むことで、
- BASEの商品に合ったデザインがわかります。
- BASE無料テンプレートの活用方法について理解できます。
- BASEで売れるオリジナルショップの開設方法を知ることができます。
この記事を書かせて頂いている私は、現在、輸出・輸入・国内の転売のノウハウをお伝えしています。
時間がない会社員の方や子育てをしている主婦の方に、指導や転売システムの提供をして、忙しくても副業で収入を得てもらっています。
BASEでネットショップ販売をする際に、デザインはどうすればよいのか、以下で詳しく解説していきます。
まだ、BASEのアカウントを作成していない方はBASEに登録をしましょう。
登録の方法はこちらで解説をしているので参考にしてください。
BASEの公式サイトの登録はこちらになります。
(30秒で簡単に自分のネットショップが無料で作れます)
BASEでは、WEB制作の知識があまりない方でも、豊富な無料機能を上手に活用することで、おしゃれでセンスの良いオリジナルネットショップが作れます。
同じテンプレートを使用しても、ロゴやナビゲーションのカラーや商品の見え方などを少しカスタムするだけで、グッと洗練された印象に変わります。
ぜひ最後まで、読んでみてください。
目次
ショップデザインは無料テンプレートを使おう！有料は利益が出てから
現在BASEには、設定するだけでおしゃれなページが作れる、
無料のデザインテンプレートが11種類あります。
まずは、無料テンプレートを活用して、実際にBASEのデザインページ上でカスタムの見本を作成していき、
売れるショップデザインを作るコツを確認していきましょう。
それでは、さっそく無料テンプレートのデザインについて紹介していきます。
無料テンプレートの特徴
BASEでは、これら全てのデザインテンプレートを無料で利用することができます。
BASEの無料テンプレート
BASEの無料テンプレート
無料テンプレートは、SIMPLE、COOL、FANCYなど、それぞれテーマが決まっていますが、どれを選んでも、色味などはカスタマイズして使用する前提のシンプルなベースデザインとなっています。
無料のテンプレートだけでも、ファッションやフード、雑貨などあらゆるカテゴリに対応できるショップデザインばかりなので、様々な方に対応して揃えられています。
ロゴやナビゲーションの見え方、商品画像の配置バランスなどもバリエーション豊富なので、自分の出している商品にどれが合うのか、プレビューで確認しつつ選択していきましょう。
また、パソコンから見たときの表示だけでなく、レスポンシブデザインも合わせてチェックすると、よりショップデザインのイメージがつきやすいです。
レスポンシブデザインとは、スマートフォンやタブレットなどパソコン以外の画面で見た際に、
表示されるデザインのことです。
BASEを閲覧するお客様は、パソコン以外からアクセスする方も多いので、レスポンシブデザインになった際にもきちんとイメージに合ったものになっているかどうか、しっかり気を配っていきましょう。
BASEの便利なところは、ユーザーがとくに何も設定しなくとも、テーマを選ぶだけでパソコンでもスマートフォンでもきちんと設計された、おしゃれな画面になるよう既にデザイン対応されているところです。
無料テンプレートをカスタムするだけで、簡単におしゃれなページが作れるのは、BASEならではのメリットです。
有料デザインテンプレートは利益が出てからがお勧め
一方、有料テンプレートになると更に種類は多く、デザイナーが作成した50種類のテンプレートから選ぶことができます。
全種類は掲載できませんが、一部見ていきましょう。
BASEの有料テンプレート
無料テンプレートは何と言ってもお金がかからない部分が嬉しいところです。
また、シンプルでカスタムし放題なので、上手に活用できれば、無料テンプレートをベースに使用しても、ハイクオリティなデザインを作成することは可能です。
実際に、無料テンプレートを使用していることが分からないようなショップもあります。
一方、有料テンプレートはやはり無料テンプレートよりも細かいところまで凝っているデザインで、痒いところに手が届くように、更に追求された仕様のものが多いです。
初期費用がかかるのみなので、気に入ったテーマが決まっている方は、有料デザインテンプレートの購入を検討しても良いでしょう。
ですが、最初のうちは無料テンプレートからデザインを決めて、ショップコンセプトやデザインテイストの方向性が商品の客層と合っているのかなど、一定期間様子を見ていくことをお勧めします。
BASEで自分のショップの強みや付加価値が見えたところで、ある程度の収益が得られてから、段階を踏んで有料テンプレートに切り替えていきましょう。
無料テンプレートで売れるショップを作るコツ
ここまでは無料テンプレートの特徴やメリットについてお伝えしてきました。
では、統一感のあるショップを実際に作るにはどうしたら良いのでしょうか。
大事なポイントを解説していきます。
統一感のあるショップを作る方法
WEBショップを作る上でとくに注意したいことは、【自分が作りたいショップコンセプトや商品のテイストと、ショップのデザインがチグハグになっていないか】という点です。
無料テンプレート自体は、1で説明したようにあくまでベースなので、ロゴのカラーやナビゲーションカラーをカスタムして、統一感のあるショップを作っていくことがポイントになります。
さて、ここからは、実際にBASEのデザインページ上でカスタムの見本を作成しながら売れるショップデザインを作るコツを紹介していきたいと思います！
ショップのコンセプトとターゲットを考える
まずは、BASEで自分のショップをどんなショップにしていきたいのか、方向性をしっかり決めていきましょう。
ここで重要になってくるのが、ショップのコンセプトとターゲットです。
コンセプト(concept)とは、全体を貫く基本的な観点・考え方という意味です。
統一感を出す為の枠組みになるので、コンセプトが定まっていないと、イメージに合ったデザインを考えるのも難しくなってきます。
また、どんな客層に売っていきたいか？というターゲットの選定もデザインを考える上で重要なポイントです。
今回は参考例として、”温かみのある優しい北欧風雑貨ショップ”をコンセプトにしました。
また、ターゲットは30代〜50代のナチュラル雑貨好きの女性としました。
ショップに出す商品は、北欧から輸入したマグカップなどです。(今回はフリー画像を使用します)
コンセプトが”北欧風”だけですと、デザインを考える上でなかなか方向性を決めるのが難しくなってきます。
というのは、“北欧風”だけでは、人それぞれイメージするものが違うからです。
北欧と聞いて、一方の人は、北欧キッチン雑貨などにあるようなビビッドカラーをイメージし、もう一方ではシックなモノトーンカラーを想像する人もいます。
ショップイメージをより具体的にしていく為に、キーワードを出していくのがお勧めです。
例えば、“温かみのある優しい雰囲気”、”余白のある空間”、”遊び心のあるフォント”などです。
ここで出したキーワードを大事にしながら、ショップデザインを考えていきましょう。
コンセプトに合うカラーをカスタマイズ(良い例と悪い例を紹介)
では、続いてイメージカラーを考えていきましょう。
今回は、コンセプトが”温かみのある優しい北欧風雑貨ショップ”なので、ナチュラルカラーに少しアクセントカラーを入れる方向で、カラーはこのように決めました。
- ベースカラー(背景)→優しいベージュ
- メインカラー(画像の縁取り)→淡いブルーグレー
- アクセントカラー(ナビゲーション)→くすんだインディゴブルー
- アクセントカラー2(ロゴ)→ブラウン
BASEでコンセプトに合うカラーをカスタマイズ
背景カラーは、デザイン編集画面の赤枠部分で設定します。
BASEでコンセプトに合うカラーをカスタマイズ
ロゴと、ナビゲーションは、こちらから設定をします。
とても簡単に設定できます。
また、フォントサイズや字体変更など、更に細かくカスタマイズしたいという方は、BASEの拡張appsでHTML編集というアプリをダウンロードしてください。
こちらも無料です。
上は良い例ですが、コンセプトやカラーを完全に無視した悪い例を紹介します。
コンセプトやカラーを完全に無視した悪い例を紹介
とても目がチカチカしますね。
ベースカラーがショッキングピンク、メインカラーがホワイト、アクセントカラーがレモンイエローとエメラルドグリーン…
とてもじゃないですが、北欧系のショップとは思えないデザインです。
カラーがチグハグなだけで、同じ商品の画像でも非常に残念な印象に見えてしまいます。
このように、コンセプトに忠実に、カラーをカスタマイズすることが、統一感のあるショップを作る上では、とても大事になります。
背景に画像を使ってみよう
続いて、BASEで背景画像を利用したカスタマイズを紹介します。
使用画像として、北欧テキスタイルにありそうな可愛いフリー素材を選びました。
BASEで背景に画像を使ってみよう
こちらを無料テンプレートの”CLASSIC”から、カスタマイズして背景画像に指定しました。
BASEで背景に画像を使ってみよう
画像の赤枠部分から簡単に設定できます。可愛らしいページになりましたね。
良いデザインをするためのポイントは
まずは、他のネットショップをリサーチして、人気のあるショップの良いデザインを参考にしていくことが大切です。
- 商品がカテゴリー毎に分けられていて、わかりやすく見やすい
- 商品の写真がキレイで様々な角度からの画像が複数ある
- 商品情報の説明が丁寧
- ホームページやインスタグラム、Twitter、公式LINEなどSNSとの導線がしっかりしている
ショップのカラーやデザインなど「外観」ばかりを気にされる方が多いですが、お客様から人気が出るネットショップをデザインするということは、外観をきれいにするだけでなく、お客様の目に止まるように、商品の画像がきれいで、商品説明が丁寧に作り込まれていることが何よりも大切です。
また、より集客力を上げるためにも、インスタグラムやTwitter、Facecook、YouTubeなどSNSと連携させるなど、他の媒体との導線がしっかり整っていることが良いデザインとなり、売上に繋がると覚えておきましょう。
売れるデザインを作るまとめ
BASEでネットショップ販売を初めてみたいけど、どんなデザインにすれば良いのか分からない
という方のために、BASEで売れるデザインを作る方法について解説してきましたが、いかがでしたでしょうか？
BASEでは、WEB制作の知識があまりない方でも、このように豊富な無料機能を上手に活用することで、おしゃれでセンスの良いオリジナルのネットショップを作ることができます。
BASEでは、設定するだけでおしゃれなページが作れる無料のデザインテンプレートが、11種類ありますので、今回紹介した設定方法を参考にして、販売したい商品のコンセプトにあったショップにカスタマイズをしてみると良いでしょう。
BASEはたった30秒で登録が簡単に無料でできるので、おしゃれなオリジナルショップのデザインを設定にして、ネットショップ販売を始めてみてはいかがでしょうか。
登録の方法はこちらで解説をしているので参考にしてください。
