パワポの使い方 パワーポイント 企画/仕事効率化

【パワポのお仕事】事例&アイディア <写真に重ねた文字の目立たせ方>

みなさん、こんにちは
企画書、資料・営業ツールの作成、名刺デザインにパワポチラシの制作etcとパワポを使って仕事をしている私のところには、様々な仕事や相談が舞い込みます。
その中でよくご相談いただく内容について事例を交えて、その対策となるアイディアをご紹介したいと思います。
私の経験則からあなたのパワポ表現向上のヒントにお役に立てば嬉しいです。
よろしくお願いいたします。

与件:スライド上で写真に文字を重ねるとスゴく読みにくくなってしまうことがあります。
そんな時、文字を読みやすくする方法ってありますか?

例えば下のようなケースです。

<例>

この通りもっと文字を目立たせないと読めません。別の写真に変えればいいんでしょうけど気に入っている写真なので変えたくありません。助けてください(困)

*上記の例は依頼主の希望もあり原版のまま公開できないため、だいたいの体裁と内容がわかる程度にリメイクしています

 

なるほど、
文字や写真にも色味の個性がありますので相性がありますよね。
特にアリものの画像や撮影後の写真を生かしたい時などは、専用ソフトを使わない限り大幅な修正はできないので「もう少し明るければよかったのに」「もっと引きの構図で撮っておけばバックが使えたのに」なんてよくあることです。

それでは早速、与件と検討点を整理してみましょう。
私が相談者にヒアリングして得た情報等も合わせて補足しておきます。

☆ 色の基本知識や相性についてはこちらをご覧ください ☆

色を知る者は背景を制す① : 色にも相性がある!? 色 の三要素を知ろう!

 

依頼内容:写真上の文字を読みやすくしたい

希望条件:画像は変えたくない

補足
*できれば文字は黒色の文字を使いたい

それならば、こんな方法で解決したらいかがでしょう!

写真と文字の相性を取り持つ工夫


文字を読みやすくするアイディア


今回、私がアドバイスしたいのは、大きく2つの方法があります。

1)文字自体に手を加える方法
2)文字の背景に手を加える

 



文字自体に手を加える方法

文字通り

■書体や文字の大きさを変える
■斜体などの変化をつける

などの方法となりますが、こちらについてはすでに本サイト内でご紹介している下記をご参考になさってください

【超使える!パワポの基本】文字の書体・色・大きさの設定

【超使える!パワポの基本】文字の効果の種類

【超使える!パワポの基本】ワードアートのスタイル

 


文字の背景に手を加える

文字を重ねる背景となる写真の全体あるいは一部分を加工したり、相性をよくするために媒体となる図形などを網掛して挟み込む方法です。

■写真全体の階調を調整する

言葉で説明しにくいのですが、要は下図のような効果を出す加工です
背景画像のトーンを調整することで文字が浮き立って読みやすくなります。

 

では早速、作業してみましょう

背景となる画像を用意します。
通常 jpg などの画像ファイルをそのままスライドにコピペしますよね。

しかし、この貼り付け方による画像は
書式タブ> リボン内「調整」グループ の中にある機能(修正・色・アート効果など)にある修正しかできません。
そこでコピペではなく図形のテクスチャとして取り込みます

まずは、
ホームタブ>リボン内「図形描画」グループ> 図形サンプル からデフォルトの図形を描画します。
ここでは使用する仕上がり写真に合わせて長方形を描画しました。この時、背景として使う写真の大きさに合わせて長方形を作っておくと後々の作業がラクになります。

描画した図形(ここでは長方形)の上にカーソルを置いて右クリックし、「図形の書式設定」をクリック
*タブはどこのタブを開いていても構いません

▼スライド上にメニューが現れますので
左サイドメニューの「塗りつぶし」をクリック

▼「塗りつぶし(図またはテクスチャ)」に「●」チェックし、図の挿入 >ファイル をクリック

使用する写真を格納している場所 >フォルダからファイルを選んでクリック
※デスクトップにおいてる方はデスクトップから、ピクチャーファイルに置いている方はピクチャーファイルからと人によって異なります

▼先ほど描画した図形の中に指定した写真が取り込まれて収まりました。

次に取り込まれた画像の上にカーソルを置いて右クリックし、「図形の書式設定」をクリック

先ほどと同じメニューが現れますので
「塗りつぶし(図またはテクスチャ)」に「●」チェックし、最下層にある「透過性」のスクロールバーを右に動かしてみます

ここではちょうど半分(50%)に設定してみます
*ちなみにデザイン・印刷業界ではこれを「半階調」といいます

▲こんな感じに半透明っぽくなりました

このように指定したパーセンテージ(%)によって透明感が段階的に変わってきます。

原版(100%)

▽透過性:30%

透過性:50%(半階調)

透過性:70%

文字の大きさや色味の相性などからバランスを見て階調を決めてみてください

 

■文字部の背景に透過図形を挿入

文字と写真の間に透過した図形を挟み込むことで文字を強調することができます。写真部分的に切り抜いたりする必要もないので写真全体のイメージを崩すことがないので多くのデザインに採用されています。
下図のような加工です


それでは作業してみましょう
ここでは文章を読みやすくしたいため、文章全体が入る大きさの図形を用意します
ホームタブ >リボン内「図形描画」グループ内の「図形」 をクリックして図形を選びます

ここでは長方形を選んで黒色に塗りつぶしました

