- テキストやオブジェクトが反射して映り込んでいるような加工をしてみたい・・・
この記事では、Photoshopの「反転」や「変形」、「グラデーション」などの機能を駆使して、オブジェクトが反射して映り込んでいるように見せるテクニックを紹介しています。
Webデザインをしっかり学びたいなら・・・
- 一流のパーソナルメンターによる学習サポート
- バナー、キャラクター製作スキルが身につく
- 講座の詳細はこちら
TechAcademy公式サイトオブジェクトが鏡面反射して映り込んでいるようにするテクニック
以下のような「PHOTOSHOP」というテキストが反射して映り込んでいるように加工していきます。
まず、文字列を後から編集しやすいようにスマートオブジェクトに変換します。
続いて、テキストレイヤーをコピーしていきます。テキストレイヤーをレイヤーパネル下部の＋アイコンにドラッグするとコピーできます。
コピーしたテキストレイヤーを選択した状態で、
「編集」メニュー＞「変形」＞「垂直方向に反転」をクリックしてテキストを反転させます。
すると、以下のようにコピーしたテキストが反転します。
続いて、コピーしたテキストを、コピーテキストの上端が元のテキストの下端に接するところまで移動します。
次に、コピーしたテキストレイヤーを選択した状態で、
「編集」メニュー＞「変形」＞「自由な形に」を選択します。
テキストの周囲にハンドルが表示されるので、下中央のハンドルを上方向にドラッグして縮小していきます。
編集が完了したら、オプションバーの「〇」をクリックして編集を終了します。
続いて、コピーしたテキストレイヤーを選択した状態で、レイヤーパネル下部の「レイヤーマスクを追加」をクリックします。
すると、コピーしたテキストレイヤーにレイヤーマスクが追加されるので、このレイヤーマスクを選択した状態にします。
レイヤーマスクを選択した状態で、ツールパネルから「グラデーションツール」を選択します。
カラー設定を以下のように設定します。
グラデーションツールで下図のように、下から上に向けてドラッグしていきます。
すると、レイヤーマスクにグラデーションがかかり、反射したテキストが下に向けて徐々に透明になります。
最後に、反射したテキストがより自然に映り込んでいるように見せるため、「不透明度」を調整します。ここでは、70％に設定しています。
以上で完了です。
続いて、テキストの文字列を変更してみます。
まず、スマートオブジェクトに変換したテキストレイヤーをダブルクリックしてスマートオブジェクトとして開きます。
試しに、文字列を以下のように変更して保存します。
すると、反射したテキストも同様に変更されました。
体系的にPhotoshopスキルを身につけたいなら
この記事では、Photoshopの使い方について説明してきました。この記事のように、今の時代、インターネットや専門書を探せば様々なテクニックやノウハウを見つけることができます。しかし、体系的に確かなスキルを身につけるという点で考えるとインターネットや書籍の情報だけでは難しいのが現実です。
もっと体系的に最新のPhotoshopのスキルを学ぶためには、通学制、通信制を問わずPhotoshopなどデザインについての講座を受講することがおすすめです。以下の記事では、おすすめのPhotoshopが学べるWebデザイン講座の一覧を紹介しているので是非参考にしてください。
まとめ
Photoshopでオブジェクトが鏡面反射して映り込んでいるようにするテクニックを紹介してきましたがいかがだったでしょうか？
この記事では、テキストを使って反射しているように見せる加工をしましたが、同じり方でオブジェクトの反射も作ることができます。ぜひ、いろいろな素材を使って試してみてください。
Webデザインをしっかり学びたいなら・・・
- 一流のパーソナルメンターによる学習サポート
- バナー、キャラクター製作スキルが身につく
- 講座の詳細はこちら
この記事の執筆者
