BRUNCH様(コーポレートサイト)|Web制作実績 レスポンシブ対応|制作実績
ユーザーが知りたい情報を最短の導線で閲覧できる設計
クライアント | BRUNCH様(東京都目黒区) |
---|---|
制作プラン | Meta定額制30プラン |
カテゴリ | 店舗サイト コーポレートサイト・事務所 その他 |
URL | https://www.brunchone.com/ |
制作チーム |
|
REPUTATION
お客様アンケート評価
修正の要望に納得がいくまで何度も応えてもらい、理想通りのサイトを作ることができました!
5段階評価平均
4.4
-
担当者の評価
5/5
-
担当者の知識
5/5
-
リクエスト対応
1/5
-
デザイン
5/5
-
フルオーダーメイド設計
5/5
-
CMS更新システム
5/5
-
制作料金
5/5
ネオインデックスを選んだ理由は?
- 初期費用0円
POINT
制作のポイント
お客様のご要望
- 検索順位を上げたい(SEO対策)
一枚板のダイニングテーブルを中心として、東京の目黒でオーダーメイド家具の製作・販売をされているBRUNCH様のコーポレートサイトをリニューアルいたしました。
今回のリニューアルの目的として、「SEO対策を強化したい」「オーダーメイド家具とリフォームの集客を強化したい」の2つのご要望を頂きました。
そのため、クライアントのこだわりを細かく実現できる家具屋をお探しの方や、店舗の家具製作からリフォームまでをトータルで任せたい方など、特に設計会社やデザイン会社のご担当者様をメインターゲットに設定し、PCとスマートフォンの使用比率は7:3と想定しPCファーストで設計いたしました。
お客様はHP運用コンサルティングサービスをご契約いただいたため、専任のマーケティング担当が細部までSEO対策を熟慮した設計を施しました。例えば、旧サイトでも自然検索で上位表示されていた「オーダーメイド家具」ページは、全体的な構成や重要キーワードを残しつつ、プロのライターが綿密なヒアリングのもとキャッチコピー付きのわかりやすい文章にリライトすることで、初めてのユーザーでも読みやすいページに刷新しております。リニューアル後も、定例MTGを新たなSEO施策を毎月ご提案させていただき、お客様のさらなる集客アップを二人三脚でサポートいたします。
今回、重要なコンテンツをしっかりと押し出す形の設計を行うことで、競合他社との差別化をはかりました。具体的には、メインビジュアルのすぐ下には通常の「選ばれる理由」コンテンツではなく、実際の商品をイメージできる「オーダー家具の納品事例」を自動スライド表示しております。そのため、ユーザーが知りたい情報をすぐに閲覧できるほか、“デザイン性の高い木製家具をオーダーメイドで実現できる”というお客様の強みを視覚的に訴求しております。
また、画面が大きいPCサイトでは、ホームページの主役である商品を効果的に押し出すため、家具写真を大きく見せる形で配置しているほか、レイアウトにはあえて枠からはみ出すブロークングリッドを使用することで、スタイリッシュな雰囲気を演出しております。さらに、法人ユーザーはPCの使用比率が高い傾向があるため、PC用サイトではメインビジュアルの右下に「法人向けページ」への導線バナーを配置いたしました。
さらに、CV率向上の対策としましては、下層ページの最後に主要コンテンツへの導線バナーを配置することで、ユーザーが知りたい情報を最短の導線で閲覧できる設計にいたしました。また、ユーザーがスムーズな流れでお問い合わせしていただけるよう、お問い合わせフォームでは、「ご注文」「修理依頼」「見積依頼」などの5種類の用途に合わせて入力項目を自動で切り替え表示しております。
お客様は非常に多くの納品事例と家具写真をお持ちのため、納品事例CMSの管理画面は通常のテンプレート形式ではなく、事例ごとに画像の配置や文字の装飾などを自由にカスタマイズしていただけるフリースタイルの仕様にいたしました。そのため、複数の写真を横並びで表示できるだけでなく、関連商品への導線を配置できるなど、管理画面からの簡単な操作で高品質なコンテンツを継続して増やしていただけます。また、トップページ上部の納品事例コンテンツでは「個人顧客のオーダー家具事例」、下部では「法人顧客の納品事例」を表示するなど、ページ全体の流れに合わせて細やかな工夫を施しました。
デザイン面では、主役である木製家具写真が際立つよう、ベースカラーにはモノトーンを採用し、全体的に彩度を落としたカラーで統一しております。また、縦書きのアルファベット装飾や縦長の切り抜き写真を使用しているほか、スクロールした際にブラック背景から家具写真がスライド表示されるアニメーションを取り入れることで、メインターゲットである男性ユーザーにも好まれやすいスマートな雰囲気を演出いたしました。
Webデザイン
モバイル用サイトでは、メインビジュアルの下に「選ばれる理由」「納品事例」「商品情報」など6種類の主要コンテンツへの導線を配置しております。イメージしやすいアイコン付きで表示することで、「フルオーダーメイドやリフォームが得意な木製家具屋」というお客様の特徴がファーストビューでわかるだけでなく、ユーザーはお探しの情報をスムーズな流れで閲覧でき、3PV(ページビュー)以内でCVしていただける導線設計となっております。
また、「実際に店舗にご来店していただく」というCVアップのため、ページ上部のヘッダーには、主要コンテンツである商品検索ページへの導線だけでなく、店舗情報ページへの導線を固定表示いたしました。
さらに、法人ユーザーからの集客とCVアップのため、「設計会社の方」「デザイン会社の方」「オフィスのリフォーム」「店舗のリフォーム」という4種類の業種別ページを新たに作成いたしました。それぞれの業種の特徴に合わせて、オーダーメイド家具屋ならではの強みや特徴を効果的に訴求することで、法人の方が安心してお問い合わせいただけるだけでなく、集客キーワードの関連性が深まるためSEO対策としても効果的なコンテンツとなっております。
ほかにも、SEO対策の1つとして、旧サイト内で特にPV数が多かったページには「301リダイレクト」を使用した転送処理を行っております。リニューアル後もGoogleからの評価を引き継ぎ、検索順位をさらに向上できるよう、さまざまな視点からWeb集客をバックアップするサポートをさせていただきます。
システム面では、お客様がブラウザ上で簡単に更新していただけるよう、お知らせ・商品情報・導入事例にCMSを、コラムにWordpressを取り入れております。そのため、ホームページ公開後も継続してコンテンツを増やすことができ、SEO対策を強化しながらCVをアップさせるためのツールとしてご活用いただけます。
デザイン面では、「男性ユーザーからの集客を増やしたい」というご要望をいただいたため、ベースカラーには落ち着いたモノトーンを採用し、アクセントカラーとして上品なゴールドを取り入れることで、全体的にスタイリッシュな雰囲気にまとめました。一方で、法人向けのコンテンツでは、アクセントカラーにエメラルドグリーンを使用することで視覚的な差別化を行っております。また、ホームページ内では有料素材を一切使わず、お客様からご提供していただいた実際の家具写真だけを使用することで、お客様の1mm単位の家具へのこだわりがサイト全体から伝わるデザインに仕上げました。
Web制作・運用サポート一覧
PC・タブレット用フルオーダーメイド設計、オリジナルWebデザイン、PC用UI/UX設計、ワイヤーフレーム作成、HTML/CSSコーディング(レスポンシブサイト)、Googleアナリティクス設定、各種CMS開発、WordPress開発、jQueryコーディング、PLESKサーバー、ヒアリング取材、原稿作成、アフターサポート
BEFORE AFTER
劇的ビフォーアフター
旧サイトにメスを入れ、お問い合わせが絶えないホームページへ
PC DESIGN
PCサイトデザイン
お客様の特長を活かした、”世界にひとつ”のオリジナルデザイン
SMARTPHONE DESIGN
スマートフォンサイト
デザイン
ターゲットに最適なユーザビリティを考慮した、UI/UXデザイン
WORKS