フォント」タグアーカイブ

思わず読みたくなるフォントデザインにする 3つの方法

まずはこの 2つの文章を見てください。

上と下、どちらに目がいきますか?
どちらの文章を読みたいと思うでしょうか。

読ませるためには、中身と見た目の 2つの要素があります。
ですがこのように見た目が悪ければ、たとえ中身が良いとしても読んでもらえないのです。

では、どのような見た目だと読んでもらいやすいのでしょうか?

今回はフォントの見た目をフォントの幅・フォントカラー・間隔の 3つに分解して改善することで、読み手を引き込む方法をお伝えします。

フォントはゴシック体で、線の幅が均等のもの

日本語フォントには明朝体とゴシック体があります。
明朝体は線の幅がまばらで見づらいため上級者向けです。インパクトがあるので、見出しなど大きなフォントサイズだと効果的ですが。
ですので基本的にはゴシック体を選んで損はありません。

さらに文章だとサイズが小さくなるので、線の幅が均等のものを選び、フォントが小さくなっても見やすいようにしましょう。

Apple はかなりフォントに気を使っており、洗練されたデザイン・使いやすさの大きな要因です。

一方 Windows は独自のフォント開発をしているものの、アップデートのたびに採用フォントを変更しており、フォントに対する姿勢はぶれています。

Windows 10 のフォントはとにかく読みづらいのですが、これはフォント自体(游ゴシック)ではなく、游ゴシックの細さが問題なのです。

Windows 10で游ゴシックの細さと薄さを改善する、具体的な対策まとめ

こちらに Windows 10 のフォント(游ゴシック)改善についてまとめているので、Windows 10 ユーザーはぜひ参考にしてください。

フォントデザイン 1つ目のポイントは、線の幅が均等なゴシック体を選ぶことです。

色は黒ではなく、グレー

普段、フォントの色は何色にしていますか?
特に気にしていないなら、フォントの色は黒になっているはずです。

左のフォント色は黒で、右はグレーです。

一般的な背景色である白に対して黒はコントラストが強すぎるのです。
黒とのコントラストの強さにより文字の間の白が際立ってしまい、文字が読みづらくなってしまいます。

色覚異常でも見やすい配色になる『2つの差』の埋め方

白か黒のどちらかをグレーに寄せるべきなのですが、どちらが良いのでしょうか?

配色の原則は、自然の法則にならうこと。
実は自然界には白はあるものの黒はほぼ存在しないのです。

よって、黒をグレーにする方がナチュラルです。
グレーにするとコントラストが抑えられて読みやすく、読んでいても疲れにくくなります。
これだと読み手は離脱しづらいので長く読んでもらいやすくなりますよね。

フォントの色は黒ではなくグレーにしましょう。これが 2つ目のポイントです。

行間に見えない線をつくる

フォント自体が読みやすくても、フォント同士の間隔が不自然だと結果的に読みづらいですよね。
大切なのは、読み手の目線の動きに沿ってストレスなく読み手を誘導できているかどうかです。

ポイントは行間に見えない線をつくることです。
間隔は縦と横(行間隔と文字間隔)があり、縦はある程度空け、横は詰める。
具体的な間隔は縦・横でそれぞれ異なります。

行間隔は透明な線を引くイメージで、目線をブレさせないようにしてください。
読み手の目線は左から右へ、1行づつ流れます。
行間隔が十分にない場合、この読み手の目線がブレてしまうのです。

文字間隔は、線が見えない程度に少しだけ空けるといいでしょう。
広すぎると文字をかたまりとして認識しにくくなるので、フォントサイズ(幅)に対して一定の割合を空けるようにします。
具体的には、細い線が通るくらいは空けておき、フォント同士が重ならないようにしましょう。

また、ひらがなより漢字の方が文字間隔が狭いので、漢字が多いと詰まって読みづらくなります。

ひらがなと漢字は 7 : 3 程度の比率を意識すると読みやすくなるので、ぜひ試してみてください。

3つ目のポイントは、読み手の目線にそって行間に見えない線をつくる
これでフォントデザインは完成です。

まとめ

文章の見た目つまりフォントデザインによって読み手は引き込まれます。
フォントの幅、フォントカラー、間隔。
この 3つを改善して、思わず読みたくなるような文章を目指してください。

Windows10のフォント(游ゴシック)の細さと薄さを改善する、具体的な対策まとめ

この記事で伝えたいこと

Windows10の游ゴシックはMacより1段階細いため、薄く細く見えてしまいます。そこで、游ゴシック Mediumに変更することで、Windows10の游ゴシックを見やすいフォントへ改善します。

