こんにちは、ユーザーファースト推進室の坂本（@kanako29）です。

昨年12月に新規事業サービス「クックパッドおいしい健康」のトンマナをリニューアルしました。クックパッドに入社してから初めての大きなトンマナ変更を担当したので、その時に気をつけたことや考えたことなどをまとめてみました。

なぜ変えるのか？

今回のトンマナ変更の理由として、以下がありました。

• ターゲットの拡大
• メッセージの伝達の明確化

それぞれについて、詳しく説明していきます。

ターゲットの拡大について

これまでのターゲットは、「30代後半〜40代の病気の夫を持つ女性」だったのですが、新たに女性の悩みを解決するコンテンツの追加により、肌荒れや体の不調に悩んでいる20代〜30代前半の女性もターゲットになりました。

以前のトンマナだと新たにターゲットとなった女性たちをカバーできないので、新しいターゲットにも使ってもらえるよう変更する必要がありました。そのイメージとして、「可愛らしさ」、「親しみやすさ」が良いのではないかと考えました。それと同時に、サービスとして毎日使っても疲れないように「シンプルさ」も必要な要素としました。

「可愛らしさ」と「親しみやすさ」について

現在のサービスは病気の色が強く、普段の健康を意識する女性が訪問したときに違和感を覚えるのではないか、またそれにより使ってもらいづらくなるのではないか、という懸念がありました。それを少しでも和らげて、使ってみたい、という気持ちを持ってもらうために、「可愛らしさ」と「親しみやすさ」のイメージを選択しました。

これらのイメージはパッと見たときの印象になるので、20〜40代の社内メンバーにデザインを見てもらって感想をもらいました。概ね「可愛くて良い」、「やわらかくて良い」という良好な反応だったのですが、「グレーの色が渋くて固い」などの感想をもらうこともあり、その場合はグレーをベージュに近づけるなどの修正を都度行いました。

色、フォント、形状などで「可愛らしさ」、「親しみやすさ」を表現します。 （これらの要素は、ターゲットの方が普段読んでいると思われる雑誌や、使用している生活用品などからヒントを得ます）

「シンプルさ」について

「シンプルさ」は、過度な装飾が判断の邪魔をしていないか、何度も使っているうちに色がきついと感じたりしないか、などに留意しました。

これがきちんと達成できているかは実際に使ってみてもらわないとわからないので、公開前、社内のメンバーに1週間程使ってもらって判断してもらいました。サイトを開いてから、レシピ検索や献立作成などのコア機能のタスクを行ってもらいます。

そして1週間後にレビューのミーティングを開き、気づいた点などを言ってもらいます。例えばこの時出てきた内容として、「濃い色の帯が目立ちすぎる」、「色が少しきついのではないか」などの声がありました。これは紐解くと、他の必要な情報が見えづらくなる、目に痛い、ということなのだと思い、色の彩度を下げて白に近づけたり、濃い色の面積を少なくするようにしました。

修正したものは再度使って問題がないか確かめてもらい、都度改善を行いました。

メッセージの伝達について

今回サービスが伝えたいメッセージとして、「夫の病気や、自信の不調や肌の悩みなどでネガティブになりがちな気持ちの女性に、少しでも明るい気持ちで使って欲しい」というのがありました。トンマナを明るい、ポジティブなイメージにすることで、ユーザーのタスクである献立作成に取り組みやすくなってもらえるのではないかと考えました。

これまではそのメッセージの伝達がはっきりとしていない、また明るいイメージが足りなかったため、今回の変更でより伝わるようにしました。

具体的には、明るいイメージを表現するには色による影響が大きいと考え、白をベースとして差し色で明度と彩度の高めの色を複数使用することにしました。

変更後の数値の変化

このトンマナが成功だったかは、リニューアル前の1ヶ月と、リニューアル後の1ヶ月（年末〜お正月期間は数値の変動が激しくなるので、今回は、1月6日から2月6日までとしました）の、ユーザーのメインタスクを反映する献立確定数・献立帳へのレシピ追加数で判断しました。

結果は、献立確定数が約1.35倍の増加、献立帳へのレシピ追加数が約1.2倍の増加となりました。これにより、今回のトンマナ変更は概ね成功だったと言えるのではないでしょうか。

まとめ

クックパッドでは、Webサービスのトンマナ変更をこのような考え方、フローで行っています。公開前の社内メンバーのフィードバックという定性的な面と、公開後の実際の数値という定量的な面でみて、品質の向上に努め、本当にユーザーの役に立っているかを判断しています。

このように定性的・定量的な面でみれるのは、Webサービス、もしくはクックパッドならではだと思います。トンマナ設計に携わる方のお役に立てれば幸いです。