寿司・しゃぶしゃぶ ゆず庵 ブランドサイト

Creative Direction

ゆず庵を訪れるお客さま、サイトを運用する物語コーポレーションさま双方にとって明快なデザインとCMSに

物語コーポレーションさまからお問い合わせいただいたのは2025年5月頃です。ゆず庵のサイトの1ページであるお祝いプランの1ページのリニューアルのみのご依頼からはじまりました。

最初のミーティング時に現状や将来やりたいこと、利用しているCMSやシステム、インフラまわりのこと、運用での課題など、多くのことをたくさんお聞きしたのをいまでも覚えています。

たくさんのご要望やご依頼をいただきながら全てにお答えができないこともありましたが、お祝いプランのページを起点にしてゆず庵のブランドサイト全体の制作をお手伝いさせていただくことになりました。

情報設計や言葉、デザインを進める中で物語コーポレーションさまの目指していきたいデザインやお客さまに伝えていきたいこと、伝え方、ブランドのあり方などをneccoでも理解を深めながらデザインの調整や改善を重ね、すり合わせていきました。

目に見えるデザインだけでなく、利用するCMSや管理画面を運用するうえでの使い勝手なども視野にいれ、最善で最適な運用体制や方法になるよう、ウェブサイトの表示側から管理画面の利用、公開後の運用などを考え、デザインと実装、管理画面などまっすぐに最適な状態になることを目指しプロジェクトを進めていきました。

ウェブサイトは公開してからの運用がとても大事だと考えており、サイトを良くすることはもちろん、運用更新コストが低く、安心して運用し続けられることがなによりもサイトを利用するお客さまのメリットにもなると考えています。

ゆず庵のサイトでいえばお店の場所、予約、メニュー、期間限定フェアやプランなど、知りたいことがすぐにわかる。管理画面からすぐに更新することができる。などです。

今回のウェブサイトではサイトを利用するお客さまにとってはもちろん、物語コーポレーションさまがサイト公開後も安心してサイトの更新が素早く快適に行えるよう、双方にとって明快なウェブサイトになるようにしました。

Direction & Writing

おいしさが伝わり、迷わず予約できるサイトへ

本リニューアルで強く意識したのは、「商品のおいしさとこだわりが伝わること」「お客さまを迷わせないこと」の両立です。文章はできるだけ減らして認知負荷を下げながら、メニューの魅力はきちんと伝わるよう、サイト構造の設計からワイヤーフレーム・プロトタイプまで丁寧に作り込みました。

導線設計では、「予約」というゴールから逆算して全体を構成しました。スマホユーザーを主軸に、ワイヤーフレームもSP優先で設計。PC・SPともにメニューページは上部に固定ナビゲーションを置き、コース詳細を見ている途中でも別のコースへ自然に移動できるようにしました。SPはボトムに「メニュー」と「予約する」ボタンを固定することで、どこからでも予約・店舗検索ができるようにしています。PCのナビゲーションにはメガメニューを採用し、食べ放題・ランチなどのコースに少ない動作でたどり着けるようにしました。

デザイン着手前には実店舗へ足を運び、食べ放題コースを楽しみながら、内装や店員さんのリアルな雰囲気を体験しました。「この良さをもっと多くの人に伝えたい」という気持ちがより強くなり、常に高い熱量を保って向き合えたプロジェクトでした。公開後もneccoオフィスでは、「ゆず庵いきたいね」「予約いっぱいだ！すごい！」そんな会話が飛び交っています。

Web Design

ゆず庵のブランドイメージに寄り添いながら、メニューの魅力を直感的に訴求するデザイン

ゆず庵こだわりのメニューの魅力を商品写真を主役に直感的に伝えながら、使い心地も両立したデザインを目指しました。

更新頻度の高い季節限定フェア、寿司やしゃぶしゃぶなど上質なメニューのビジュアルは大きくしっかりと見せて美味しさを訴求。必要最低限まで情報量をそぎ落とし、大切な情報は見やすく、わかりやすく、すぐにアクセスできるよう、サイトを利用するお客さま目線の設計にもこだわりました。

ゆず庵のブランドや店舗イメージと統一感が出るように、店舗の内装の雰囲気を踏襲した和モダンのあしらいを随所に取り入れました。お客さまが安心して食事を楽しむことができるゆず庵の温かい空気感を、清潔さや上質さを感じさせる柔らかく落ち着いたトーンでまとめながら表現しました。

UI Design

多彩なメニューを
直感的に探せるUIに

寿司・しゃぶしゃぶに加えて旬のごちそうやデザートなど、充実したメニューを提供するゆず庵。
多彩なメニューを迷わず閲覧できるよう、ページ上部に固定したアンカーリンクにより、全体像を把握しながら目的の情報へスムーズに遷移できる構成にしています。

Web Development

WordPressのブロックエディタを活かし、直感的な更新体制を構築

WordPressのクラシックテーマをベースに、ブロックエディタの機能を組み合わせた実装を行いました。CSSフレームワークにはTailwind CSSを採用し、モダンなデザイン表現と開発効率を両立させています。

ブロックエディタが持つ基本機能を最大限に活かすことで、コーディングの知識がなくても、WordPress管理画面から「見たまま編集」で日常的な更新作業を行えるように設計しました。飲食店サイトならではの頻繁な情報更新にも、スムーズに対応できる体制を実現しています。

特に、期間限定メニューの入れ替えや価格改定、商品画像の差し替えといった定期的に発生する更新作業には、同期パターン機能を積極的に活用しました。複数ページにまたがる共通コンテンツを一箇所で管理することで、更新の手間を大幅に削減し、サイト全体の一貫性を保ちながら効率的な運用を可能にしています。

お客さま自身が安心して更新できる、メンテナンス性の高いサイト構造を目指しました。

Client Voice

デザインから裏側の運用体制まで真摯に向き合い、期待を大きく超えるサイトに仕上げていただきました

今回のリニューアルにおける一番のテーマである「お客様がいかにストレスなく、直感的に目的を達成できるサイトにするか」を、理想的な形で実現してくださいました。

食品という視覚的な魅力が直結するデリケートな商材ゆえに、膨大なメニュー数をわかりやすく整理する情報設計はもちろん、食品ならではの「美味しそう・行きたい」という情緒性と機能性を両立させるのは、難易度の高いオーダーだったと思います。

そのようななかneccoさまは、単なる具現化にとどまらず、実際に店舗へ足を運びサービスを体験したうえでご提案をくださいました。その客観的な視点は、私たちがブランドの強みを再確認するきっかけにもなりました。

また、表側のデザインだけでなくCMSも根本から改修いただき、専門知識がなくても直感的に触れるようになったことで、作業効率が上がり運用ストレスも段違いに改善されました。

最後まで妥協のない調整と熱意ある伴走の結果、予約導線への遷移率はトップページで約1.1倍、お祝いページでは約1.8倍へと劇的に向上しています。

デザインから裏側の運用体制まで真摯に向き合い、期待を大きく超えるサイトに仕上げていただきました。多くの学びがあり、何より楽しくご一緒できる素晴らしいパートナーに出会えたことに心より感謝申し上げます。

株式会社物語コーポレーション
業態開発本部 デジタルマーケディング部
加茂 雪乃