Web Design

今流行りのロングシャドウの簡単な作り方


フラットデザインとともに、相性が良いとしてデザインに取り入れられているのが、
ロングシャドウ。右下や左下に長く影を伸ばして、フラットなデザインの中に独特の立体感を表現することができます。
今回は、Illustratorを使用して作ってみたいと思います。

スポンサードリンク

1.文字を入力して、アウトライン化します

背景は、長方形ツールを使って、色の入った(今回は緑色)長方形を作ります。

long-outline

2.アウトライン化した文字をコピーし、2回全面へペースト(cmd+F)します。

計3つのアウトラインオブジェクトができあがりました。

 

3.一番上にあるペーストされた文字を選択し、Shiftキーを押しながら、画面外へ移動します。

45°をキープして。

long-45

 

4.ブレンドツールを使います。

ツールパレットのブレンドツールをダブルクリックしブレンドオプションを表示させます。

blend-tool

long-blend

「ステップ数:300」とします。淵がガタガタに見える場合はステップ数を増やしましょう。
中央のテキストオブジェクトをクリックした後、右下のテキストオブジェクトをクリックします。
そうすると、2つのオブジェクトのブレンドが作成されます。

long-blend2

5.出来上がったシャドウオブジェクトを背面に配置

配置したら、色を影の色に変更しましょう。

long-blend3

 

6.クリッピングマスクをかける

アートボード(背景)と同じサイズの長方形を長方形ツールを使って描きましょう。

作成した長方形とシャドウオブジェクトを選択してcmd+7でクリッピングマスクをかけます。

これで、画面外にはみ出していたシャドウを表示しなくなりましたね。完成です!

long-blend4

 

最後に

いかがでしたか?今流行のロングシャドウの作り方を解説してみました。おしゃれな仕上がりになるので、ここぞというときに使いたいですね。

ぜひお試しください〜。

 

投稿者プロフィール

mayukou
mayukou

Webデザイナー修行中のmayukouです。webデザインのお仕事を始めてなんとか約5年が経ちました。とにかく技術を高めようと思っています。仕事で得た知識やお役立ち情報をご紹介いたします。宜しくお願いします。水彩画を勉強中です。趣味は音楽鑑賞(洋楽)、料理、読書、ブログです。

詳しくはこちら


Twitterをフォローしていただくと、最新情報を見逃しません♫

関連記事

  1. illustration

    photoshopでモコモコの線を描くには?

    こんにちは。mayukouです。今回は、photoshopでモ…

  2. Photoshop

    Photoshopのウィンドウを見やすく!ワークスペースを工夫してみよう

    こんにちは、mayukouです。なんだかすっきりしない天気です。九…

  3. Sass

    使わない方が良い?WordPress 案件をsassでカスタマイズして思う3つのこと。

    みなさんこんにちは、mayukouです。先月、仕事の案件でwordp…

  4. Photoshop

    必見!Photoshopでスタンプ風のかすれた表現をする方法まとめ

    こんにちは、mayukouです。だいぶ、暖かな気候になってきて、過…

  5. Photoshop

    いい味が出る!リアルな水彩画風タッチに最適なPhotoshopのブラシ(有料)

    こんにちは、mayukouです!今日は水彩画に最適なPhotosh…

  6. CSSフレームワーク

    簡単にBootstrapで!100%表示のレスポンシブ対応のカルーセルスライダー

    こんにちは、mayukouです。お盆も過ぎて、後半戦が始まった感じで…

コメント

  • コメント (0)

  • トラックバックは利用できません。

  1. この記事へのコメントはありません。

CAPTCHA


最近の記事

instagramもやっています

facebook更新中!

スポンサー

こんなサイトも作ってます。

  1. Illustrator

    メリハリがつく!Illustratorでドロップキャップを作る方法
  2. Photoshop

    アナログにも負けない水彩画風表現を!Photoshopで混色しながら色を塗る方法…
  3. Photoshop

    Photoshopでスタンプ表現が簡単に!PSD素材で一発表現!
  4. illy

    レポート

    うちカフェでホッと一息できる*illyのコーヒー粉が届きました!
  5. Web Design

    CSS nite in FUKUOKA vol.6に行ってきました。
PAGE TOP