見出し画像

#003 切り裂かれた文字を作る方法をインプット

おはようございます。こんです🦊
こちらのnoteで宣言した通り、昨日インプットしたことを記録します。
今日は3日目!明日は、3日坊主回避なるか!

今回のインプットの目的


  • 文字の見せ方のバリエーションを増やしたい。

  • インパクトのある配色学びたい。


参考にしたデザイン


出典:https://www.pinterest.jp/pin/4925880833461872/

今回のインプットの成果


画像はODANからダウンロードしました。
  • 切り裂かれたような文字の作り方をインプット!

  • 「黄色系」は視認性が下がる印象があったけど、背景色との相性で十分みやすくなるし、インパクトがある。

  • 強めの色(今回だとかなり明るいイエロー)を使うときは、なるべく配色は統一し、ジャンプ率(フォントサイズやフォントウェイトを変える)で、強弱をつけた方が全体に統一感が出て読みやすい。

  • 背景色に少しだけグラデーションを入れてあげると、抜け感が出て柔らかい印象になる。

制作の手順


※私の備忘のために残しているので、下記に示す参考サイトを見る方が勉強になります!
(参考):いろんな場面でとってもお世話になっているマッピーフォトさんのYoutube!

【STEP1】土台となるテキストレイヤーを作る。
※文字位置をずらしたいときは、一文字ずつ別レイヤーにしても良いが、
文字パネルの「ベースラインをシフト」を使って上下に配置すると数値管理できて便利!

【STEP2】隠したい範囲を「多角形選択ツール」で囲ってレイヤーマスクをかける。

【STEP3】STEP2で作ったレイヤーマスクを反転する。
(ショートカットは、⌘+I)

【STEP4】背景や写真、そのほかの文字を配置して完成!



おわりに

最後まで見てくださりありがとうございます。
ちなみに、あまりセンスのない記事のタイトルたちは、photoshopでの操作方法がわからず、検索する時に入力したワードたちです。
検索結果は、画像一覧で見てみると自分がイメージしているのに近い完成形の記事のサムネが出てきたりするので、目当てのものに早くたどり着けて便利だなぁと思いました!


この記事が気に入ったらサポートをしてみませんか?