フォトショップ

白銀比ツールを活用したphotoshopでポスターレイアウトをするためのコツ

黄金比・白銀比ツールを使いこなす

構成要素に必要な画像素材を適当に切り貼りして配置しておく。切り抜きはこちらを参考に⇒これで完璧っ!5種類のphotoshop切り抜き方法

素材の配置

電脳狂想曲さんのWEBデザインの小技へアクセスし、横幅・縦幅を入力、今回はA4ポスターをイメージしているのでJIS規格と相性の良い白銀比にチェックしサクサクラインを引いていく。

黄金比・白銀比ツール

キャプチャーを撮って新規レイヤーに張り付けて、画像素材のサイズと場所を調整。タイトルロゴやテキストも入力し配置する。

女性の顔のサイズ感やサングラスにアゴのライン、男性の目の高さや傘の縦ラインを意識。

キャプチャーをペースト

さらに各画像素材(女性の顔・金魚・男性の顔)も白銀比でバランスを調整するために、女性の顔のサイズに合わせてシェイプを作成

情報のウィンドウを開きシェイプのサイズ調整をしながら高さを確認(H:778.8)。

情報パネル

今度はZAPAさんのWebデザイン白銀比計算ツールへアクセスし778と入力。

白銀比計算

228の数字を金魚のサイズに適用。

サイズ調整

さらに、白銀比計算ツールで228の数字を入力。

さらに白銀比計算

161の数字を男性の顔のサイズに適用。

サイズ調整

これで白銀比ツールをフル活用しダイナミックなサイズ感のあるレイアウトが完成しました!最終的には自分の目で微調整しよう(女性を少し左に移動)。

微調整

今日は黄金比・白銀比ツールをバッチリ使いこなせるまでレイアウトに励もう!

ポスターデザインのコツtopへ戻る配色
スリームデザインの無料メールマガジン

ピックアップ記事

  1. 「ブロガーがこんなの読んだら反則レベルでしょっ、、」と思うくらい文章力が上がりそ…
  2. WordPress日本語有料テーマの決定版っ!TCDシリーズのまとめ
  3. 「特訓Photoshopプロのテクニック教えます!」という本のWEB版を『無料』…
  4. WordPressの使い方に迷ったらまずこの記事をチェック!すごく参考になる秀逸…
  5. フリーランスや起業家になる前にこれだけは理解しておきたい5つのマトリックス&チャ…

関連記事

  1. webデザイン

    これは知らないと損!背景が透明なPNG画像の輪郭をなじませるPhotoshopの使えるテクニック《動…

    人物と背景を合成したい場合、予め人物の背景を透明にしたままでPNG画像…

  2. webデザイン

    フォトショップ初心者でもできる!プロ並みの画像合成で自然になじませる方法を解説。

    フォトショップを使用して合成画像を作りたいと思っても、自然になじませる…

  3. webデザイン

    境界線が複雑な模様やイラストを切り取りせずに合成する裏ワザ的フォトショップ【CS6】技術

    フォトショップで画像を合成させるためには、さまざまな切り取り方法がある…

  4. webデザイン

    フォトショップでアメコミ風に加工する所要時間たった3分のフィルター活用テクニック。

    フォトショップのフィルターを活用すると、画像を印象をガラっと変えること…

  5. webデザイン

    フォトショップでフワフワ・フサフサな動物の毛を表現するブラシの上手な活用方法。

    フォトショップのブラシを上手に活用するとさまざまな表現が可能になります…

  6. フォトショップ

    photoshopで違和感なくほくろやシミを消す方法。

    photoshopで人物写真のほくろやシミを消したい場合にはコピースタ…

Wordpress日本語テーマのまとめ
photoshop日本語チュートリアル

よく読まれている人気の記事

最近の記事

  1. 「特訓Photoshopプロのテクニック教えます!」という本…
  2. 「いつも締め切りに追われてしまう」そんな人がミッションを成し…
  3. Photoshop CCのメニュー文字やツールバーが異常に小…

思考系のおもろい記事

ブログラ
  1. webデザイン

    「特訓Photoshopプロのテクニック教えます!」という本のWEB版を『無料』…
  2. 3分の話

    柔軟な思考を大切にしたいクリエイター必読の5冊。私の頭をグニャングニャンに柔らか…
  3. webデザイン

    photoshopで仕事をしたい人が身につけておきたい技術や使い方のまとめ。日本…
  4. SEO

    WordPressの使い方に迷ったらまずこの記事をチェック!すごく参考になる秀逸…
  5. フォトショップ

    見ているだけで「Photoshopの実践的な使い方が学べる」日本語解説付き動画の…
PAGE TOP