「メルマガのデザインがブランドイメージに合ってないかも…」
「もっとプロっぽいデザインにしたいけれど、センスに自信がない」
そんなふうに悩んでいませんか？
実はその悩み、トンマナというルールを決めるだけで解決できるかもしれません！
この記事では、デザイン初心者の方に向けて、メルマガにおけるトンマナの基本から具体的な設定手順までを徹底解説します！
配色やフォントの選び方はもちろん、サンリオや無印良品といった有名企業の成功事例もご紹介します！
読み終わる頃には、自社にぴったりのデザインルールを作る準備が整っているはずです💪
ぜひ最後までご覧ください！
コンビーズメール
テンプレートと操作性に優れ、
AIが配信をサポート
コンビーズメールプラス
htmlエディタで直感的！
ちゃんと届いて月5,500円〜！
コンビーズメールライト
初心者にもやさしい
シンプル機能と安心の配信
トンマナとは？
トンマナとは、広告やマーケティングの現場で使われるトーン＆マナーの略称です。
メルマガ作成やWeb制作においては世界観を統一するためのデザインルールと捉えると理解しやすくなります。
具体的には「トーン」が色使い・フォント・画像の雰囲気を指し「マナー」が言葉遣い・文体・レイアウトなどの「作法・ルール」を指します。
たとえば、信頼性を重視する企業のメルマガで、毎回ちぐはぐな配色が使われたり、急に若者言葉が混ざったりすると、読者は違和感を覚えます。
デザインのセンスや経験に自信がなくても、心配はいりません！
次の章ではトンマナのメリットを紹介します！
トンマナを決めるメリット！
トンマナというルールを決めることは、デザインの良し悪しだけでなく、日々の業務の悩みを解消する大きな助けになります。
ここでは、3つのメリットについて、わかりやすく解説していきます！
デザインのクオリティがアップする！
トンマナを決めておくだけで、メルマガのデザインが洗練され、クオリティがぐっと上がります。
実は、デザインが「なんだか素人っぽい」「イマイチあか抜けない」と見えてしまう一番の原因は、その時々の気分で色や配置を変えてしまうことによるバラつきにあります。
そこで「使う色はこれ」「レイアウトはこれ」といったデザインの基準を決めてしまいます。
すると、毎回ゼロからデザインを考える必要がなくなり、そのルールに沿って作るだけで安定したクオリティのメルマガが完成します。
センスに頼るのではなく、ルールを守ることで統一感が生まれ、読み手にとっても非常に読みやすい、きれいなメルマガに仕上がります。
読者の記憶に残りやすい！
トンマナを揃えることは、読者との信頼関係を築くうえでも欠かせません。
統一されたイメージを読者に与えられるため、受け手側にコンテンツのイメージが印象づけられ、記憶にも残りやすくなるからです。
毎回同じロゴの位置、決まった色使い、変わらない語り口調で届くことで、読者はメールを開いた瞬間に「あ、いつものあの会社からの情報だ」と直感的に分かります。
この積み重ねが「この会社といえばこの雰囲気」というブランドの印象として定着し、安心感や親しみやすさにつながっていきます。
逆にここがブレてしまうと、読者に会社のイメージが付きにくいです。
属人化せず作業効率化につながる！
自分一人ではなく、チームで仕事をしたり、将来的に誰かに業務を引き継いだりする場面を想像してみてください。
もし、トンマナを決めておかなければ、担当者以外がメルマガを制作するときに、一貫性がなくなってしまい修正などにも手間がかかってしまいます。
明確な基準がないと、どうしても作成する人それぞれの個人の好みや感覚が反映されてしまうからです。
その結果、上司やチームメンバーから「なんとなくイメージと違う」といった曖昧な指摘を受けてしまい、どこをどう直せばいいのか分からず、何度もやり直しが発生してしまうかも…💦
しかし、事前にしっかりとしたルールがあれば、それが共通の判断基準になります。
担当者が交代したり、他のメンバーが代わりに制作したりする場面でも、特定の人の感覚に頼る属人化を防ぐことができます。
誰でも迷わず同じクオリティで作れる環境が整っていれば、作業がスムーズに進み、結果として業務の効率化にもつながります！
トンマナ設定の手順
いい感じのデザインにするために、いきなり色やフォントを選び始めていませんか？
実は、デザインに入る前に「誰に」「何を」伝えるかをはっきりさせておくことがとても大切です。
ここでは、迷わずにトンマナを決めるための手順を解説します！
1：ペルソナ設定
ペルソナとは「自社の商品やサービスを使ってくれる、具体的なたった一人の顧客像」のことです。
そして、この人物像を決めることをペルソナ設定と呼びます。
これを作っておくと、作り手の都合ではなく「お客様が今困っていることは何か？」という視点で考えやすくなるので、とても重要な工程です。
ペルソナを作るときは、年齢や職業といった基本情報だけでなく、性格やプライベートな悩みまで深く掘り下げていきます。
アンケートやインタビュー、SNSの口コミなどを参考にして、顧客に実在しそうな人物像を作り上げるのがポイントです。
設定する項目に決まりはありませんが、一般的には氏名や年齢などの基本情報に加え、家族構成、職業や年収、趣味、大切にしている価値観などを書き出します。
| ＜ペルソナの項目例＞ 基本情報（氏名、年齢、性別、居住地など） 家族構成・人間関係 職業・業種・役職・年収 趣味、関心事 価値観・目標 悩み・叶えたい未来 情報収集方法 |
中でも特に大切なのが悩みと叶えたい未来を決めること。
ここがはっきりすると、どんな言葉やデザインが響くのかが見えてきます。
イメージしやすいように、一人のペルソナ例を挙げてみます。
例）
| 項目 | 設定内容 |
| 名前・写真 | 佐藤 優子（サトウ ユウコ） |
| 基本属性 | 32歳女性、都内IT企業勤務、既婚（夫と二人暮らし）、世帯年収900万円 |
| 性格・価値観 | 真面目で仕事熱心だが、プライベートも大事にしたい。「丁寧な暮らし」に憧れるが、現実は忙しくてできていないことに罪悪感がある。 |
| 悩み（Pain） | 残業で帰宅が21時を過ぎる。夕食がコンビニ弁当やUber Eatsばかりで、健康面や肌荒れが気になっている。自炊したいが気力がない。 |
| 望む未来（Gain） | 忙しくても「ちゃんとした食事」をして、体を労っている自分でありたい。週末はゆっくり過ごしたい。 |
| 情報源 | Instagramで「#時短レシピ」「#丁寧な暮らし」を検索。移動中にニュースアプリを見る。 |
このように、ひとりの人物が目の前に浮かぶくらい具体的に決めておくことで、チーム全員で共通のイメージを持つことができます。
2：コンセプト設定
ペルソナが決まったら、次は「そのコンテンツを通して誰に何を伝えたいか」というコンセプト設定に進みます。
まずは、自社の商品やサービスの特徴を言葉にして、そこからコンセプトを分解していきましょう。
わかりやすくイメージするために、20代から30代のビジネスパーソンに向けた英語学習アプリを例に考えてみます。
このアプリのコンセプトが「最短距離で、世界と戦える武器を。忙しい毎日の隙間時間を最大化する、無駄のないスマートな学習ツール」だとします。
まずはここからキーワードを抜き出します。
「最短距離・無駄がない」「世界と戦える武器」「スマートな学習」といった言葉が見つかりますね。
次に、そのキーワードからユーザーがどんな印象を受けるかを想像してみます。
| 「最短距離・無駄がない」 →「スピード感」「機能的」「シンプル」「ミニマル」 「世界と戦える武器」 →「自信」「強さ」「信頼感」「プロフェッショナル」 「スマートな学習」 →「知的（インテリジェンス）」「先進的（イノベーティブ）」「洗練」「クール」 |
キーワードが出揃ったら、優先順位をつけていきます。
「今回は機能的で知的なイメージを強く出そう」「親しみやすさや賑やかな感じは優先順位を下げよう」といった具合です。
ここまで決めてようやく、具体的な色やフォントを選ぶ準備が整います。
この手順を飛ばしてしまうと、なんとなくの雰囲気で決めてしまい、結果が出ないトンマナになってしまう危険性があるので気をつけてくださいね。
トンマナのポイント
ここでは、特に重要な「配色」「形」「余白」「フォント」の4つのポイントについて、具体的な決め方を解説します。
これらを押さえるだけで、メルマガの印象は劇的に変わります。
配色
配色を決めるときは、会社のロゴやWebサイトで使われている「ブランドカラー」を活用するのがおすすめです。
たとえば「この会社といえば青色」といったイメージが定着していれば、メルマガを開いた瞬間に誰からの連絡かを認識してもらいやすくなります。
たくさんの色を使いたくなるかもしれませんが、使う色を多くしすぎると一貫性がなくなり、ごちゃごちゃとした印象を与えてしまいます。
メインとなる色、背景色、強調したい部分の色など、目安として2〜3色に絞りましょう。
色数を絞ることで、まとまりのあるプロらしいデザインになります。
また、メルマガで伝えたいコンセプトや目的に合わせて、色の持つ心理効果を利用するのも効果的です。
先ほど決めたコンセプトと合うイメージの色を見つけてみてください！
| ・赤：エネルギー、情熱、緊急性。購買意欲を高め食欲を刺激。セールや食品ロゴに多用。 ・青：信頼、冷静、安心感。涼しげでクール。金融・IT系ブランドに多い。 ・黄：幸福、エネルギー、創造性。注目を集め警告にも使用。過度な使用は不安感を誘発。 ・緑：自然、健康、安定。環境・健康志向ブランドやSDGs関連で使用。目に優しくリラックス効果も。 ・オレンジ：活力、興奮、親しみやすさ。フレンドリーな印象で行動を促進。 ・紫：高貴、創造性、神秘。高級感やクリエイティブな分野で使用。 ・黒：洗練、力、エレガンス。高級ブランドに採用。 ・白：純粋、清潔さ。 |
メルマガの配色については以下の記事で詳しく解説しています！
形
デザインにおける「形」というと少しわかりにくいかもしれませんが、具体的にはメルマガ内で使用するボタンや画像のフレーム（枠）の角の処理のことです！
これらを「角ばった四角形」にするか「角を丸くした四角形（角丸）」にするか、どちらかに統一しましょう。
角丸のボタンやフレームは、柔らかく優しい雰囲気、親しみやすい印象を読者に与えます。
一方で、角ばった形は、シャープで洗練された雰囲気、真面目で信頼感のある印象を与えます。
角はなかなか注目しない箇所ですが、意外とメルマガ全体のイメージを左右します。
たとえば、親しみやすさを売りにしているブランドなのに、すべてのパーツが角ばっていると、少し堅苦しい印象になってしまうかもしれません。
逆に、信頼性を重視するBtoBのメルマガで、丸みの強いポップなデザインを多用すると、軽すぎる印象になる可能性があります。
自社のブランドイメージに合わせて、どちらの形を採用するかルールを決めておくと、デザインに迷いがなくなります。
余白
デザインにおいて「余白」は、単なる隙間ではなく、情報を読みやすく整理するための重要な要素です！
余白が適切に取られていないと、文字が詰まって読みづらくなり、読者がストレスを感じて離脱してしまう原因になります。
具体的にどこを「余白」として意識すべきか、以下の4つのポイントを確認してみましょう。
| ①コンテンツの外枠（左右）の余白 スマホやPCの画面の端から、文字や画像までの距離です。 ②セクション（話題）ごとの間の余白 「見出し」と「本文」の間や、「話題A」と「話題B」の間の縦の距離です。 ③文章の行間 行と行の間の隙間です。 ④ボタン周りの余白 「詳しくはこちら」などのボタンやリンクの周りのスペースです。 |
フォント
文字の形である「フォント」もメルマガの雰囲気を決める大きな要素です！
フォントは「明朝体は高級感や繊細さがある」「太ゴシック体は元気でインパクトがある」など、種類によって与える印象が全く異なります。
そのため、なんとなく選ぶのではなく、伝えたいブランドイメージに合うフォントを選びましょう。
また、フォントの種類だけでなく、サイズや行間のルールも統一しましょう。
見出しと本文のフォントサイズに差をつけたり、行間や字間を揃えたりすると、さらにプロっぽいデザインになります。
以下の記事でフォントの選び方について詳しく解説しています！
| ☆コラム：文章のトンマナも抑えてみるとさらにクオリティアップ⇧☆ デザインだけでなく、文章の書き方にもルールを設けると、より統一感が生まれます。 特に気をつけたいのが英数字の表記です。 たとえば「ひとり」「一人」「1人」など、同じ意味の言葉なのに異なる表記が混在していると、読み手に違和感を与え、統一感が失われるので注意が必要です。 ・英数字は「半角」にするか「全角」にするか ・日付は「2024/01/01」か「2024年1月1日」か など、細かい部分ですがルールを決めておくと、迷わずスムーズに作成できます。 また「文体」も重要です。 「〜です・ます調」で統一するのか、親近感を出すために「〜だ・である調」や「〜だね」といった語尾を使うのかを決めましょう。 さらに「！」や「？」などの記号の使用頻度やルールも決めておくと、担当者が変わっても違和感なくスムーズに読み進められるメルマガになります。 |
トンマナの事例を見てみよう！
サンリオ
サンリオのメルマガ事例からは、企業理念やコンセプトをどのようにデザインへ落とし込むかというヒントがたくさん見つかります。
サンリオといえば「みんななかよく」という企業理念のもと、世界中に「カワイイ」文化を通じて笑顔と温かい思いやりの輪を広げることを大切にしていますよね。
このコンセプトがメルマガのデザインにもしっかりと反映されていて、全体が可愛らしく優しいパステルカラーで統一されているのが印象的です。
ひとくちに「カワイイ」といっても、実は色々な種類があります！
たとえば、元気でポップな可愛さを表現したいなら、原色に近い濃いめのカラーが使われることが多いはずです。
でも、サンリオが届けているのは、もっと穏やかで心温まる優しい世界観です。
だからこそ、強い色ではなく、ふんわりとしたパステルカラーを選ぶことで、ブランドの持つイメージを読者に直感的に伝えているのでしょう🤔
また細かいあしらいにも注目してみましょう。
使われている絵文字やアイコンは、角が丸くデザインされたものばかりです。
角ばった形を避けることで、見た目からも優しさや親しみやすさを感じられるようになっています！
さらにキャラクター特集などのコンテンツでは、画像とテキストの間の余白がルール化されているのもポイントです。
ただ可愛いだけではなく、整頓されてすっきりとした印象を与えるため、情報がとても読みやすく整理されています。
このように、コンセプトに合わせて色や形、余白のルールを決めることが、ぶれない世界観づくりにつながっています！
無印良品
無印良品のメルマガは、シンプルさと機能美を追求したトンマナのお手本といえます。
無印良品の企業理念の一部をみてみましょう。
| 無印良品は衣服、生活雑貨、食品という幅広い品ぞろえからなる品質の良い商品として、1980年に日本で生まれました。無印良品とは「しるしの無い良い品」という意味です。 |
「しるしの無い良い品」という意味を持つブランド名の通り、シンプルで合理的な商品開発を続けてきた企業の姿勢が、そのままメルマガのデザインにも表れています。
装飾は最低限に抑えられ、そのぶん、ゆったりとした余白と綺麗に揃えられたレイアウトが際立っていて、とても洗練された読みやすい構成になっています。
色使いは、黒と白を基調としたモノトーンでまとめられています！
これは、ベージュや白といったナチュラルな色味が多い無印良品の商品イメージを邪魔しないための工夫でしょう。
ここで少し気になるのが、ブランドカラーである「臙脂色（えんじいろ）」の使い方です。
ロゴに使われている象徴的な色ですが、メルマガ内ではメインカラーとしてあまり使われていません。
これにはいくつか理由がありそうです。
まず、臙脂色のような濃い色を背景やメインとして広範囲に使うと、画面のコントラストが強くなりすぎて、文字が読みにくくなってしまう可能性があります。
読者が画面を開いた瞬間に「目が痛い」と感じてしまっては、元も子もありませんよね。
また、普段目にする店舗や商品の落ち着いた世界観と合わせるため、あえて白黒をベースにしているとも考えられます。
ブランドカラーだからといって必ずメインで使う必要はなく、読みやすさや本来のブランドイメージを優先して、ここぞという場所のアクセントカラーとして使う。
こうした判断も、トンマナを決めるうえで大切な視点だと気づかされました！
まとめ
この記事では、メルマガデザインにおけるトンマナの重要性と、具体的な設定方法について解説しました！
トンマナは単なる見た目のルールではなく、読者にブランドの世界観を正しく伝え、信頼関係を築くための大切な要素です。
またルールが明確になることで制作の迷いがなくなり業務効率化につながるという大きなメリットもあります！
| ▼トンマナ設定のポイント ペルソナ設定：「たった一人の顧客像」を具体的にイメージする コンセプト設定：「誰に何を伝えたいか」を言語化する デザイン要素の決定：配色・形・余白・フォントをコンセプトに合わせて選ぶ |
いきなり完璧なデザインを作ろうと焦る必要はありません！
まずはペルソナとコンセプトを明確にし、そこからメインカラーやフォントを統一していくだけで、メルマガの印象は驚くほど洗練されます。
ぜひこの記事を参考に、自社らしい素敵なトンマナを見つけてみてくださいね！📨
コンビーズメール
テンプレートと操作性に優れ、
AIが配信をサポート
コンビーズメールプラス
htmlエディタで直感的！
ちゃんと届いて月5,500円〜！
コンビーズメールライト
初心者にもやさしい
シンプル機能と安心の配信
コメント