トップページのリニューアルを失敗させないために大切した4つのこと

こんにちは、COUNTERWORKSの駒ヶ嶺(@Koma_Studio)です。

前回、データ嫌いのデザイナーがデータを好きになった理由を書いたように弊社のデザイナーはカイゼン施策のデザインだけでなく施策の考案から実装、計測・評価までを一貫して行なってます。

そのようなカイゼンを積み重ねている中、弊社で運営しているSHOPCOUNTERのトップページのリニューアルが1年半かけて完了しました。ぜひ、新しくなったSHOPCOUNTERを見ていただきたいのですが、このリニューアルにより昨年1月との比で離脱率が30%、直帰率が10%ほど減る結果となりました。流出を抑えた分はしっかりとスペースの検索や詳細ページに流れるようになったため、最終的にCV数やCVRへ貢献がされています。

どうしてトップページのリニューアルにここまで時間をかけたのか、どのように変えていったのかを具体例を紹介しながら、リニューアルにあたっての大切なポイントを紹介していきます。

自分と同じようにトップページを変えたいデザイナーの方や、どのようにカイゼンを進めていけば良いのか具体例が欲しい方の参考になれば幸いです。

大切なこと その1. 一気に変えたい気持ちを抑える

多くのデザイナーがトップページのデザインを変えるという話しになった時に一気に変えたい衝動に狩られると思います。少なくとも私はそうでした。

しかし、前任のプロダクトマネージャーから、ガラッと変えてしまうとどの要素がどのような効果をもたらしたのか分からなくなるから、小さくカイゼンしようというアドバイスをもらいます。

このアドバイス内容を少し掘り下げると、何かしらの変更をサービスにかけるとユーザーの行動は少なからず変化が生じて、結果的に数値も変化することになります。それはポジティブなものでもあるし、ネガティブなものかもしれません。しかし、ガラッと変えてしまうと、上の図のように構造や情報設計（コンテンツの追加や削除、文言）を変えたことで変化が生じたのか、それともスタイル（見た目、装飾）の変更で変わったのかが見えづらくなってしまいます。

特にスタートアップの場合は、一つ一つの施策から学びを得ることで不確実性をなくすことも重要になってきます。何となく変更してみて数値が良くなったならまだしも、悪くなった場合は学びもなく元の状態に巻き戻し作業が発生します。これは最悪なケースなので、そうならないために構造変更・削除は1つ・スタイル変更となるべく混ぜないというような進め方を取るようにしました。

大切なこと その2. ページの現状を把握する

進め方を決めるのと並行してGoogle Analytics（以下、GA）を用いたトップページの現状を把握しました。それぞれの導線にどのくらいのユーザーが遷移していて、そのページに遷移した際にどのような行動を取っているのか追えるだけ追っていきました。

実際に調べてみるとスペース検索行為を行うユーザーが多い中で、サービスの説明ページに遷移するユーザーも同じくらいのボリュームがあることに気づきます。しかし、離脱するかトップに戻るケースがほとんど。これはおかしいなと思いサイトを見てみると、下の画像にて丸で囲んだ部分の文言が用いられていることに気づきます。

これはスペースを探したいユーザーからすると勘違いするだろうなということと、実は勘違いではなく何となくここにサービスの説明が記載されているだろうと予測してその導線を踏んでいるのかをまずは明確にしようという話しになりました。そこで以下の画像のように「スペースを探す」を検索ページへの遷移に変更して、隣の導線をサービス説明ページに遷移させるような変更をかけます。

効果計測をした結果、サービス説明ページに遷移するユーザーが少ないと出ます。これにより、SHOPCOUNTERは目的を持ってサイトに訪れているユーザーが多いことが判明します。

大切なこと その3. 誰のための、何のためのページなのか明確にする

先ほど紹介した施策の効果計測中、トップページには訪れるユーザーの分類分けも行なっていました。この時、Web担当者Forumの記事を参考にしたのですが、トップページには4つのユーザーが存在することが分かります。

1. 目的志向ユーザー
2. ふらっと訪問ユーザー
3.  サイト内迷走ユーザー
4. サイト内リターンユーザー

そして、この4つのユーザーがどのような状態なのか・気持ちになっているのかを実際に落とし込み、解像度を上げていきました。以下の画像は実際に考えていたものの一部です。

このように、それぞれのユーザーの状態や気持ちを落とし込んだ後はGAのデータと照らし合わせながら、どのユーザーを優先するか順位付けを行いました。まずはインパクトが大きいところから着手するのが大事ということになり、当時は母数の多い目的志向のユーザーのための施策を打っていくことを決定します。

大切なこと その4. トップページのカイゼンだけやらない

トップページのカイゼンだけを行なっていても結局はCVRもしくはCV数が増えていかなくては意味がありません（ユーザーの課題を解決していればCVRとCV数が増えるはずだよねという考えの元）。

多くのサービスの場合、トップから検索や詳細ページに促し、そこからカートに入れて購入してもらえるようにする必要があるのではないでしょうか？
リニューアルに1年半ほどかかった理由はここにあるのですが、実はトップページ改修だけでなく上の流れをイメージしながら下の図のようにホームから検索のボリュームだけ増やす形を避けて、それぞれのバランスが良い状態を意識して、それぞれのページのカイゼンを順々に着手していきました。

このように購買過程（ファネル）を意識しながらカイゼンしている中で思ったのは、意外と他のページをカイゼンすることで新しく見えてくることや発見があるので、それが新しいトップページのカイゼン施策のアイディアに繋がったりもするんだなということでした。この時、早く変えたいと逸る気持ちからの解放（マスターベーション）を我慢するだけの意味はあるなと思えたので、皆さんもコツコツとカイゼンしてみてはいかがでしょうか。

--

最後に

以上、トップページのリニューアルを失敗させないために大切にしたことを書いていきました。今回、弊社で紹介した指標は離脱率や直帰率だけでしたが、トップページがかっこいいだけでお客さんのモチベやリピーターへと繋がるだけでなく、一緒に働くメンバーのモチベーションもアップするかと思います。少なからず自分はそうでした。

（実際、多少のえいやも必要ですが）上で書いたような進め方を参考にして、トップページを変えたいなと思う方は進めてみてはいかがでしょうか。

もし、こんな記事を書いて欲しい。紹介して欲しいなどがあれば、ツイッターで呟いたり、コメントいただければと思います。それでは👋