• はてなブックマーク
  • RSS
  • Line

デザインの現場から届ける実践的な手法と思考プロセス

2026.04.27 Mon

あなたが作るそのサイト。もし人間だったら友達になれそう?

そのデザインに「魂」はあるか? サービスに『人格』を宿すデザインペルソナの作り方

Text by 大西まどか

UXデザイン界隈の私たちは、長らく「ユーザーペルソナ」をデザインのよりどころとしてきました。ターゲットの悩みや行動を丁寧に分析し、ユーザーに寄り添う。その姿勢が重要であることは揺るぎません。

一方で「サイト(サービス)自身」はどうでしょう。サービスらしさを演出するために、ブランドイメージを反映した配色やフォント、画像などが使われます。一見すると、ユーザーを意識し、適切に訴えかけるための手法が用いられていそうですが、いざ触ってみると、ブランドのトーンとはかけ離れた機械的で「正しい」だけの文章や、どうしたらいいのかよく分からないエラー番号が表示されることもあります。ブランドイメージをサービスの隅々まで行き渡らせるのは、実のところ至難の業なのです。

サービスを単に「使う対象」から、心地よく「対話する相手」へと変えるために。 本記事では、サービスの人格(デザインペルソナ)を定義し、デザインに一貫した意志を持たせるアプローチをご紹介します。

なぜ「感情」をデザインするのか?

▶︎ 感情は「使い勝手」の先にあるもの
Designing for Emotion」の著者でUXデザイナーのアーロン・ウォルター(Aaron Walter)は、マズローの自己実現理論になぞらえて、UXにも階層があると説きました。一番下が「機能(動くこと)」。次に来るのが「信頼(壊れないこと)」で、その次が「使いやすさ」です。そして、最上位に来るのが「心地よさ」、つまり感情的なつながりです。

Aaron WalterのEmotional Designにおける欲求段階説

使いやすいだけのツールは、代替品が現れればあっさり乗り換えられてしまいます。ですが「好き」になったサービスから離れるのは、友人と絶交するのと同じくらい難しいものです。そこでサービスを擬人化して考えることで、ユーザーとサービスの接点を「誰かとの対話」と捉え直すことができます。対話の中で生まれる感情に目を向けることこそが、サービスに愛着を持ち続けてもらうための鍵です。

▶︎ 対比で考える「デザインペルソナ」の役割
では、具体的にどのような「人格」を考えてみるとよいでしょうか。2つの異なるジャンルのアプリを例に比較してみましょう。

例1)学習・習慣化アプリ:並走してくれる「情熱的なコーチ」
ユーザーが挫折しそうなとき、このアプリはどんな声をかけるべきでしょうか?

 ●デザインペルソナ:常にポジティブで、少しお節介なほど応援してくれるパートナー
 ●デザインへの反映:
     ○色・形:エネルギーを感じる暖色系、角の丸いフレンドリーな造形
     ○インタラクション:目標達成時に派手な紙吹雪が舞うような、過剰なまでの祝福
     ○言葉選び:「完了しました」ではなく「すごい!この調子で明日もやろう!」

例2)金融・資産管理アプリ:物静かだが「誠実な執事」
お金というデリケートなものを扱う場所では、過度なフレンドリーさは「軽薄さ」に映りやすく、不信感を招きます。

 ●デザインペルソナ:余計なことは言わないが、必要なときに的確なデータを差し出す
            プロフェッショナル
 ●デザインへの反映:
     ○色・形:信頼と静謐を感じさせるネイビーやグレー、直線を活かし整然とした
        レイアウト
     ○インタラクション:無駄な動きを削ぎ落とし、レスポンスの速さ(=有能さ)を
              重視する
     ○言葉選び:「送金完了!」ではなく「送金の手続きが正常に完了いたしました」

▶︎ どちらも「正しい」UXである
重要なのは、どちらが優れているかではありません。「そのサービスが提供する体験に、その人格が合っているか」が肝心です。

例えば、達成感たっぷりのときに、横にいるコーチに「本日の課題完了」と冷たくあしらわれたら、気持ちが萎えてしまうかもしれません。信頼している執事に「イェーイ!送金できたよ!」とハイタッチを求められたら「コイツに任せて大丈夫か・・・?」と不安になるでしょう。デザインペルソナに一貫性がないと、この「人格の不一致」がサイトの至る所で起きてしまう可能性があります。

