makeshop《メイクショップ》でこんなデザインを作れる!株式会社猫の手が実際に制作したmakeshop《メイクショップ》デザインのポイントを紹介します。
梅原 です
2020.09.11
makeshop《メイクショップ》でネットショップをオープンしたいけど、オリジナルのデザインにしたい!という方が増えてきています。
オリジナルデザインを作る時に、どんなデザインを作ることができるの?何ができるの?という疑問をお持ちの方もいらっしゃるかと思います。
今日は、株式会社猫の手が実際にデザインし、運用している「ネコノテストア」のデザインを紹介しながら、makeshop《メイクショップ》でできるデザインを皆様にお伝えしていこうと思います!
makeshop《メイクショップ》で作ったネコノテストアはTOPページにデザインのこだわりがあるのです!
こちらがmakeshop《メイクショップ》で制作したネコノテストアのTOPページです。
最初にサイトに訪れた際のページになります。ここでのこだわりポイントは4つ。
- メニューにタブを付け、どのページからでもタブを押せるようになっている
- スライドショーのサムネイルを画像にし、見たい画像を押しやすいようにしている
- 最新のニュースを見える場所に配置し、最初にサイトに訪れた際に目にいくようにしている
- ページの右下にキャラクターのボタンを設置して、重要なページにいきやすくしている
それぞれ詳しく解説していきます!
メニューにタブのデザインを入れ、どのページからでもタブを押せるようになっている
このタブには、「初めての方へ」「ネコノテストアでお店を持つ」という重要なページへのリンクを入れています。他のメニューより目立たせたいリンクや重要なページへの遷移に役立ちます。「このページは絶対に見て欲しい!」というページがある場合、このタブのデザインのリンクはとても効果的です。
makeshop《メイクショップ》スライドショーのサムネイルを画像にして、見たい画像を押しやすくしている
makeshop《メイクショップ》のスライドショーはデフォルトだとボタンになっています。
ボタンが画像になっていると、気になる画像をすぐ押すことができます。なのでボタンに画像がくるようにカスタマイズしています。
最新のニュースを最初にサイトを訪れた時に見える場所に配置している
ネコノテストアでは、WordPressで更新しているブログがあります。そのため、makeshop《メイクショップ》のニュース機能は最新のセール情報などを告知する用として使用しています。最新セール情報は最初にサイトを訪れた際に見えるようにしておきたかったので、スライドショーの上に最新の1件だけを表示するようにしています。
ページの右下にキャラクターのボタンを設置して、重要なページにいきやすくしている
サイトの右下に常にネコノテストアのキャラクターを表示しています。ここから重要なページにいけるよう、リンク先を設定しています。常に右下に表示するのでネコノテストアの可愛いキャラクターと一緒に表示し、不快感を与えないようにしています。
TOPページにWordPressのブログとキャラクターのツイッターを読み込み、見ていて楽しいサイトにしています!
makeshop《メイクショップ》にWordPressブログの最新記事4件を読み込み、ブログにいきやすくしている
ネコノテストアのブログは、この株式会社猫の手のブログと同じドメインで運用しています。
ネコノテストアのブログはこちらから
makeshopと同じドメインのWordPressブログの運用もできるのですが、導入には費用がかかります。
導入の詳細はこちらから
また、当社ではブログの管理画面を複数に分けたくないという理由もあり、この株式会社猫の手のブログと同じドメインで運用しています。
最新のブログを4件表示し、ブログが更新されたことがわかるようにしています。
makeshop《メイクショップ》にキャラクターのツイッターを読み込み、キャラクターの日常がわかるようにしている
ネコノテストアでは、各キャラクターがツイッターを更新しています。各キャラクターの性格がすぐにわかるようにツイッターを読み込み、TOPページで見れるようにしています。
左側メニュー(サイドバー)をクリックして押すメニューにカスタマイズ
ネコノテストアはサイトを1カラムにし、商品やコンテンツをスッキリ見せたいという思いがありました。そこで、左側メニュー(サイドバー)を最初は見えないようにし、ボタンをクリックすると見えるようにしました。サイト全体がスッキリとした印象になる上に、左側メニュー(サイドバー)の中にたくさん情報を入れることができるので好評です。
ネコノテストアのようなカスタマイズを自社サイトでもやりたい!ぜひ一度ご相談ください!
このように株式会社猫の手では、makeshop《メイクショップ》で運用するネットショップに様々なカスタマイズを行なっております。うちでも同じようにやってみたい!一部分でいいからカスタマイズしたい!など、様々なご相談に応じます。
また、株式会社猫の手では、ネコノテプラスという月額料金でサイトをカスタマイズしたり、リニューアルしたりすることもできます!
ネコノテプラスの詳細はこちらから
費用を抑えてmakeshop《メイクショップ》のリニューアルをしたい方、makeshop《メイクショップ》でネットショップを初めてみたい方、makeshop《メイクショップ》以外のサイトで運用している方もぜひ一度ご相談下さい。経験豊富なスタッフが、一番最適な運用、デザイン、カスタマイズを一緒に考えていきます!
お見積もり・制作依頼・ご相談はこちらから
この記事を書いたのは・・・
梅原 です
フロントエンドエンジニア
梅原です。svgをゴソゴソする、cssでアニメーションするのが好きです。猫3匹飼ってます。猫はお腹から吸うのが好きです。趣味は読書