稲富滋のWebマスター探訪記 稲富滋のWebマスター探訪記

ココカラファイン わずか5か月でサイトリニューアルが完了! CMS導入でセッション300%増達成

ココカラファインのリニューアル前のWebサイトは「プレビュー機能なし」「予約投稿機能なし」「承認フローなし」だった。CMSの入れ替えを含めたWebサイトリニューアルの舞台裏を聞いた。
[Sponsored]

ココカラファインのWebサイト「ココカラクラブ」は、リニューアル前、一部CMSが入っていたものの、「プレビュー機能なし」「予約投稿機能なし」「承認フローなし」でした。

管理面での課題が多く、2018年にCMS導入を含めたWebサイトリニューアルを実施しました。リニューアルにかかった期間は5か月。リニューアル後は、内部工数を削減できただけでなく、セッション数300%増を達成できました。

そう語るのは、株式会社ココカラファインヘルスケア ドラッグ事業本部 商品・店舗企画部 販促チームでココカラファインのカスタマー/ECサイト全般のウェブマスターをしている林哲史さん。

薬剤師の資格を持ち、店舗の薬局で9年勤務。店長を経験した後、「やはりこれからはECの時代」と、自ら異動を希望し2014年にECチームに所属を移りました。

ECチームでは薬剤師資格と経験を生かした薬品管理と薬品情報のコンテンツ提供の仕事、Web広告を担当。「この間にコンテンツ制作やWeb・ECの基本的なことを学びました」と、言います。2019年からはココカラファインのSNS運用を兼務、Twitterのフォロワー10万人超えを達成。2020年から会員サイト「ココカラクラブ」の責任者となったのです。

今回は、Webサイトからのリニューアルプロジェクトについて詳しく聞きました。

リニューアル前は「プレビュー機能」や「予約投稿機能」がWebサイトになかった

Webサイトのリニューアルは2018年に実施しましたが、リニューアル前は、次のような課題がありました。

  • テスト環境はあったが、プレビュー機能がなく本番環境にアップロードしてから、最終チェックをし、エラーがある場合は急いで修正していた
  • サイト上での承認フローがなかった
  • 日付指定の予約投稿ができず人海戦術だった

予約投稿ができないがゆえに、「キャンペーンの開始は社員の出社日を待ち、休日から始まり、休日で終了するキャンペーンができなかった」と、Webサイトだけの問題ではなく働き方の面での課題もありました。

そこで、2018年にWebサイトのリニューアルプロジェクトが立ち上がりました。チームは当時コンテンツ作成者であった林さんの他に、ココカラファインからIT部門としてアプリ開発やシステムを担当している島さん、ココカラファインヘルスケアに常駐してコンテンツ・デザインから、販促企画、運用などを担当していた株式会社メンバーズの植田さんチーム、今回採用されたWebRelease(ウェブリリース)をクラウド型で提案したビッグローブ株式会社の堀川さんたち約10人のチームでした。

Webサイトのリニューアルプロジェクトでは、上述した運用面での課題を解決する他に、ココカラファインの主要3サイトを1つのCMSにまとめる、という大きな目的もありました。リニューアル以前は、次のように管理手法がバラバラとなっていたそうです。

  • コーポレートサイトはブログベースのCMSを断片的に適用
  • カスタマーサイトが独自開発のCMS
  • ECサイトはExcelベースの独自仕様
株式会社ココカラファインヘルスケア ドラッグ事業本部 商品・店舗企画部 販促チーム 林哲史さん。
ココカラファイン店舗で薬剤師として9年実務経験を積んだ後、2014年にEC事業部へ。医薬品/倉庫管理をしながらコンテンツ作成・WEB広告運用・SNS担当を経験し2020年4月より「ココカラクラブ」サイト責任者となる。

たった5か月でWebサイトリニューアルが完了

上述のような課題から、Webサイトのリニューアルプロジェクトが発足したわけですが、一般的にWebサイトのリニューアルは半年から1年くらいかけて行われるものです。しかし、ココカラファインは、たった5か月というスピード感を持ったリニューアルが行われました。2018年5月には新規CMS導入検討が始まり、7月には要件定義が終了し、10月にリニューアルが完了しました。

このようなスピードでリニューアルが成功したのは、コンサルティング、UX、などデジタルマーケティングを専門とする株式会社メンバーズの方々が常駐していたことも大きかったです(ココカラファインヘルスケア 林さん)

通常は要件定義に時間がかかり、決定後も変更や手戻りなどスムーズに運ぶことはあまりありませんが、常駐していたキーとなるメンバーズの皆さんがココカラファインのサイトの課題や要件について十分に認識していました。その結果、一度決定した要件は変更もなくそのまま導入工程に入ることができました。

