デザイン関係やガジェット情報、旅行情報など幅広く発信中。

デザイン

WordPress 2Dタイトルの作り方

投稿日:2019年9月27日 更新日:

wordpressのシンプルでスタイリッシュな2Dタイトルの作り方を解説していきたいと思います。
下記の順でお話していきます。
①2Dタイトルの画像をphotoshopのプラグインを使用して作成する
②.jpgまたは.pngに書き出します
③書き出した画像をwordpress上でテキストタイトルと入れ替えます。

タイトル画像の他の作成の方法もアップしてますのでご参考までに。
wordpress 3Dタイトルの作り方

2Dタイトル画像の作り方

photoshop上でタイトルのテキストと背景を作成する

白背景と色付きのテキストを用意します。
背景に影を落とすので背景色は白がベスト。
テキストは何色でも良いです。

プラグインについて(Shadowify)

今回はShadowifyというプラグインを使用していきます。
プラグイン(エクステンション )ビューを表示する。

プラグインのインストール方法については下記記事にまとめていますのでご参考ください。

Photoshop プラグイン追加方法

Shadowifyパネルについて解説します。
使用する項目は下記になります。
・Angle→影の角度
・Distance→影の長さ
・Steps→影の粗さ
・Step Scale→Stepsの大きさ
・Blur→影のぼかし

Stepsのみ変更してみます。

比較すると変更後の方が影の出始めが濃くなっているのがわかると思います。

Step Scaleのみ変更

Blurのみ変更

FlattenとGlob lightについて

□Flattenについて
Flattenのチェックを外すと新規で作成されるレイヤー(影)がグールプになります。そのグループの中に100個のレイヤーが作成されています。
逆にチェックを入れておくとこのグループが一つのレイヤーに結合された状態で作成されます。

□Glob Lightについて
チェックを入れておくことで新規で作成されるレイヤー(影)の出方を調整できるツールです。

影の編集の仕方は
メニューの「レイヤースタイル」「包括光源」で調整できます。

影の位置が変わったのがわかると思います。

テキストタイトルを画像に入れ換え

こちらについては「きにぶろぐ.com」さんのブログの方で紹介されています。下記URLを参照ください。
https://kiniblog.com/stinger8-title-logo/

私も参考にさせて頂きました。

最後に

photoshopをお持ちでない方については私の方でタイトル画像を作成を請け負います。
下記私のcoconalaの出品ページになります。
wordpress用 タイトル画像作成します

こちらからご購入のほど宜しくお願いします。

-デザイン

執筆者:

関連記事

【tokyo grapher】iPhone11や一眼カメラに劣らない写真が撮れる!

今回は「tokyo grapher」というスマホ用レンズメーカーのワイドレンズを使いiPhone11や一眼にも劣らない写真を撮影できる方法をお話したいと思います。 上の写真はiPhone8にtokyo …

フォトジェニックな背景画像の作り方 #ブログ #SNS #Photoshop

今回はフォトジェニックな背景画像の作り方について解説させていただきたいと思います。加工した画像に自分のブログやSNSの名前を追加していただきWebの背景画像として使って頂いてもいいですし、背景画像では …

Photoshop レイヤースタイルの使い方

今回はレイヤースタイルの機能紹介です。基本的なレイヤー効果の使い方を解説させて頂きたいと思います。よく使う「通常の描画」と「ブレンド条件」をピックアップしていきます。レイヤースタイルの中の一部の機能に …

デザイナーが本気でライトアップするとこうなる!『スプラトゥーン2』

After Before 普段は照明デザイナーとして建築空間のライトアップをしています。そんな私が有名ゲーム「スプラトゥーン2」のステージをライトアップするとどうなるか、手順をお話していきたいと思いま …

wordpress 3Dタイトルの作り方

wordpressのシンプルでスタイリッシュな3Dタイトルの作り方を解説していきたいと思います。下記の順でお話していきます。①3Dタイトルの画像をphotoshopで作成する②.jpgまたは.pngに …


名前:ちーら
建築学科 大学卒業→アトリエ設計事務所→
フリーランス(デザイナー)として活動。26歳。フリーランスとして建築の仕事をメインに、副業としてブログを開始しました。デザイナーの視点で様々な情報を発信していきたいと思います。