お客様の声 · お客様の声

パステル配色の柔らかいお客様の声セクション

プレビュー

vibe.itlibra.com/preview/soft-testimonial/

概要

推薦の声(テスティモニアル)は、本来「実績を並べる」セクションです。しかしヘルスケア、育児、美容といった領域では、見込み客が抱えているのは購買意欲ではなく不安です。そこで求められるのは、実績の誇示ではなく「安心して大丈夫」という空気そのもの。ソフトなテスティモニアルは、その空気を視覚で設計します。

「読みながら呼吸が整う」設計

通常のテスティモニアルは、数字とロゴと顔写真で「これだけ多くの人が選んだ」と圧をかけます。ソフト系は逆のアプローチを取ります。大きな角丸、影のない柔らかな浮遊感、丸みのある書体、抑えた彩度——これらが組み合わさると、セクションを見るだけで緊張がほどける。証言の内容を読む前に、視覚体験そのものが「ここは安全な場所だ」と伝えるのです。不安を抱えた見込み客にとって、この「読みながら呼吸が整う」感覚こそが成約への第一歩になります。

信頼は「静けさ」からも生まれる

説得力は、強い主張だけが作るものではありません。長い証言を一字一句載せるより、1〜2文に削ぎ落とした言葉のほうが、かえって誠実に響くことがあります。情報を盛らず、余白とトーンで「落ち着いて検討してください」という姿勢を示す——この静けさ自体が、繊細な領域では信頼の証になります。

仕上げの判断軸

角丸は16〜24pxと大きめに取り、シャープな矩形が生む硬さを避けること。奥行きはドロップシャドウではなく、パステルのぼかし円(ambient blur)で柔らかく表現します。書体はManropeやPlus Jakarta Sans、丸ゴシックなど丸みのあるものを選択。引用本文は短く保ち、長い体験談は別ページへ逃がします。逆に、B2Bやエンタープライズのように「実績の厚み」が決め手になる領域には、この柔らかさは不向きです。

使いどころ

  • ヘルスケア・ウェルネス・育児・美容のLP
  • 心理的安心感を強調したいB2C
  • ターゲットが女性中心のサービス
  • 真面目すぎる印象を和らげたい医療・教育

このデザインの分類

カテゴリ
お客様の声
スタイル
ソフト / エレガント / ウォーム / プレイフル

背景と狙いどころ

AIへの指示文

ヘルスケア / ウェルネス系サービスのランディングページ向けに、柔らかい雰囲気のお客様の声セクションを作ってください。

要件:
- 配色: ベース #fdf7f2 + パステル peach #ffd7c4 / mint #c5ecd5 / lavender #ddd4f3 を使い分け。
- レイアウト: 大型カードを 1 + 中型カード 2 個の非対称グリッド(左に大きいの 1、右に小さいの 2 縦積み)。
- 各カードは角丸 24px、薄いパステル背景、影なし。
- 大型カードには大きなセリフ書体の引用符 "❝"(accent カラー)と、引用本文(21pxくらい)、下に丸い顔写真 + 名前 + 所属。
- 中型カードは引用本文小さめ + アバター + 名前のみ。
- 全体上部に手書き風アイコン or 単色イラストを少しだけ。
- 背景に大きな blur のパステル円(ambient glow)を 2-3 個重ねる。
- 統計バー(98% 満足度 / 12,000 名 / 4.9 ★)を下部に並べる。
- フォント: 見出しは少し丸めの sans(Manrope または Plus Jakarta)、本文は Inter / Noto Sans JP。
- フルレスポンシブ。

バリエーション

動画証言版

大型カードを動画プレースホルダー(aspect-ratio 4/3 + 中央プレイボタン)に差し替え。
アバターは動画下に名前・職業と並べて表示。

ロゴウォール併設版

セクション末尾に "Trusted by" + 6-8 個の導入ブランドロゴ(モノクロ + 透過)を 1 行で追加。

よくある質問

パステル配色は SEO や AdSense に影響する?
影響しません。AdSense はテキストコンテンツとサイト運営履歴で評価されます。視認性さえ確保すれば配色は自由です。
何件のレビューを並べると効果的?
最低3件。多いほど良いという訳ではなく、3-6件が記憶に残ります。1ページに10件以上並べる場合は「すべての声を見る」リンクを別ページに送る方が読まれます。
顔写真がないと信頼性は下がる?
下がります。ただし架空の顔写真や AI 生成顔は逆効果。実名+所属だけでも誠実さは伝わります。本人の許可が取れた顔写真を必ず使ってください。