リニューアル前のECサイトに顕在化した「4つの課題」

たねやグループでは、和菓子の「たねや」、洋菓子の「クラブハリエ」のそれぞれのブランドごとにオフィシャルWebサイトがあり、それぞれのブランドの商品を購入できる公式オンラインショップも運営しています。今回はオンラインショップのリニューアルについてお聞きしたいと思いますが、まず、グループ全体としてのブランド戦略や方針について教えてください。

たねやグループ様：グループ会社としての「たねや」「クラブハリエ」のブランドにはそれぞれ「色」があります。たねやは代表銘菓の「栗饅頭」や「斗升最中」「ふくみ天平」といった通年菓子が有名ですし、クラブハリエでは「バームクーヘン」が1番人気です。
各社のWebサイトではそれぞれのお菓子と店舗情報を見やすく配置し、お菓子のページからオンラインショップへスムーズに移動していただけるような導線を設けています。
その他にも、特設ページとしてラ コリーナの店舗ページや「大切にするきもち」のページを設けています。ラ コリーナは「たねや・クラブハリエの今」を体現していますので、季節の商品はもちろん、ラ コリーナの自然の風景や写真を工夫してレイアウトしています。

たねや様からオンラインショップのリニューアルのご相談をいただいたのは2022年のことでした。リニューアルを検討されたきっかけについて教えてください。

たねやグループ様：これまで当社は、「ラ コリーナ近江八幡」をはじめとした直営店や全国の百貨店での対面販売が中心でした。しかし、コロナ禍を経て、オンラインショップの売上が伸長してきた一方で、いくつかの課題が顕在化してきました。

1番大きな課題は「サイト基盤」の課題で、リニューアル前はテレビで当社の商品が紹介された際などにアクセスが一気に増えると、サイトがダウンしてしまうことがありました。そこで、落ちないサイトかつセキュリティ面でも安心・安全に利用できるサイト基盤に改善したいと考えたのがリニューアルを検討した最初のきっかけです。

また、せっかくリニューアルをするのであれば…ということで次の3つの改善ポイントに取り組むことにしました。

ECフロントとバックを一気通貫でリプレイス

では、「安定性と安全性のあるサイト基盤」の課題解決から詳しくお聞かせください。

たねやグループ様：以前のシステムはECフロントとバックが一体となったパッケージを利用していました。そのため、なにかサイトを改善しようとした際にはフロント、バックともに改修が必要になってしまい、費用がかかるのはもちろんのこと、スピーディーな改善活動ができないという課題がありました。
そこで今回のリニューアルでは、SCSKさんからご提案いただいた「フロントとバックを分離させたシステム構成」を採用しました。分離型の構成であれば、フロントとバックで切り離して管理できるため、UI/UXの改善や新しいチャネルの追加などを柔軟に行うことができると考えたためです。
また、ECフロントには「Salesforce B2C Commerce」を採用しました。SaaS型のサービスで、24時間365日の監視がされるほか、最新のセキュリティアップデートが自動で適用されるため、セキュリティ面でも安心して利用できるだろうと考えました。
さらに、ECバックについてもSCSKさんにリプレイスをお願いしました。フロントからバックまで一気通貫でご対応いただくことで、顕在化した課題を解決できると判断しました。

SCSKとの対話を通じて明確化したコンセプトに沿ってデザインを刷新

では続いて「ブランドを大切にしたサイト構成と商品の魅力が伝わるサイトデザイン」について、まずはサイトデザインの観点からお聞かせください。

続いて、「たねや」「クラブハリエ」という異なるブランドの商品をひとつのオンラインショップで販売にするにあたり、サイト構成上はどんな工夫をしたのでしょうか。

たねやグループ様：「各ブランドの店舗で商品を選ぶ」というリアルでのお買い物体験と似たものをオンラインでも提供したいと考えていたため、トップページは一つにし、その中にそれぞれのブランドページを用意する構成としました。そして、ブランドページの中でストーリーや商品写真を掲載することで、それぞれのブランドの世界観を表現するようにしました。
とはいえ、ブランドごとにデザインが大きく変わってしまうとお客様の混乱を招いてしまいますので、「違いはわかるが、違和感はない」良いバランスのデザインにすることを意識しました。SCSKさんとともに色々なデザイン案を検討しましたが、最終的にはページの上部にシンプルなデザインのブランドバーを設置することで、どのブランドのページにいるかが視覚的にわかるようなデザインとしました。
また、「店舗で商品を選ぶような顧客体験を提供したい」とは思っていましたが、お客様の利便性を損なうようでは本末転倒です。そのため、商品検索やショッピングカートは2つのブランドを横断したものにしました。

2つのブランドの世界観は大切にしながらも、お客様の購買体験を最優先に、わかりやすくて使いやすいUI/UXを追求するということがデザインを決めていくうえで大切な観点ということですね。

たねやグループ様：そうですね。実際に店舗でお客様をお迎えするときには、「商品をどう見せれば一番魅力が伝わるのか」「お客様に快適にお買い物していただくためにはどうすればいいのか」ということにこだわって取り組むものですが、オンラインでもその考えは変わらないと思います。

「接客型カート」を採用し、オンラインでの“おもてなし”を実現

続いて「オンラインでの“おもてなし”の実現」についてお聞きします。リニューアル前はどんな課題があったのでしょうか。

たねやグループ様：当社のお客様には「ご自宅用」「贈答用」「複数の宛先にギフトを贈りたい」など、いろいろな購買用途があります。しかし、旧サイトのカートフローは画一的で、お届け先指定や熨斗（のし）の設定など、色々な項目を1ページで入力する必要があり、「注文方法がわかりづらい」という声がありました。
そこで、今回のリニューアルでは、用途に合わせて必要な項目だけを質問していく「接客型カート」を採用しました。これは、まるで店舗で接客されているかのように、ひとつずつお客様に確認をとっていく形式です。
最初に贈答用かご自宅用かを尋ね、贈答用の場合はお届け先が複数あるかを確認し、その回答にあわせて必要な項目だけを確認していくカートフローです。たとえば、ご自宅用の場合は熨斗の設定は不要なので、その画面はスキップして買い物ができるようになっています。
冒頭、「店舗での“おもてなし”と同様の顧客体験をオンラインでも提供したい」ということをリニューアルでの改善ポイントとして挙げましたが、この部分がまさにそれにつながるところです。実際の店舗でお買い物していただいたお客様に対してであれば当たり前にできていた「接客」をオンラインショップでも提供できるようになりました。

そのほかにも、店舗で当たり前にしていた接客をデジタルで実現するという観点でポイントはありますか。

たねやグループ様：以前は、商品をご購入いただいたお客様から、「小分け用の袋が欲しい」とあとからお問い合わせいただくことがよくありました。以前は任意の選択項目としていましたが、リニューアル後は小分け袋が必要かを必ず選択いただいてから購入手続きを開始するフローに変更しました。これにより、お客様の購買体験を向上させるだけでなく、問い合わせ対応業務の削減を実現できました。