ボタンの角の丸み、余白の広さ、メッセージの言葉遣いや語尾といった、そのすべてがサービスの人格を形作ります。デザイナーは、ただピクセルを操っているのではありません。それらのふるまいを通して、ユーザーとサービスの関係性を編んでいるのです。

どちらも場面によって心地よい相手になり得ます(人によって好みはあるでしょうが)

明日からできる「デザインペルソナ」の構築ワークショップ

デザイナーがユーザーとシステムの関係性を編むキーパーソンであることは明らかです。しかし、デザインペルソナを作るときには、デザイナー1人で机に向かって頭をひねる必要はありません。むしろ、エンジニア、ディレクター、ライターなど、プロジェクトに関わるメンバーを集めて、話しながら「キャラデザ」を楽しんでください。

では早速、付箋とペンを用意しましょう。所要時間は1〜2時間程度です。

▶︎ステップ1:「もしこのサービスが人間だったら?」を付箋に書き出す
まずは自由にブレインストーミング。「明るい」「几帳面」「ちょっとオタク気質」「落ち着いている」など、ターゲットユーザーではなく「サービス自身」がどんな性格か、チームで思いつく形容詞を付箋にどんどん書き出していきます。

似たものをグルーピングし、コアとなる性格を絞り込みます。多すぎると後から画面要素に落とし込む際に迷ってしまうので、3〜5つ程度がよいでしょう。このとき、「避けたい性格(例:しつこい、冷たい)」も1つだけ決めておくと、次のステップをスムーズに進行できます。

▶︎ステップ2:「〇〇だけど、××ではない」で境界線を引く
ここが一番のポイントかもしれません。性格が決まっても、人によって解釈のブレが生じてしまいます。例えば「親しみやすい」という言葉から、ある人は「タメ口」を連想し、別の人は「柔和なほほ笑み」を連想するかもしれません。 これを防ぐために、「We are..., but we are not...」の構文で境界線を明確にします。

 ● 例1:「親しみやすい」が、「馴れ馴れしく」はない
 ● 例2:「専門的」だが、「高圧的・お堅く」はない
 ● 例3:「ユーモアがある」が、「ふざけて」はいない

このリストがあるだけで、後のデザインレビューやコピーライティングでの「なんか違うなあ」という違和感が劇的に減ります。

▶︎ステップ3:ペルソナシートをつくる
ステップ2までで決めた性格と境界線をベースに、ペルソナを1枚のシートにまとめます。プロフィール帳や、履歴書のようなイメージで作ってみてください。

 ●名前と顔写真: 実在の俳優やフリー素材でもOK。視覚的なイメージを固定。
         人間でなくてもよい
 ●ユーザーとの関係性: ステップ2までの性格をまとめて一言で
            (例:「頼れる先輩」「熱血コーチ」「有能な秘書」など)
 ●性格: 性格のキーワードや、境界線を転記する
 ●口癖(ボイス&トーン): その人が言いそうなセリフを書いておく。
             「お疲れ様!今日も頑張ろう!」「本日のレポートを完了
             いたしました」など。方言を使う、横文字をよく使うと
             いった特徴があれば、併せて書いておくとイメージのブレを
             防げる
 ●ビジュアルの特徴:ボタンの丸みや色のイメージ、フォントなど、
            ペルソナを表すための視覚的な特徴を置いておく

話し合ったデザインペルソナの特徴を、1枚のシートにまとめましょう

▶︎ステップ4:「マイクロコピー」でテストする
最後に、完成したペルソナが本当に機能するか試してみましょう。特定の場面でのサービスのふるまいを、ペルソナシートの内容に沿って考えてみます。

一番分かりやすいのは「ユーザーがエラーを起こしたとき(404ページや入力エラーなど)」です。 人間関係と同じで、トラブルが起きたときにこそ、その人の本当の性格が出ます。 「このペルソナなら、ユーザーにどう声をかけ、どのような助け舟を出すだろうか?」と、チームで考えてみると良いでしょう。

