ベビーフェイスプラネッツ babyface-stella.jp

Category | Works

Credit

Director : Hana Suzuki
Designer : Ayaka Okamoto
Engineer : Chiho Rokukawa

お客様からのご相談

以前、コーポレートサイトを制作させていただいた、弊社のお客様であるステラ株式会社様(以下、ステラ様)から、ある日1本のお電話が掛かってきました。それは、ステラ様がフランチャイジーとして展開されている、『ベビーフェイスプラネッツ』というカフェレストランのサイトリニューアルに協力いただけないかというご相談でした。ステラ様は岡山県内でベビーフェイスプラネッツを3店舗経営されており、新しく4店舗目がオープンすることをきっかけにご連絡くださったそうです。
とても楽しく取り組ませていただいた前回の制作期間を思い出し、胸を躍らせながら始まった新たなプロジェクト。

今回は、ベビーフェイスプラネッツのサイトリニューアルについてお話させていただきます。

devices

2つの視点からの課題

ベビーフェイスプラネッツは、“毎日がハレの日”というコンセプトのもと、街中にいながらインドネシア・バリ島の異国情緒な雰囲気を味わえるカフェレストランです。関西を中心に全国85店舗以上、ほとんどの店舗がフランチャイズという形で経営されています。
ステラ様が経営されている岡山県内の店舗については、元々Webサイトが存在してはいたものの、いくつかの課題を抱えていらっしゃいました。

【 ユーザー視点での課題 】

  • どこに何の情報があるのか分かりにくい
  • メインとなるメニューの情報がPDFで掲載されており見にくい
  • スマートフォンで操作しにくい

【 運営視点での課題 】

  • 情報の入れ替わりがあるものに関して、更新がしにくい
  • 大きな特徴であるサイズバリエーションの豊富さが十分アピールできていない
  • 各店舗によって内装やおすすめのポイントが異なるが、サイトで紹介しきれていない

ヒアリングを重ねる中で見つかった上記の課題を改善するため、まずはサイトの構成や仕様から一緒に作り直していくことにしました。

この先も使い続けられるサイトを

同業種の構成を参考にしながらも、より使いやすいサイトとなるにはどうしたらいいのかを考えました。
例えばメニューのカテゴリー分けについてです。元々はレストランでよくある「グランドメニュー」「ランチメニュー」「その他メニュー」と分けていたところを、ユーザー視点で見ると分かりにくいのではということで、「フード」「デザート・ドリンク」「その他メニュー」という分け方にしています。オムライスやパスタでは、ライス、ソースの種類を色分されたラベルで表示し、ユーザーがよりお好みのメニューを見つけやすくできるようにしています。
また、ワードプレスの投稿機能を実装し、新メニューが追加された際やメニューの内容に変更があった際でも、ステラ様の方で簡単に対応できるようカスタマイズしています。

メニュー

https://babyface-stella.jp/menu/

メニュー – オムライス

https://babyface-stella.jp/omurice/
device-pc

ワードプレスの管理画面

サイトは公開して終わりではなく、運用し続けてもらうもの。
特に今回のようなサイトでは情報の入れ替わりも多く、公開後の運用が鍵となってきます。更新は社内のどなたが、どれくらい担当できそうか。皆様の現状も踏まえた上で細かく擦り合わせを行いました。

サイトトップにあるバナー画像では、お店の特徴に加え、その時々のお知らせ事項や季節のメニューなども紹介できるようにしています。
当初は新しい情報が入ればステラ様の方でバナーを作成し、差し換えていただく想定でした。しかし、デザイン可能な担当者様が社内に見当たらないこと、日々忙しない中で更新の時間を作れるか不安であるということなどをお聞きし、ステラ様に更新いただくことは現実的ではないとの結論に至りました。旬の情報をいち早くサイトに掲載するためにも、また、一定のクオリティを担保するという点においても、弊社のサポートチームに在籍しているデザイナーで公開後も担当させていただくということになりました。
こんな風に私たちはユーザーと運営する方々にとって、何がベストの方法か一緒に考えていくことを大切にしています。

device-pc

デザインに落とし込む

私たちはデザインをする時、お客様のことをよく知ることから始めます。
調べてみると兵庫県内にも店舗があることが分かり、実際に行ってみることに。想像よりずっと色濃くバリ島の雰囲気が漂う店内に、思わず違う世界に来たような感覚になりました。看板メニューの「ふわふわ帽子のオムライス」は、まん丸に盛られたケチャップライスに半熟卵がふんわり乗っていて、見た目も味もとろける美味しさ。周りを見渡してみると全席半個室の席となっており、家族連れや学生のグループが多く、楽しそうな笑い声が聞こえてきました。
私も今度は誰かと一緒に訪れて、時間も忘れてお喋りしたいな、と想像しながら、のんびり食後のひとときを過ごしました。

その後はステラ様が経営されている岡山の店舗にも何度か足を運びました。それぞれの内装や雰囲気のちょっとした違いも感じながら、1ユーザーとしてベビーフェイスプラネッツを体験し、デザインのイメージを膨らませていきました。

device-pc
device-pc

先述のように情報を整理し組み立てていくことにプラスして、お店に行きたくなるようなビジュアル作りをデザインからアプローチしていきました。料理のお写真は全てご提供いただいたのですが、切り取り方や並べ方、あしらいや装飾ひとつ取っても印象がガラリと変わってしまいます。
美味しい料理は、より美味しく見えるように。店舗に一歩足を踏み入れた時の、まるで異国にワープしてきたような感覚が少しでも伝わるように。そんな想いでデザインをさせていただきました。
また、わくわく楽しい雰囲気を演出するために、サイト内のリンクボタンやイラストの動きにもこだわっており、見どころとなっています。

制作を振り返って

新店舗オープンに合わせてリニューアルをしたいとのご要望があった本サイト。キックオフをした際、すでにオープンまで1ヶ月半ということもあり、当初の予定ではトップページとメニューページのみ一次公開とさせていただくようお話をしていました。
しかし今回、メニュー写真や原稿素材をある程度ご提供いただけたこと、オンラインでのお打ち合わせも活用し、ステラ様と協力しつつスピード感をもちながら進めていくことができたため、無事に新店舗オープンより早くサイト内の全ページを公開することができました。
オープン前日のレセプションパーティーにもお招きいただき、ステラ様を始め、店舗設計を手掛けられた株式会社バンディット様、関係者の方々から「素敵なサイトをありがとう」と笑顔をいただいた時はとても嬉しく、制作チームみんなでお腹いっぱい、幸せいっぱいベビーフェイスプラネッツでのお食事を堪能させていただきました。

公開後もより充実したコンテンツをユーザーに届けられるよう、岡山の各店舗を訪れて撮影を行わせていただいている最中です。

device-pc
device-pc

サイトはまだ公開したばかり。
これからも美味しい料理と癒しのひとときをお客様に届けていかれるステラ様にとって、困ったことがあればすぐ相談できるような良きパートナーとして、しっかりサポートしていけるよう全力を尽くしていきたいと思っています。

最後に、本プロジェクトにご尽力いただいた代表の橋野様や亀井様、川谷様、スタッフの皆様にあらためて御礼を申し上げると共に、今回のサイトがステラ様の更なるご発展に寄与できることを心より願っております。

Company information

〒650-0024
神戸市中央区海岸通5 商船三井ビルディング4F

Contact us

WEBに関するお問い合わせは
078-977-8760 (10:00 - 18:00)