囲みの罫線も必要ないので
リボン内「図形描画」グループ >図形の罫線 >「線なし」をクリック

次に黒い長方形を半透明に透過したいので
リボン内「図形描画」グループ >図形の塗りつぶし >「その他の色」をクリック

パレットのようなメニューが表示され、その最下部に「透過性」という項目があります
左右にスライドするスクロールバーがあるのでこれを右に動かしてどれくらい透過させるかを決めます。
スクロールバーを移動すると自動的に右のパーセント(%)表示が変わります。直接ここに数値を入力して設定することもできます

ここでは半階調(50%)に設定してみます

▼黒がグレーになりました

 

実はこの方法で設定した色はペンキや絵の具の一色で隙間なく塗った色としてではなく、隙間のある点の集まりによってできる色といえます。そのために透けて見えます。新聞紙の写真を拡大してみると点の集まりによって色や形が形成されていたり、デジカメの解像度の違いで同じ被写体でも鮮明だったり荒い画像ないなってしまったりしますが、その原理と一緒と考えるとわかりやすいかもしれません。

隙間ない密度で塗りつぶすことをデザイン・印刷業界では「ベタ」といい、点の集合を「網点(アミテン)」といいます。ソフトによって違うのですがこの網点の大きさや重ね方の調整をすることで階調をコントロールしています。

 

☆☽★

では、出来上がった半透明の図形を写真に重ねてみましょう
①文章が収まる位置に半透明の図形を合わせてレイアウト
②レイヤ(重ね合わせ)が下記の順序になるように文章を最前面、写真を最背面に移動します

*それぞれ右クリックして現れるメニューの「最前面に移動」「最背面に移動」を使うとスグにできます

このように重なりました

でも、変わらず読みずらいですよね。なので図形の色を変更してみます。
ここでは「白色」を選択してみます。
*「あれ???真っ白になっちゃうんじゃないの!」と思われた方も多いかもしれませんね。大丈夫です!
先ほど「ちょい足しPoint」でお伝えした「アミ点」の状態になっているからです。

どうでしょう!?
だいぶ読みやすくなりました

先ほどのグレー図形を生かしたい場合には、思い切って文字の色を変更してみるのも一つです。
ですが、今回の与件としてはできるだけ「黒文字を使いたい」とのご希望がありましたので参考までに記させていただきます。効果の違いの参考にしてみてください

文章(文字)の色を変更するには文章が入力されているテキストBOXをクリックして選択している状態、または色変更したい文字だけをドラックして反転させます。
下図は文章が入力されているテキストBOX全体を選択している状態です

ホームタブ >リボン内「フォント」グループ >テーマの色▼ で現れる色見本から変更したい色を選びます
ここでは「白」を選んでみます

このように文字の色が「白色」に変わって先ほどの半透明の濃い目のグレーでも文字が読みやすくなりました

原版と比べてみるとこの通り

ここでは対照的な例をご紹介しましたが、透過性の度合いを変えたり、パターンの色味、文字の色などをスライド全体のバランスやデザインに合わせて効果を取り入れてみてください。

 

■光彩などで文字を浮き立たせる

この方法は Step-1 でご紹介した文字自体への工夫ともいえるものですが、蛍光ペンで文字にラインを引くイメージで筆やクレヨンで引いたような線をパターンとしてアンダーライン風に使う方法です。


実際にはこのような素材を用意しなくてはならないので、ここではパワポのデフォルト機能でできる効果をご紹介しましょう

効果を得たい文字や文章を選択して
書式タブ >リボン内「ワードアートのスタイル」グループ > 文字の効果光彩
の順にクリックし、光彩の種類を選びます

ここでは文章全体を選択して 緑色(オリーブ、18pt)を選んでみます

文字が緑色に囲まれて縁取りをされたような効果が得られました

デザイのプロの現場では一回り二回り大きい同じ文字を用意して、元の文字に色を変えて重ねてずらしたり、縁取りの幅を大きくすることによってパターン化して同じような効果が得られるよう工夫を凝らしています

 


まとめ

今回、ご紹介した表現を原版と比べてみると

一目瞭然!

加工を加えた部分の文字はだいぶ読みやすくなっていますね

 


どうでしょう!
このアイディア気に入ってもらえたでしょうか?

これはほんの一例、一アイディアに過ぎません。最近では意図的に文字を読みづらくしておいて興味を持たせプレゼンテーション時に口頭でフォローすることもあります。写真でイメージを定着させることを優先すべきか、文字で理解を促すことを優先すべきか戦略的に考えることも大事かもしれません。

資料を見る側・プレゼンを受ける側の立場や気持ちになって「思いが伝わる」スライド作成することが一番大切なことだと私は考えています。

「見栄えより思いを伝える」

を優先して発想してみてください。
あなたなりのデザインがきっと見つかるはずです p(^^)q

背景についての関連記事はコチラもご覧ください

背景の活かし方

色を知る者は背景を制す㉕:【応用編】これは使える!背景のギミック

 

色を知る者は背景を制す㉑:【応用編】まずはテーマカラーを決めよう!

 

<PR>

 

            いかがでしたか?

本サイトは、初心者の方を含め、誰にでもまかりやすい表現を目指しています。本文中でわかりずらい言葉などがありましたらご遠慮なくコメントをいただけましたら幸いです。

より良い記事にしていけるよう改善修正させていただきたいと思います。

よろしくお願いいたします。

 

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です