課題:游ゴシックが薄い&細い

Windows10の游ゴシック、見にくいですよね。
PowerPoint最初の1枚目なんて特にうんざりしません?

もともと游ゴシック自体は美しいフォントなんです。
字游工房 游ゴシック

ですがWindows10では、なぜか薄く細く表示されてしまいます。

これは、WIREDのある記事の抜粋です。

どちらも游ゴシックですが、Windows10の方が薄く細く見えますよね。

なぜWindows10だと、こんなにも細く見えるのでしょうか。

原因:Windows10はウェイト(太さ)が細い

Windows10の游ゴシックが薄く細く見える原因は、2つあります。

1. Windows10は游ゴシックのウェイト(太さ)が1段階細い



游ゴシックには7種類ものウェイト(太さ)があり、MacとWindows10ではデフォルトのウェイトが違います。
MacはMediumなのに対し、Windows10では1段階細いRegularになっています。

2. 黒自体が見にくい


どうやらWindows10では、ガンマ補正が強くかかっており、黒が薄くなる傾向があるようです。

Ryuseiさんの以下リンク先の記事で詳しく解説されています。

游ゴシックは何故Windowsでかすれて見えるのか

さらに游ゴシックはもともと余白が広いので、余計に薄く細く見えてしまいます。

このように原因はいくつかありますが、今回は1つ目の原因であるフォントの太さに絞ります。
たったひとつの箇所を変えるだけで、游ゴシックの薄さと細さを改善できるんです。

解決策:游ゴシック Mediumへ変更

游ゴシックを游ゴシック Mediumに変更する、たったこれだけです。

変更方法を画像付きで説明します。

まずは、ブラウザから。

Internet Explore

右上の歯車マークから、インターネットオプションを選びます。

フォントボタンを選び、[Web ページ フォント]を游ゴシック Mediumへ変更します。

Google Chrome

右上の3点リーダーから、設定を選びます。

フォントをカスタマイズを選んでください。

するとフォント変更箇所が4つあります。すべて游ゴシック Mediumでもいいですが、Serifフォントのみ游明朝 Demilightにしておくといいでしょう。

Windows officeは、ソフトによって設定方法がばらばらなので、注意してください。

Excel

Excelは簡単です。ファイルからオプションへ進み、基本設定のフォントを変更すれば完了です。

PowerPoint

表示タブからスライドマスターを選び、フォントというボタンをクリック。
そして一番下にあるフォントのカスタマイズを選びます。
すると以下のような画面になるので、すべて游ゴシック Mediumを選択し、フォントパターンを作成します。
名前は[游ゴシック Medium]などとしておくとわかりやすいです。

これで新しいスライドを追加しても、はじめから游ゴシック Mediumになっています。

outlook

デザインタブからフォントボタンを選びます。
すると、さきほど作成した、フォントパターンが登録されていますよね?

游ゴシック Mediumというフォントパターンを選ぶだけで、簡単に変更できます。

Word

ファイルからオプションへ進み、ひな形というボタンを押します。

すると下のように、[文字書式]というボタンが3つ出てきますので、それぞれ押してフォントを変更してください。

またoutlookとWordでは、フォントの形や文字間隔など、さらに細かいカスタマイズも可能です。
(近日投稿予定)游ゴシックをヒラギノ角ゴに近づけるカスタマイズ

効果:薄さ&細さが改善された

游ゴシック Mediumへ変更すると、これぐらい見やすくなります。

フォントを変えるだけで、Windows10の游ゴシックが見やすくなりました。
6つのアプリ全部合わせても10分あれば設定できるので、ぜひ試してください。

読み手を引き込むフォントデザインについて具体的にまとめました。こちらもぜひ参考にしてください。
思わず読みたくなるフォントデザインにする 3つの方法

ただ、ヒラギノ角ゴと比べると、まだまだ見やすいとは言えません。

(近日投稿予定)游ゴシックをヒラギノ角ゴに近づけるカスタマイズ
游ゴシックを、Macの美しいフォントであるヒラギノ角ゴに近づけてみました。

メールや資料の見せ方にこだわりたい方や、社用PCで仕方なくWindowsを使っている方に、ぜひアクセスして欲しいです。

一番伝えたいことを確実に伝えるプレゼン資料の作り方

あなたの資料は、あなたが伝えたいことをきちんと伝えてくれていますか。

社会人にとって資料作成は避けては通れないスキルですが、伝えたいことが伝わらず、違う解釈をされてしまうことがありますよね。