もしスムーズに言葉が出てこなければ、ペルソナの解像度がまだ低い証拠です。前のステップに戻って、もう一度考えてみましょう。

デザインとコードに「体温」を持たせる

デザインペルソナができたら、チームの全員がすぐに参照できるところに置いておくのがオススメです。悲しいですが、デザインペルソナもユーザーペルソナも、あるあるなのは「作って終わり」になることです。使われなければ陳腐化してしまいます。

デザインペルソナの最大のメリットは、職種間のコミュニケーションコストを下げられることにあります。デザインペルソナ・ユーザーペルソナをセットにして、プロジェクトにおける意思決定ツールとして現場で使い倒しましょう。

「私の好み」から「ペルソナの性格」へ 
デザインレビューで「この色は派手すぎる気がする」「もっとポップにして」といった主観的な意見がぶつかることはないでしょうか?  ペルソナがあれば「誠実な執事の彼なら、このビビッドな配色の服は選ばないよね」と判断できます。アニメーションひとつとっても、「おっとりした性格」ならゆっくりと、「キビキビした性格」なら素早く動かす、といった明確な根拠が生まれます。

マイクロコピーに「声」を宿す 
ボタンのラベル、入力フォームのプレースホルダー、そして退会画面のメッセージなど、これらは全てペルソナがユーザーに直接語りかける「声」です。 例えば、メルマガの登録完了画面ですが、「登録が完了しました」と事実だけを伝えるのか、「これからよろしくね!」とハイタッチするような温度感にするのか。ペルソナの性格に合わせて言葉を選ぶことで、サイト全体の体験がよりリアルに感じられ、ユーザーとシステムの対話を育むことができます。

チームを繋ぐ共通言語に
 ペルソナシートをエンジニアやライターにも共有し「情熱的なコーチのような振る舞いにしたい」と合意しておけば、職能の違うメンバーそれぞれの視点からの自発的な提案も生まれやすくなるかもしれません。

UXとは、画面越しの「対話」である

ユーザー体験(UX)の設計とは、単に情報を整理し、使いやすい導線を引くことだけではありません。画面という境界線を越えて、ユーザーとシステムが人間らしい「対話」をするための土台づくりです。

「使い勝手が良い」は、今やどのサービスも当たり前に提供できる時代。だからこそ、その先にある「このサービスを使うとほっこりする」「なんだかウマが合うな」という感情的なつながりこそが、代替不可能な価値になります。

あなたが次にサイトやサービスを設計するとき、ぜひ一度、マウスから手を離して、チームの皆と「私たちの作るサービスは、どんな人なんだろう?」と語り合ってみてください。その時間が、無機質なピクセルの集まりに魂を吹き込む第一歩となるはずです。

▶︎さらに深く学びたい方へ
今回のコラムで「感情をデザインする」というテーマに興味を持っていただいた方には、Aaron Walter著の『Designing for Emotion』を読むことを強くおすすめします! なぜ感情がデザインにおいて重要なのかという心理学的な背景から、Mailchimpをはじめとする有名サービスの具体的な成功事例、そして「人間味あふれるデザイン」を作るための手法がたっぷりと詰まっています。英語の書籍ですが、本自体がとてもユーモラスで読みやすいので、ぜひ手に取ってみてください。

「絶対に日本語しか読まないぞ!」という固い決意をお持ちの方は、少し学術的な要素は強くなりますが、ドン・ノーマンの古典的名著『エモーショナル・デザイン―微笑を誘うモノたちのために』なども参考になります。

大西まどか
フェンリル株式会社 デザイン部 UXコンサルタント
博士(生涯人間科学)。人間中心設計(HCD)専門家。学術的な知見に基づいたサービスの開発や研究、調査コンサルティング業務に従事。2021年、フェンリル株式会社に参画。サービスの体験価値を最大化すべくユーザーリサーチを行っている。ユーザーの心理や行動に寄り添い、本質的な課題の発見に努める
読込中...

Follow us!

SNSで最新情報をCheck!

Photoshop、Ilustratorなどのアプリの
使いこなし技や、HTML、CSSの入門から応用まで!
現役デザイナーはもちろん、デザイナーを目指す人、
デザインをしなくてはならない人にも役に立つ
最新情報をいち早くお届け!

  • Instagram