WORKS 制作実績

  1. HOME
  2. WORKS
  3. 通販サイト
  4. 宝食品株式会社様 京宝亭 通販サイト

宝食品株式会社様 京宝亭 通販サイト

宝食品株式会社様が運営する「京宝亭」の通販サイトを制作しました。


宝食品株式会社様が運営する京宝亭の通販サイト

京宝亭は宝食品株式会社様が直営する店舗で、香川県小豆島町で佃煮の製造・販売を行っています。
京宝亭がある「醤の郷(ひしおのさと)」地区は、江戸時代から続く醤油蔵や佃煮屋が軒を連ねており、観光客も多く訪れています。若い方にも来店してもらいたいと、醤油蔵の風情を残しながらもミュージアムやカフェを併設したギャラリーショップへのリニューアルを機に、通販サイトの制作をご相談いただきました。


宝食品株式会社様が運営する京宝亭の外観
宝食品株式会社様が運営する京宝亭の店内

カタログ通販からウェブサイトでの通販へ

宝食品様はこれまでカタログでの通販を中心に行っていましたが、店舗で購入した方がリピートしやすいように通販サイトへの移行を希望していました。
通販サイトは、ネットショップ構築システム(EC-CUBE)を導入し制作。商品の登録や商品詳細ページの編集は、宝食品様が自由に行えるようになりました。商品詳細ページには、原材料・内容量・賞味期限・JANコード・アレルギー情報・栄養成分表示といった食品に義務付けられている表示が記入できるようにカスタマイズを実施しています。


宝食品株式会社様が運営する京宝亭の通販サイト 商品一覧ページ
宝食品株式会社様が運営する京宝亭の通販サイト 商品ページ 佃煮子持ちきくらげ

また、商品の種類・金額帯・シーンのカテゴリ設定を行い、ユーザーが商品を検索しやすいようにしました。


宝食品株式会社様が運営する京宝亭の通販サイト 商品カテゴリ

店舗イメージにマッチした和モダンデザイン

トップページのメインビジュアルには、香川県小豆島の風景や京宝亭の店舗の写真を用いて、地域とともにある京宝亭の姿を印象づけています。


宝食品株式会社様が運営する京宝亭の通販サイト メインビジュアル
宝食品株式会社様が運営する京宝亭の通販サイト メインビジュアル

また、リニューアルをした店舗の雰囲気をギャラリー写真で紹介し、来店動機につながるようにしました。サイト全体のデザインは、白やグレー落ち着いた色味で背景を統一し、店舗イメージに沿うような和モダンのデザインでまとめました。


宝食品株式会社様が運営する京宝亭の通販サイト 和モダンデザイン

京宝亭の店舗で買い物をした方がリピーターとして通販サイトを訪問するという、よい循環が生まれることを期待しています。


2021年9月のリニューアルで通販メインのウェブサイトにシフト


宝食品株式会社様が運営する京宝亭のウェブサイトを通販メインにリニューアル

2020年3月の公開時は、実店舗を訪れた方が通販サイトでリピートしやすいように、実店舗や小豆島の風景をメインビジュアルにした、「コーポレートサイト」と「通販機能」のよさをあわせ持つハイブリッド型を採用していました。
2020年4月以降、コロナ禍で実店舗への観光客の来店が減少したことを機に、ウェブサイトの方針を変更し、通販をメインとしたウェブサイトへのリニューアルを決定。


京宝亭のウェブサイト 2020年3月公開時

2020年3月公開時

京宝亭のウェブサイト 2021年9月リニューアル時

2021年9月リニューアル時


骨組みとなる通販機能は残しつつ、また店舗とシンクロさせたデザインも活かしながら、グローバルナビゲーション(*1)の改善や商品詳細ページの見直しを行いました。


グローバルナビゲーションの改善


  • 「マイページ」や「カート」など通販に関するナビゲーションをクリックしやすく
  • 商品名などからの検索もスムーズに

京宝亭のウェブサイト グローバルナビゲーションのリニューアル前

グローバルナビゲーションのリニューアル前

京宝亭のウェブサイト グローバルナビゲーションのリニューアル後

グローバルナビゲーションのリニューアル後


商品詳細ページの見直し


  • 購入ボタンをページ上部に表示。赤色で目につきやすくしました

京宝亭のウェブサイト 商品詳細ページのリニューアル前

商品詳細ページのリニューアル前

京宝亭のウェブサイト 商品詳細ページのリニューアル後

商品詳細ページのリニューアル後


トップページの中ほどに実店舗の紹介エリアを設け、実店舗の雰囲気も伝えています。


京宝亭のウェブサイト 実店舗の紹介エリア

おためしセット、新規会員登録のお得なポイントはバナー表示とし、視認性を高めています。


京宝亭のウェブサイト バナー表示

すべてをゼロから作り直すこともできますが、使えるところは使いながら改善点を修繕するなど、お客様の視点に立ったサイトリニューアルも可能です。


(*1)グローバルナビゲーション
ウェブサイトの全てのページに共通して設置された案内リンクのこと。 会社概要やサービス紹介などウェブサイトの主要ページにリンクし、ショートカット機能として活用することが一般的。


クライアント 宝食品株式会社様
URL https://www.kyohotei.co.jp/
公開日 2020年3月
デバイス
パソコン/スマートフォン
プロジェクトメンバー

よく似た実績はこちら

MORE VIEW

失敗しないホームページリニューアルマニュアル