Webサイトのリニューアル前からココカラファインさんに常駐し、Web運用などのサポートをしていたので、Googleアナリティクスのデータを見たり、ヒューリスティック分析などを使ったりして、課題の洗い出し、要件定義を定めていきました。ある程度Webサイトの骨格ができた後でも、ユーザーテストなどを駆使して、本番リリース前にできるテストを行いました(メンバーズ 植田さん)

株式会社メンバーズ ユニットプロデューサー 植田大貴さん。
EMC事業のプロデューサー兼ディレクターとしてプロジェクトに参画。サイト分析から改善までのPDCA型の運用支援業務を担当している。

ココカラファインの各担当者さんが抱えている課題と目標(As-Is To-be)が明確であったことや、常駐して運用を知り尽くしているメンバーズさんとビッグローブが密に連携できたことが、リニューアルがわずか5か月で終わった理由です。

また、導入のスピードアップにつながったポイントは2点ありました。1点目は、WebReleaseはワンパッケージのCMSであることです。必要な機能が標準搭載されており、カスタマイズやプラグインが不要になります。

2点目は、WebReleaseをクラウドサービス形式でご提供できた点です。運用体制も含めたサービスのため、ココカラファインさんは設計構築や運用業務が不要になり、サイト更新業務に注力できるからです(ビッグローブ 堀川さん)

全般的にスムーズな導入でしたが、苦労した点について皆さんに聞くと、次のように教えてくれました。

以前のCMSでは、ECで取り扱いが終了した商品でも、コンテンツ内に残り続けてしまい、コンテンツから商品ページに遷移しても「リンク先がない」といった状況が起きていました。そこで、CMSの登録商品DBとEC取り扱い中の商品DBをリンクさせ、ECでの取り扱いが終了した商品は自動的にコンテンツ掲載が落ちるようにしました。

コンテンツ下部に関連商品が表示される(赤枠)。EC取り扱いDBを参照して掲載される仕組み

WebReleaseが選ばれた理由

今回のリニューアルで選ばれたCMSはWebRelease。候補となったCMSは4つありましたが、WebReleaseが選ばれた理由は大きく2つ。

  • WebReleaseの標準機能がココカラファインの要件を十分にカバーしていて独自機能を開発する必要がなかったこと。
  • 対象となるコンテンツ規模に応じた段階的なライセンス製品が選べたこと。

最終的な対象サイトはコーポレートサイト、ECサイト、カスタマーサイトの3サイトでしたが、すべて一度に移行するのではなくアクセス頻度の高い上位コンテンツから徐々に移行する方式が採られました。WebReleaseは適用するコンテンツのサイズに応じた製品が選べるのです。

ビッグローブ株式会社 コンシューマ事業本部 サービスデザイン3部 堀川尚吾さん。
アクセス解析のサービス担当を経てWebディレクターとして様々な案件に参画。 サイト制作や改善の提案だけでなく、プロジェクト化した案件のディレクション及びプロジェクトマネジメントと幅広く業務を行っている。

ココカラファインさんの場合、第一段階での移行ページ数は、PC・スマホ合計で、200ページ程度でした。そのためWebReleaseの最小カテゴリー(500ページまで)のライセンス製品でスタートできました。Webサイトのページ数が増えた場合はアップグレードできるため、攻めのWebサイト活用をするときに便利です(ビッグローブ 堀川さん)

稲富のコメント

新しいCMSを慎重にステップを追って導入するやり方は賢明なものです。机上の検討やテスト利用ではわからなくても実際に本番環境で使い始めてみてからやっとわかる問題もあります。まず狭い範囲で使ってみて(使い慣れてみて)次のステップへ進むというのは妥当な作戦でした。小規模対応から始めるライセンス製品が用意されているWebReleaseが選ばれるのもよくわかります。

導入後、工数削減だけでなく、セッション数が300%増

ココカラファインに、メンバーズの方々が常駐していたのは、「メンバーズさんの知見を活かした会社全体のDX化の基盤作り」が目的でした。ココカラファインの2020年3月期の決算説明会の資料でもITを活用した顧客戦略が重要施策として据えられています。

ITを活用した顧客戦略①(2020年3月期の決算説明会の資料より)
ITを活用した顧客戦略②(2020年3月期の決算説明会の資料より)

ところが、Webサイトのコンテンツの制作から更新までをメンバーズの方々に依存するという状態で「外部から来ている専門家にWebサイトの更新をやってもらうのはもったいない」と感じていた林さん。

Webサイトリニューアルの副次的な目的として、「自らの力で運用できる体制を作り、メンバーズさんには本来の仕事に専念してもらう」ことでした。その結果、CMSを刷新したことで、プレビューや予約投稿機能などもでき、慌てて差し替えに走ったりすることも、出勤日を気にしながらキャンペーンを開催することもなくなり、社内の承認フローもきちんとまわり、自社内で完結できるようになりました。

