手作り石けんのネットショップを作る

神戸の手作り石けん工房セトラグリーンです。

今週、ネットショップをオープンさせることができました。これから頑張って運営をしていかなければいけません。ネットショップは、デザイン会社さんに手伝っていきながら制作しています。わたしがどのようにしてネットショップを作り上げていったのか、記録として残しておきます。もし、参考になる方がいらっしゃいましたら、ぜひ参考になさってください。

カラーミーショップで作るネットショップ

ネットショップ運営サービスは、よく迷われるところで「カラーミーショップ」と「BASE」がありますが、わたしのショップは、「カラーミーショップ」を活用して、オリジナルショップを作っています。

settlagreenのネットショップの画像

ネットショップの制作は、標準のテンプレートから全体を作り込んでいく、制限のない自由なレイアウトとデザインでオリジナル性の高いショップを作ることができます。ですが、わたしの場合、予算面のこともあり、サイトの土台となる部分はすでにできあがっているテンプレートを使い、イメージ画像をwebデザイン会社にお願いするカタチで作っています。

メリットは、オリジナルデザインですべて制作するよりも割安にでき、簡単に他のお店との差別化ができるところ。

デメリットはテンプレートをそのまま使うのが基本なので、テンプレート自体の大幅なデザインを変更することができないところです。

テンプレートを選ぶときの注意点

webデザイン会社さんからテンプレートを選ぶ際には、ネットショップもスマホ対応が当たり前なので、選ぶ際には「レシポンシブ対応」のテンプレートを選んだ方がいいとアドバイスがありました。

レシポンシブ対応

PC用のネットショップをそのままスマホに表示させると、画面に小さく表示されることになります。文字を拡大しないと読めないこともあり、ページをあまり見られないまま訪問者が離れていくことになります。

レシポンシブ対応の場合、PC用とは別にスマホの画面に合わせた見せ方が用意されています。これだと、スマホの画面に合わせて一行当たりの文字数を減らし、大きく見やすい文字が表示でき、写真のサイズも自動変換され見えやすく表示されます。わたしのネットショップもレシポンシブ対応になっています。

カラーミーショップのレシポンシブ対応テンプレートはこちらになります。
https://shop-pro.jp/template/responsive

対応テンプレートのテンプレートのうち、スッキリとしたイメージにした場合には、「MONO」「MODE」「ICE」などがあります。予算的に厳しく、イメージ画像だけをデザイン会社さんにお願いするなどの場合は、デザインを大きく変更することができないので、見た目で好みに合うものを選ぶ必要があります。レイアウトの変更はできませんが、色などの変更は可能です。

ショップのキーカラーを前面に出すとイメージもかなり変わってきます。わたしの場合は、グリーンがキーカラーになっているので、元のメニュー色を「黒⇒グリーン」に変更しています。

キーカラーをどの色にするかは、こちらが参考になります。
https://www.colordic.org

最初にキーカラーをきちんと決めておくと、印刷物を作るときも全体のイメージが統一できていいですよ^^

セトラグリーンのオンラインショップ