この記事では、あなたが伝えたいことを確実に伝えるための、プレゼン資料の作り方をお伝えします。

プレゼン資料を作るうえでやってはいけないのは、とりあえずパワポを開くこと。

まずは、プレゼンの『目的』と『構成』を練ることから始めましょう。

プレゼンの3つの目的を使い分ける

プレゼンの目的は共有・説得・感動の3つに分類できます。

共有

共有とは、相手に何らかの情報を伝えること。

たとえば、社内報や業務連絡など、様々な立場の人に向けて伝えるものが多いです。

情報を正確に伝えることが目的なので、相手にとって分かりやすい資料にする必要があります。

説得

説得とは、相手に行動を起こさせること、あるいは行動を変えさせること。

まさに営業のことで、コンペや社内承認など、一般的なプレゼンの目的でもあります。

説得するためには分かりやすい資料だけでなく、相手を納得させるためのストーリーが必要です。

感動

感動とは、相手の感情を動かすこと。

結婚式のムービーなんかは感動のプレゼンですね。

先ほどの2つに加えて、よりパーソナルなストーリーや、動画や音楽など相手の感情に訴えかけるコンテンツが必要です。

以上、プレゼンの目的は3つありますが、理想的にはすべてのプレゼンは感動を目指すべきです。

しかし日報にいちいち感動していられないので、プレゼンする内容によってふさわしい目的を決めましょう。

一番伝えたいことを中心に構成する

プレゼンの目的を決めたら、次は構成を考えます。

プレゼンは、一番伝えたいことを伝えられるような構成にしなければなりません。

文字にすると当たり前かもしれませんが、これがなかなか難しいですよね。

以下の3つの手順で考えると、構成を組み立てやすくなると思います。

一番伝えたいことは?

まずは、一番伝えたいことを考えましょう。

一番伝えたいことは本のタイトルや曲名のように、一言で全体を表す必要があります。

一言で全体を表しているかどうか、次の3つの要素でチェックできます。

☑️簡潔
簡単で分かりやすい表現か、そして無駄な言葉がないかをチェックします。

なんとなく見ている新聞やニュースの見出しなど、実はとても参考になるので、ぜひ意識的にチェックしてみてください。

☑️具体的
抽象的な表現は、内容に即したものに変えます。

たとえばサイト内容を改善する場合だと、
before) 「読者の立場で考えましょう」
after) 「文字を読み飛ばす読者には画像が効果的です」
というふうに内容に即して言い換えるべきです。

☑️聞き手にとってのメリットがわかる
聞き手にとってどんなメリットがあるのかが伝らなければ、プレゼンの意味がありません。

聞き手の悩みや問題を理解し、このプレゼンでそれを解決できると思わせられるかがポイントです。

これらの要素を満たすと、なんとなく考えて作るよりもはるかに分かりやすく伝えられるようになります。

これ以降、一番伝えたいことを中心に構成していくので、ここで一番伝えたいことをどれだけ洗練させられるかがとても重要です。

納得できるまで何度も練り直しましょう。

Q&Aでブレイクダウンする

あなたが一番伝えたいことは新情報、つまり聞き手が知らないことなので、聞き手は疑問を抱くはずです。
その疑問に答えるように、伝えたいことをブレイクダウンしていきます。

ブレイクダウンの切り口は『なぜ』『どのように』などの疑問詞か、フレームワークをつかってモレのないようにします。

これ以上質問をしてこないであろうところまでブレイクダウンすることで、聞き手は納得します。

導入は『聞き手が知っていること』から

導入部は、聞き手が知っていることから始めましょう。

経験や価値観が一人ひとり違うように、脳内の理解プロセスも人それぞれ異なるので、いきなりあなたが伝えたいことを伝えても理解してもらえません。

ですので、聞き手の知らないことを伝えたいのであれば、まずは聞き手が知っていることから始めることによって、聞き手と話し手の理解プロセスを合わせることが重要です。

これで構成は完成ですが、伝えたいことが伝わった後どうなるのかも忘れずに示しましょう。

たとえば新商品の承認であれば、今後の導入スケジュールや売り上げ予測などを示すことで、読み手は安心して承認してくれるはずです。

聞き手の目線をコントロールするデザイン

ここで初めてパワポを開きます。

『目的』と『構成』をもとにスライドを作っていくのですが、デザインを適当にやってしまうと、せっかく練った構成が台無しです。

デザインは、伝えたいことを伝えるためにあります。
資料作成に即して言い換えると、デザインは聞き手の目線をコントロールすることによって、聞き手に確実に伝えたいことを理解してもらうためにあるのです。

