![](https://inspire-design.net/blog/wp-content/uploads/2020/12/fadslkjh-150x150.jpg)
商品やサービスの料金表を見やすくて、かつお客様に選んでもらいやすいデザインにしたいのですが・・
今回はこんな悩みにお答えしていきます。
松竹梅で表現させる料金表
商売的、営業的に解説していくと、料金をお客様に提示する際、「松竹梅」と優劣をつけた3つの料金を横に並べるといった見せ方があります。
下記は私たちが提供しているサービスの料金表ですが、3つのプランを価格順に並べたものとなり、すなわちこれが松竹梅の並びになっているというわけです。
![](https://inspire-design.net/blog/wp-content/uploads/2022/06/9ifasiy9.png)
お客様の心理
料金を松竹梅で見せる裏側は、お客さまの心理を考えた設計となっています。
リアルな営業の場で、こういった料金表を提示する際、一番安いプランで良いと思っているが、安いプランを選ぶのはちょっと恥ずかしい・・とはいえ一番高いプランはそもそも選ぶ気はない。なら真ん中のプランを選ぼう
そんな心理を考えたのがこの松竹梅並びの料金表なのです。(詳しく知りたい方は、「松竹梅の法則」などで検索してみてください。)
料金を見せる順番
料金を見せる順番にはギミックがあります。
これはケースバイケースではあるのですが、一般的にリアルの営業の場で、お客様に料金表を見せる時、まず左上に目線が行きますので、一番高い料金を左上に表示させるのはNGです。(つまり松を左に持ってくるのはNG)
下記は先ほどの料金表の並びを変えたものですが、まずはじめにプレミアムプランの¥180,000の料金が目に付くかと思います。
![](https://inspire-design.net/blog/wp-content/uploads/2022/06/9kjasdf9.png)
![](https://inspire-design.net/blog/wp-content/uploads/2020/11/fdsakhj-150x150.jpg)
「うぁ・・高っ」「これじゃ話にならないな・・」
はなからこんな風に思われてしまうと、その後の交渉どころではなくなってしまいます。(私自身が失敗したことです・・苦笑)
選んで欲しいプランを目立たせる
先ほど真ん中は心理的に選んでもらいやすいという話をしましたが、更に選んでもらいやすくさせるためにデザインを施します。
![](https://inspire-design.net/blog/wp-content/uploads/2022/06/ikjhsdfa.png)
目立たせていないバージョンも貼り付けておきますので、比較してみてください。
![](https://inspire-design.net/blog/wp-content/uploads/2022/06/9ifasiy9.png)
いかがですか?
ほんの一工夫で選んでもらいたいプランが目立っていることがお分かりいただけると思います。
ウェブで見つけた料金表サンプル
参考までにウェブで料金表を探してみたので、デザインや見せ方など参考にしてみてください。
選んで欲しいプランを目立たせている
リサーチしていて感じた傾向としては、月額の費用がさほど高くないサブスクリプション系のWebサービスなどは、高い料金を左側に持ってきています。
それとは逆に、料金が高いサービス(スクショ4枚目のプログラミングスクール)は、先ほど解説したような左側に安い料金を配置しています。
料金表の下が比較表となっており、目がいく左側で「たくさんの機能が利用できますよ」というのをアピールしているのだと思います。
![](https://inspire-design.net/blog/wp-content/uploads/2022/06/pricejimdo-1024x365.png)
![](https://inspire-design.net/blog/wp-content/uploads/2022/06/pricewix-1024x713.jpg)
![](https://inspire-design.net/blog/wp-content/uploads/2022/06/pricekintone.png)
![](https://inspire-design.net/blog/wp-content/uploads/2022/06/pricesejuku.png)
段階的にプランを引き上げるような見せ方をしている
「まずは無料で利用してもらって、良ければステップアップしてね」といった、フリーミアム戦略を取っているサービスに関しては、ステップ式に料金表を見せていました。
![](https://inspire-design.net/blog/wp-content/uploads/2022/06/pricelack-1024x582.png)
![](https://inspire-design.net/blog/wp-content/uploads/2022/06/feasdkj.jpg)
![](https://inspire-design.net/blog/wp-content/uploads/2022/06/pricezoom-1024x490.png)