DESIGN IT YOURSELF.

BUROKI


top

design

  • top
  • design
  • つくる人達をつなぐ。のぼり刃物店さんのECサイトデザイン

つくる人達をつなぐ。のぼり刃物店さんのECサイトデザイン

web

  • top
  • design
  • つくる人達をつなぐ。のぼり刃物店さんのECサイトデザイン

つくる人達をつなぐ。のぼり刃物店さんのECサイトデザイン

2020.10.23.

スポンサーリンク

スポンサーリンク

7月ごろから制作を開始した、いつもご依頼をいただいてお世話になっているのぼり刃物さんのオンラインショップが先日、無事にオープンしました。

サイト構築はMakeShopを利用

ECサイトはブランドサイトやコーポレートサイトのように情報を見せて問い合わせなどに促すようなサイトではなく、「会員登録」や「決済」が必要になるのでセキュリティはかなり重要です。なのでボク一人ですべて構築するのではなく、ECカートを提供しているサービスを利用し、そのサービスのなかでサイトを構築していくことが無難です。

ECカートを提供しているサービスはいくつかありますが、月額費用や商品登録環境などの兼ね合いで今回はGMOが提供している「MakeShop(メイクショップ)」を利用することにしました。

実際にMakeShopを使ってECサイトをつくってみたからこそいろんなことがわかりました。そのことをまとめたブログも書いているので、デザインとはあまり関係ありませんがよかったらそちらの記事も見てみてください。

トンマナを意識し、テイストに沿ってサイトを制作する

のぼり刃物店さんのデザインはボクがいくつか手掛けさせてもらっていて、以前ロゴデザインと名刺デザインを担当させていただきました。

ロゴからコミュニケーションをとって制作させていただいたからこそのぼりさんが大事にしている思いがわかりますし、表現したいデザインもわかります。ロゴと名刺で構築したトンマナから逸れることなくECサイトも制作していきました。

MakeShop側が用意しているページをフルカスタマイズ

当たり前ですが、ECサイトを立ち上げたいと思う方は個人であったりお店であったり企業であったりしますが、基本的にはデザイナーではない方が多いです。

なのでサービスを提供する側も一般の人だけでも出店できるようにテンプレートなどを用意しているのですが、デザイン的に納得できるものではなく、テンプレートをそのまま利用するとのぼり刃物さんの世界観を伝えることが難しいと判断したので、すべてのページのデザインを新しく制作することにしました。

TOPページから基本ページの構造を調べながらカスタマイズ
TOPページから基本ページの構造を調べながらカスタマイズ

MakeShopは老舗カートシステムなので最新のweb環境に対応しているわけではなく、語弊ありますが少し遅れているくらいの環境なのですが、webフォントやcss3をできるだけ活用し、htmlのソース構造も可能な限り新しくつくり替えました。

特にスマホ用サイトはまだまだ機能的にも不十分な点が多かったですが、その中でも出来る限りのサイト制作をしました。

リストに表示させたアイコンデザイン
アイコンはもちろん自作です
無駄を省きながら再構築した商品リストページ
無駄を省きながら再構築した商品リストページ
商品画像を使ったカテゴリ一覧
商品画像を使ったカテゴリ一覧

載せている商品数は今後も増え続けるサイトなので、カテゴリやメーカー一覧からできるだけ探しやすく・・。もちろんのぼり刃物店さん側でも更新できるようなソース構造で幅をもたせながらつくっていきました。

もちろんPC用サイトもすべてカスタマイズしました

個人的にECサイトをつくる上で気をつけていること

ボクが働いていた前職の企業のメイン事業はECサイトの運営だったので、それなりにECに関しては知識があります。その上でECサイト制作で一番大事なことは、「欲しい商品を普通に買えること」です。

ECサイトはどういう商材を売るか、どんなお客さまに対して売るかによってサイトの構造も変わってくるのですが、今回は職人さんに向けた道具のオンライン販売がメインなので、道具やメーカーから探せるように、いわば「その商品のことを知っている職人さん向け」に想定したサイトのつくりにしました。

ECサイトに初めて訪れたお客さまが普通に商品を購入する・・。当たり前のことのように思いますが、サイト上ですべての動作をお客さま自身で完了してもらう必要があり、意外とこれが難しいのです。

ECサイトのこの本来の役割を果たすために、余計なものは徹底的に排除してもいいと思っていて、例えばブランドサイトなどで見せるようなスクロールで表示していくようなアクションなんかは全くの不要です。ページ表示速度が遅いなんてのも改善しなけばいけないですし(このサイトの表示速度は遅めですが・・笑)、サイトデザインはシンプルすぎても探すのが難しいし、その辺のバランスはかなり意識しながらつくりました。

オープン後3日で会員登録者数60名超えの順調な滑り出し