では、具体的にどうデザインすればいいのでしょうか?

☑️枚数
枚数は少ない方がいいですが、情報を詰めすぎてはいけません。
原則は、1スライド=1メッセージです。

ただし、あらかじめプレゼン時間が決まっている場合は、1分=1枚を目安にしましょう。

基本的な構成は、導入1〜3枚、一番伝えたいこと1枚、ブレイクダウンした根拠3枚、今後のステップ1枚、合計6〜8枚で十分です。

導入や根拠の詳細まで説明する場合は、10枚を超えます。
そうなると聞き手は、全体のどこの話をしているか分からなくなるので、ナビゲーションが必要です。

スライドに位置情報をつけよう!聞き手を引きつけるナビゲーション例

☑️レイアウト
全スライドに共通する、メッセージ・根拠・フッターのレイアウトを決めます。

ここでは、デザインの4つの基本にしたがってコンテンツを配置するのがオススメです。

デザインの4つの基本

このうちレイアウトに使えそうなのは、整列と反復です。

レイアウトを見えない線に揃えることで、聞き手は内容を見やすくなります。

さらに同じレイアウトを繰り返すことで、聞き手は注意を削がれず内容に集中できます。

☑️フォント
日本語のフォントには、明朝体とゴシック体の2種類があります。
はね・はらいの装飾があるかないかの違いです。

契約書など正式な文書でない限り、読みやすいゴシック体で構いません。

基本的にはデフォルトで設定されているフォントで問題ありませんが、Windows 10はデフォルトのフォントがかなり読みづらいので設定した方が良いです。

【Windows 10】フリーソフトを使わずに今すぐ游ゴシックを読みやすくする方法

☑️フォントサイズ
フォントサイズは2〜3サイズでコントラストを意識します。
まず見て欲しい所は大サイズ、キーワードなど目立たせたい所は中サイズ、文章や注釈など時間をかけて読む所は小サイズと、目的に合わせてメリハリを付けましょう。簡単なスライドであれば大・中の2サイズで十分です。

コントラストが弱くなると聞き手の目線を誘導できず、結局何を言いたいのかが分からないスライドになるので気をつけてください。

☑️表現
原則として、聞き手は文字を読んでくれないという意識を持ってください。

文章や箇条書きはできる限り避けて、グラフや画像を使って表現しましょう。

特に画像は、文章や箇条書きよりも分かりやすく、多くの情報を伝えられます。

画像を選ぶポイントとしては、先に画像を選ぶのではなく、伝えたいことをベースに画像を選ぶといいです。

しかし、画像は強力なツールである一方、伝えたいことにマッチしなければ逆に分かりづらくなってしまうので、どんな画像を使うのかは注意が必要です。

☑️配色
配色は奥が深いですが、とりあえずこの3つを徹底するだけでも、かなり見やすい配色にできます。

ベースカラー
背景色。特に理由がなければ白にします。

メインカラー
プレゼンのテーマに即した色にしましょう。
自社のブランドカラーや、商品に使われている色を使うと統一感を出せます。

アクセントカラー
スライドで最も伝えたい、目線を集めたい箇所に使用します。
メインカラーの補色(反対色のこと)付近の色にしましょう。

テキストの色は、黒を少し明るくしたグレーがオススメです。
理由は、背景色の白とのコントラストが強すぎるからです。
実際にほとんどのウェブサイトでは、テキストに黒 (rgb(0, 0, 0)) を避けています。

色盲でも大丈夫!配色の基礎知識

プレゼン資料が完成したら、最後に資料をスライド1枚にまとめることをオススメします。

プレゼン相手は主に自分より職位が高い人、つまり忙しい人です。
急な会議などが入り、予定のプレゼン・報告の時間が取れないことなんて、忙しい部署にはよくある話です。

しかし事前に1枚にまとめておくと、短時間でも要点を伝えられるので慌てることがありません。

スライドデザインの6つの要素をうまく使って、聞き手の目線をコントロールし、伝えたいことを伝えられるプレゼン資料を目指してください。

まとめ

以上、
1. プレゼンの3つの目的を見分け、
2. 一番伝えたいことを中心に構成を考え、
3. 聞き手の目線を操るデザインによって、
一番伝えたいことを確実に伝えるプレゼン資料の作り方をお伝えしました。

僕は、大学でPowerPointを経験せずに社会人になったので、かつてはスライド作成が苦手で嫌いでした。

様々なウェブサイトや本から学び取ったものの一部しか提供できませんが、少しでもあなたのお役に立てれば嬉しいです。