WEBデザイン

【Fireworks】写真の上の文字を読みやすくする方法

投稿日:2014年10月1日 更新日:

こんばんは、新人Aです。

 

今日は、写真に文字を乗せるときに読みやすくする工夫についてお話します!

たとえばこんな写真。
綺麗な夜景ですが、暗い空と明るいライトアップのコントラストで白い文字が若干負けてしまいます。
NETのあたりが読みにくく感じますね。
それでは、この文字を加工してみましょう!

 

 

【①エンボス(隆起)】


文字を浮き上がらせて読みやすくします。
「フィルタ」の横にある「+」をクリックし、「ベベルとエンボス」→「エンボス(隆起)」を選択します。
設定はこんな感じです。凹凸画できて少し読みすくなったのではないでしょうか?^^

 

 

【②エンボス(押下)】


先ほどのエンボス(隆起)と手順は同じですが、こちらは文字が凹んで見えますよね。

 

 

【③背景と文字の間に半透明の長方形作る】


本についている帯みたいで、こうするとかっこいい印象がありますね。
写真にもよりますが、黒で塗りつぶした場合は30~45%くらいがちょうどいいかと思います。

 

 

【④写真の明度を下げる】


文字は加工せず、写真の明度を下げました。
これは明度-40ですね。暗くなって色が濃くなったので白い文字が映えるようになりました!

 

 

【⑤文字の縁取り】


入力した文字にフチをつけます。
こうすると、ポップな雰囲気になりますね!
縁取り擦るというと黒を選んでしまいがちですが、背景からしっくり来そうな色をスポイトでとると写真になじむ気がします!

 

あれこれ試してみながら、写真に合った加工をしてみてください!^^

-WEBデザイン

関連記事

ボタンを押すだけ!? 【Photoshop】 フリー  レイヤースタイル ゴールド(金色)系 厳選素材まとめ!

ボタンを押すだけ!? 【Photoshop】 フリー  レイヤースタイル ゴールド(金色)系 厳選素材まとめ!

こんにちは。 今回はクリックするだけでゴールド&メタリックな質感のデザインが作れてしまうPhotoshopのレイヤースタイル素材と活用方法についてご紹介いたします。 このフレームを・・・ たっ …

デザインにおいて余白は重要!おしゃれに見える理由や効果などを例をもとにしてわかりやすく解説!

デザインにおいて余白は重要!おしゃれに見える理由や効果などを例をもとにしてわかりやすく解説!

デザイン設計においては、余白が重要です。適度に余白が配置されることで、コンテンツが見やすくなります。余白がなくコンテンツが敷き詰まった状態は、ユーザビリティが低いため改善が必要でしょう。 本記事では、 …

デザインコンセプトとは?重要性や作り方について事例を交えてわかりやすく解説

デザインコンセプトとは?重要性や作り方について事例を交えてわかりやすく解説

デザインコンセプトは、作る側にとっても、見る側にとっても、とても大切です。何を伝えるべきで、何を伝えないべきか。コンセプトをしっかり設定すると、無駄な部分がスリムになってデザインに統一性が生まれるので …

【Illustrator】幾何学模様の作り方

【Illustrator】幾何学模様の作り方

みなさまこんにちは、新人Aです。 三角形で作る幾何学模様の作り方をご紹介します。 これはパターンにするよりもランダムに色を置いていったほうが幾何学模様の雰囲気がぐっと増すと思うので、 少し面倒ですがパ …

【Illustrator】簡単!マーブル模様の作り方

【Illustrator】簡単!マーブル模様の作り方

マーブル模様って、パターンと違って規則性もないし、表現するのは大変ですよね。 アナログで作るのにも道具を引っ張り出すのも面倒・・・失敗するのも怖い・・・ そこで、Illustratorで簡単にマーブル …