凝ったテキストのデザイン画像ができれば、いろいろな場面で活用できますよね。
というワケで、今回はGIMPで実践できる【テキストをかすれさせた画像】を作る方法を紹介します。
※バージョンは【GIMP 2.10.14】
GIMPでテキストをかすれさせる
大きい画像をヘッダーロゴにした場合は、スマホでもキレイに表示されるようにCSSを設定しなければいけません。
なので、スマホ表示でも問題なく全体が見られるように、最初から適切なサイズの画像を作ることにしました。
ヨコ300px・タテ100px程度が無難かなと思います。
GIMPを起動させて、「新しい画像を作成」⇒「幅300px、高さ100px」に設定⇒「OK」をクリックしていきます。
「テキストツール」を選択後にテキストを入力していきます。
表示されているテキストツールでもフォントやサイズを変えられますが、テキストツールを選択すると出てくる左の画面でも細かい設定が変更できます。
ココで文字間隔やインデントを変更する場合は設定してください。私は文字間隔を少し変更しました。
テキストが入力できたら、「レイヤー」⇒「レイヤーマスク」⇒「レイヤーマスクの追加」をクリックします。
「完全不透明（白）」を選択後に「追加」をクリックします。
メニューから「ツール」⇒「描画ツール」⇒「塗りつぶし」を選択します。
塗りつぶしの設定で、お好みのパターン色を選びます。
テキストの上にマウスを持っていくとバケツのアイコンになっているので、左クリックするとテキストがかすれたようになります。
次は「レイヤー」⇒「レイヤーマスク」⇒「レイヤーマスクの適用」をクリックします。
私が調べた方法ではこれで完成のはずですが、まだテキスト周りの点々が残っています。
そこで、最後に「下のレイヤーと統合」をクリックすると、テキスト周りの点々が消えて完成です。
これでかすれたテキストの出来上がり。
出来上がった画像をJPEGで保存して、ヘッダーロゴに設定します。
※このヘッダー画像は前のブログで使用していたものです。現在は使っていません。
おわりに
GIMPの使い方を説明しているサイトを見ながら実行したのですが、私が使っているGIMPとはツールやメニューの場所が違っていました。
なので、GIMPのバージョンによって違うんだと思います。
とりあえず透明のレイヤーを作って、パターン色で塗りつぶして統合するとテキストがかすれるということなのでしょう。（←あんまりわかってない）
以上、かすれさせたテキスト画像を作る方法でした。
