Shopifyストア「French cake shop」（モバイル）
記事ビジネス・マーケティング
こんにちは♪
Shopifyで作成した「French cake shop（デモストア）」をご紹介します。
今回使用した無料テーマNarrative（Warm）は４種類のデフォルトカラーから選択でき、
・ブランディングを意識したい
・商品数が少なめ
の運営者さまにおすすめです。
このブログが皆さまのストアづくりの参考になればうれしいです！
※モバイル（スマホ）から見た画面で説明をします。
※ポートフォリオにも掲載します。
ストア名：French cake shop（デモストア）
設定：実店舗のあるケーキ店のオンラインストア。フランスで修業をしてきたパティシエが、こだわりの果物を使用したケーキを全国に届けている。
テーマ：無料テーマNarrative（Warm）
画像：複数のフリー画像サイトから使用
作成のポイント：
デフォルトデザインをカスタマイズし、お店のファンを増やせるように魅力を伝えています。ブログに実店舗のお知らせを掲載して公式ＨＰの役割を持たせたり、About usページでお店のストーリーを発信するなど“世界観”を大切にしました。
トップページ
トップページの左上は三本線（メニュー）です。
真ん中はストアのロゴ、右上はカートマークです。
大きく写真が入るので、ここでストアのイメージを強く表現することができます。
「販売中のケーキはこちら」ボタンにはコレクション一覧のリンクを貼っています。
三本線（メニューボタン）をクリックすると、こちらのメニューが表示されます。
メニューの内容や順番は自由に決めることができます。
トップ部分のすぐ下に、About Usへのリンクを貼ることができます。
これもブランディング強化をしやすいポイントです。
次に、スライダー画面が出てきます。
デスクトップ（パソコン）では下キャプチャのように、
左側に固定画像、右側にスライドでコレクションのリンクを貼っています
↓↓↓
モバイルでは、まず固定画像が表示され、上下にスワイプすると中からスライドが出てきます。
スワイプすると…
動きが本当におしゃれです！
固定画像の印象が非常に強いため、画像選びはとっても大切です。
スライド先はコレクションにしていて、スライドの枚数は選択できます。
スライダーの次は説明画面を入れました。
商品やストアのPRをできます。
次はおすすめの商品を掲載できるスペースです。
即購入可能なので、一番お客さまに購入して欲しい商品を載せると良いと思います。
シェアボタンは下のように動きます。
.png)
おすすめ商品とフッターの間に、ブログ抜粋を入れています。
抜粋の下部はこちらです。
ブログ冒頭に“特に読んでもらいたい内容”を書くと伝わりやすいと思います。
ヘッダーです。
必要なものがスッキリとおさまっているイメージです。
フッターメニュー内容は必要な物を追加・削除可能です。
商品ページ
ヘッダーの「カタログ」をクリックすると商品一覧画面が出てきます。
商品数が10点程度だと一覧にしても見やすいと感じます。
１つ１つの商品ページはこちらです。
.png)
.png)
.png)
商品ページ下部には無料アプリProduct Reviewsでカスタマーレビューを入れています。
シェアボタンはこのように動きます。
.png)
カスタマーレビュー（無料アプリProduct Reviews）
.png)
カスタマーレビューが表示されている画面です。
レビューは商品ページ下部に設置しています。
お客さまが新しくレビューを書く場合、「カスタマーレビューを書く」をクリックします。
.png)
.png)
レビューは商品ページから直接書くことができます。
「お名前を入力して下さい」等の文言はデフォルトで英語表記のため、日本語への変更が必要です。
商品をカートに追加する
.png)
カートに追加すると「商品がカートに追加されました！」と表示され、カートボタンを押すと下のようになっています。
ストアへのメモ欄もデフォルトで備わっています。
クレカ入力画面は以下のようになります。
ブログ
ブログ記事画面です。
シェアボタンがわかりやすく設置してあるので、読んですぐに拡散して頂きやすいです。
文章の最後に「シェアお願いします！」と入れると効果的です。
ストアや記事内容に合った写真を設置するのがおすすめです。
お問い合わせ
お問い合わせページは無料アプリPageFly Advanced Page Builderで作成しています。
（アプリを使わなくても作成可能です）
こちらのアプリを使うと、地図や店舗情報を入れることができ、書体や色合いも調整できてオリジナリティを出すことができます。
About us
お問い合わせページ同様、無料アプリPageFly Advanced Page Builderで作成しています。
（アプリを使わなくても、ページ追加で作成は可能です）
特定商取引に基づく表記
Shopifyの法的ページのフォーマットを使って文章を作成しています。
配送ポリシー
物販ストアでは配送ポリシーの設定をしておくのがおすすめです。
（商品によって配送方法を細かく分けている場合は、商品ページで詳細を確認して頂く旨を記載しておく）
ティザーサイト
ストアオープンの前にティザーサイトを作成し、広告宣伝用として使うことができます。
アプリなしでデフォルトのテキストを編集して作成しました。
文字数によってデスクトップ（パソコン）とモバイルでの表示が変わってしまうので、よく見比べながら作成するのがおすすめです。
以上となります。
Shopify無料テーマNarrative（Warm）で作成したデモストアをご紹介してきました。
テーマはいつでも変更可能なので、作成中にいろいろ試してみてピンときたものを採用するというスタイルでも良いと思います。
Shopifyに関して不明な点や疑問点がございましたら、お気軽にご相談くださいませ。
この記事が、皆さまのお役に立てれば幸いです！