「ある程度インハウス化できるようになったことで、メンバーズさんと契約していた派遣人数が減ることになってしまいました」と申し訳なさそうな林さんでしたが、「お客様の内製化をご支援するのも当社の取り組みの一つでもありますから心配はご無用です。また違った領域での新しい価値を提案させていただきます!」と応えるのはメンバーズの植田さん。

CMS導入過程で抜本的なディレクトリー構造の見直しとコンテンツの整理を行ったことで、導入翌年の2019年にはコンテンツのGoogle検索ランキングが大きく上昇。その結果セッション数は前年比300%増という結果に至りました。

また、日々Web運用をする林さんは、CMS導入後「管理・作成ともに非常に運用がしやすくなり驚いた」とその時の変化を率直に語ってくれました。

今後の計画

2018年から段階的に進められているリニューアルでしたが、今やライセンス条件の上限500ページを超えるようになってきましたので、2021年2月にはサイズ無制限のライセンス製品にアップグレードし、前回積み残したコンテンツを順番に移行する予定です。

お勧めのサイトは「友達以上、お医者さん未満」お悩みサイト

ココカラファインでは林さんの前任者時代からコンテンツ・マーケティングに力をいれてきましたがその一例が「あなたのお悩みは?」です。ディレクトリー構造を見直したことで、オーガニック検索による流入が増え、ユーザーのお悩みに応えるコンテンツは、オーガニック検索からのトラフィックの約3割を担っています。

「ココカラクラブ」内にある「あなたのお悩みは?」ページ

このサイトの目指すところは「友達以上お医者さん未満」です。体の問題を抱えて訪問する利用者に探しやすい症状に応じた検索、薬剤師の皆さんからの丁寧なアドバイスが人気です。それぞれの薬剤についても当然のことながら使用上の注意、効能効果など十分な情報がわかります。

丁寧に見ればいくらでも情報がありながら、要約をさらっと見ることもできるたいへん便利なサイトです。CMS導入前からあるコンテンツでしたが、サイトの構造上の問題でアクセス数が思い通りに増えませんでした。CMSを導入後コンテンツの中身が、変わっていないにも関わらず、大幅に訪問者が増えました。良いコンテンツの存在を世に知らしめるリニューアルとなったのです。

稲富のコメント

コロナ禍で外国人旅行者の“爆買い”もなく、店頭での化粧品販売も減ってココカラファインの売り上げにも大きな影響を受けていますが、こうした時期こそじっくりと地力をつける時期。実際にコロナ禍で客数は減っているものの会員売り上げ比率は76.2%と高水準をキープできているのも「あなたのお悩みは?」など人気優良コンテンツを地道に築きあげてきた成果であることは間違いのないところでしょう。

稲富滋(聞き手)

コロナ禍で変わったこと

コロナ禍の影響は、Webサイトのユーザー数に表れています。店舗の既存会員様はもちろん、今までココカラファインのサイトにアクセスしたことがないような方にも使っていただけるようになりました。

新規ユーザーが増えたこともあり、サイトUIについてはご指摘を多くいただきました。課題が浮き彫りになるとともに、本当に使いやすいサイトとは何か、このコロナ禍で改めて考えさせられました。これからは誰もが使いやすいサイト作りを心がけ、さらにお客様にご満足いただけるサイトに変化させていきたいです(ココカラファインヘルスケア 林さん)

稲富のコメント

薬剤師の資格をもち、お客様と向き合う最前線の薬局店舗で9年勤務し、店長まで経験し「事業現場を知り尽くしている」林さんのような方が自ら立候補して、Web部門に異動し、Webマスターをつとめる企業はBtoB、BtoCを問わず、そのサイトは強力になるに違いありません。

異動してきた当時は、WebやIT部門は現場からは想像もできない世界だった、という林さんですが、IT部門の島さんや外部支援パートナーのメンバーズさんやビッグローブさんの力を借りながら、より良いサイト作りをますます進めていってほしいです。皆さんありがとうございました。

用語集
Googleアナリティクス / SNS / アクセス解析 / アップロード / オーガニック検索 / キャンペーン / クラウド / セッション / ディレクトリ / ユーザーテスト / リンク / 訪問 / 訪問者
[Sponsored]
この記事が役に立ったらシェア!
メルマガの登録はこちら Web担当者に役立つ情報をサクッとゲット!

人気記事トップ10(過去7日間)

今日の用語

Python
「Python」(パイソン)は、プログラミング言語の1つ。プログラマのグイド・ヴ ...→用語集へ

インフォメーション

RSSフィード


Web担を応援して支えてくださっている企業さま [各サービス/製品の紹介はこちらから]