元々のぼり刃物さんにはたくさんの顧客がいることもあり、「スマホで商品を買えるようにしてほしい」という要望が多かったとのことなので、オープンから順調に会員登録数や注文数も増えており、3日目で会員さまが60名を突破しました。今回のECサイトは楽天やYahoo、Amazonのようなショッピングモールに出店したサイトではなく、完全に独自ドメインのECサイトなので、かなり好調なスタートだと思います。

さらにECサイトオープンから約2ヶ月後の11月には月間売上200万円と突破しました。素晴らしいのひとことです。

のぼり刃物店さんのスマホ用ECサイトデザイン
スマホ用サイト制作にかなり力を入れました

また機会があれば単独のテーマにしてブログに書きたいのですが、はじめから独自ドメインにてECサイトを構築することをボクは基本的にはオススメしていません。なぜなら「集客」がかなり難しいからです。ですがのぼり刃物さんの場合は長年の顧客との関係性があるのと、インスタグラムで1万人以上のフォロワーを獲得されていて、独自ドメインでも問題ないと判断したからです。

このケースは本当に稀で、顧客との関係性もなくイチからECサイトを立ち上げたい場合は、集客を兼ねてくれるショッピングモールをまずは利用しましょう。見つけてもらうことが何よりも大事ですから。

MakeShopでのサイト制作は初めてでしたが非常に学びが多く、ためになった案件でした。のぼり刃物店さんも喜んでくださったので、ボクとしてもひと安心でした。ありがとうございました。

production list

今回の制作で対応した項目
  • webデザイン
  • コーディング
  • アイコンやタイポグラフィなどのグラフィックデザイン
  • MakeShopでのサイト構築
  • googleのアクセス解析ツール導入
  • PC、スマホ表示対応
  • バナー制作

のぼり刃物店のオンラインショップはこちらから

実際のサイトは下記のリンクよりご覧ください。
※webサイトによっては変更・クローズしてることもありますので、その際はご容赦ください。

スポンサーリンク

BUROKI写真

BUROKI写真

はじめましてBUROKIです。

ベンチャー企業にて11年間webやグラフィックデザインとブランディング経験を経て、2019年5月よりフリーランスデザイナーになりました。完全独学でフリーランスになった異色の経歴の持ち主だと思います(笑)

制作実績やインハウスデザイナーのことなど日々更新しています。デザイン制作のご依頼やお問い合わせなども受け付けてますので、なんでもお気軽にご相談ください。

ベンチャー企業でマスターデザイナーとして働いた後、フリーランスになりました。制作実績やインハウスデザイナーのことなど日々更新しています。制作のご依頼なども受け付けてますので、なんでもお気軽にご相談ください。

ご依頼・お問い合わせ

ご依頼・お問い合わせ

related contents

関連コンテンツ一覧
スポンサーリンク

文鳥とデザイナー

スポンサーリンク

design list

デザイン作品一覧

logo

お世話になった職場へ。コーヒーパッケージに使用したロゴデザイン

先日、instagramよりご依頼いただいたこちらの制作案件。 「いま働いている職場を退職するので、お世話になった職場の人たちにオリジナルのコーヒー…

2023.08.16.

graphic

テンプレートとしてつくる。宅麺.comのリーフレットデザインリニューアル

以前コーポレートサイトを制作させていただいた「宅麺.com(ドットコム)」でお馴染みのグルメイノベーション株式会社さま。 宅麺.comでおなじみのグ…

2023.05.24.

goods

裏面でインスタに誘導する。ナノナノファクトリーさんのステッカーデザイン

少し前に制作させてもらったのぼり刃物店さんのステッカーと缶バッジのデザイン。 創業52周年。のぼり刃物店さんのオリジナル缶バッジとステッカーデ…

2023.05.08.

goods

創業52周年。のぼり刃物店さんのオリジナル缶バッジとステッカーデザイン

本日4月1日は、いつもお世話になっているのぼり刃物店さんが創業52周年を迎えられます。 今年も昨年に引き続き、52周年記念の缶バッジとステッカーの…

2023.04.01.

web

1枚のページに集約してシンプルに。Lino Realty株式会社のコーポレートサ...

大阪市西区で不動産の売買や賃貸業を営んでいるLino Realty株式会社さまのコーポレートサイトを制作しました。 Lino Realty株式会社さまは創業されて…

2023.03.25.

graphic

2023年は卯年。ミッフィーをパロディした年賀状デザイン

少し遅めではあるのですが、2023年も年賀状デザインを制作させていただきました。 BUROKI design的に新年の制作といえば、福岡の木工集団「ナノナノ…

2023.01.27.

designをもっと見る

制作のご相談・お問い合わせはフォームから

デザインのご依頼や予算のご相談、お問い合わせなどお気軽にお問い合わせください。
また、書いてほしいブログのリクエストやファンレター(笑)もお待ちしております。

問い合わせフォームはこちら

topトップページ

aboutブロキについて

designデザイン

voiceお客さまの声

blogブログ

films制作動画

cassetteカセットテープ

snsソーシャル