みなさん、こんにちは。
あなたの探していたアイデアが見つかる
アイデア図鑑「Aiz」です！
「おっ！今回のお客さんは
キレイな写真用意してくれて
テンションあがる！」
超ウキウキ気分で作業開始。
いざ画面に収めてみると、、、
主張したいポイントが見えにくい…
主張したいポイントがたくさんある
上質な素材なのに、
全部を入れようとすると、見にくくなる…
今までに、そんな経験ないでしょうか？
実はコレ、私の実体験。
絶対、同じ境遇の人もいるハズ！
そう思って、今回は、、、
超基本的なテクニックで、
超カンタンに解決できる方法を
独自で編み出したので、
この記事を見てくれてる
デザイン好きなあなただけに
特別にご紹介しちゃいます！
カンタンなのに、
オシャレにできちゃう、良いとこ取り。
最後まで見ない人は、それまで。
見て実践したらレベルアップ間違いなし！
周りのクリエイターと差をつける
絶好のチャンスを、
ぜひ、掴み取ってくださいね！
解決法は「グリッド」を使うこと！
まずは、、、
なぜ、目立ちにくくなってしまうのか
問題点を探ってみましょう！
目立たせたいポイントが
たくさんある写真素材。
だから写真全体を見せたくなる。
だけど、、、
写真を全面に表示させても、
比率を変えていないので、すべてが均等に。
結果、目立たなく見えてしまう。。。
ここで注目してほしいのが、
「比率」を変えてないから
全体が均等に見えること。
当然の話ですが、比率が
50％で表示されているものと、
100％で表示されているもの。
100％の方が見やすいですもんね。
ポイントがたくさんあるから
全面を見せるのではなくて、
そこを、逆転の発想！
主張したいポイント１つ１つの
比率を個別に変えられちゃえば、、、
解決できちゃいませんか？
個別に比率調整できる
役立つテクニックが、今回紹介する
「グリッド」になります！
グリッドを使えば、
主張したいポイントの数だけ
四角形を用意、写真を入れ込んで
1つ1つ拡大できちゃうんですよね。
さてお次は、
このグリッドを使うメリットを
３つお伝えしていきます。
特徴を知ってこそ、
真に扱えたことになりますから、
資料をもとに、一緒に見ていきましょう！
グリッドデザインのメリット3選
メリット① 1つ1つにスポットライトを当てられる
先ほども、説明しましたが
１つ１つ個別にスポットライトを
当てられるのが、何よりも強みです！
元画像の写真では、小さくても
まったくもって、問題なし！
狙った部分にフォーカスできちゃうのが
かなり便利です。
メリット② 型にハマらないレイアウト
四角形をランダムに配置するので
結果的に、、、
型にハマらないオリジナリティ溢れる
仕上がりになります。
ここで、レイアウトの
ちょっとしたコツがあるので
2点ほど、説明させてください！
① 全体像とグリッドを組み合わせる
1つ目のレイアウトのコツは、
全体像と、グリッド
2つを組み合わせることです。
部分的にフォーカスされた
グリッド表現だけだと、
「どこの部分を言ってるんだろう？」と
読み手を混乱させてしまいます。
なので、
はじめに、全体像の画像を入れて、
その周りにグリッドを配置させると
分かりやすくて、伝わりやすいです。
② グリッドは、全体像と同じ場所に配置
地味にこれも重要なことなんですが、
グリッドの配置は、
全体像に関連するモノの
すぐ近くに置いてあげることです。
グリッドを入れ込んでも
理由もなく、ただ配置していては
混乱させる原因になってしまうだけです。
例えば、
ハチミツの近くには、ハチミツを。
ラズベリーの近くは、ラズベリーを。
生地の近くには、原材料の卵を。
このように、
全体像とグリッドで共通する
関連している部分に寄せて配置する
この意識が、見やすさに繋がってきます。
メリット③ 初心者でもカンタン再現！
そして、このグリッドデザイン。
何と言っても、
作るのが、めっちゃカンタンです！
初心者の方には、特に激推しです！
なんでかって言うと、、、
はじめに、四角形を作って配置。
その四角形の中に、
写真を入れ込めば、OKだからです。
かなり基本的な編集方法しか
使っていませんが、アイデアしだいで
プロっぽく仕上がる。
基本の大切さを知ってもらえたら嬉しいです！
グリッドを使ってみました！
さて、今回もしゅーの完全オリジナルで
グリッドを使ったデザインを
3種類作りましたので、ご紹介させてください！
アイデア① ファッション雑誌コーデ一式セール
ポージングがカッコいい女性モデルさん。
「これは使うしかない！」とビビッときたので、
ファッション雑誌風のコンセプトに決定。
コーデ一式のセールを宣伝するページを
イメージして、デザインしていきましたが、
全体を写すと、アイテムが小さくて目立たない…
そこで、グリッドを使って、
アイテムごとに拡大して
何がセール品なのかを主張できました。
こちらのアイデアのコツと言えば、、、
モデルさんも、全身を切り抜いて、
コーデの全体像と、
部分的に主張させたいグリッドを
組み合わせて使う点です。
2つを組み合わせることで、
コーデ全体の雰囲気と、
セール品の素材感が、
同時に伝えられちゃいます！
アイデア② 懐かしのパンケーキ紹介ページ
グリッドデザインは、
メインとなる画像の一部分を
拡大して目立たせる使い方、
だけではありません！
例えば、パンケーキなら、
パンケーキに何が使われているか
原材料の食材を伝えることもできます。
生地に使われている「卵」
仕上げに、上からかける「ハチミツ」
お皿に添えられている「ラズベリー」
どんな材料が使われているのか、を
材料の写真を近くに添えれば、
読み手に伝えることができますよね。
先ほどは、
アーティスティックな表現でしたが、
ポップ調であったかい雰囲気にも
違和感なく馴染んじゃいます。
アイデア③ マウイ島の観光スポットまとめ
ふと、作業の休憩ついでに見ていた
観光地をまとめたサイト。
そこに、マウイ島を紹介した記事が。
行ってみたいなぁ、なんて思って
気づいたら、、、
行った気になって、デザインを作ってました笑
マウイ島の全体地図と、
観光スポットの写真、
その場所を示す目印を、組み合わせれば
場所と雰囲気を、同時に伝えられます。
コツとしては、「距離」が大切！
まず、地図に印をつけてから
印の近くに、観光地の写真を置けば
カンタンに表現できちゃいますよ。
写真などの情報が多くても、
グリッドを使えば、
初心者の方でもまとめやすいと思います。
実際に作ってみよう！
それでは、今回の一緒に作ってみよう！では
こちらのファッション雑誌風のデザインを
解説していきますので、
ぜひ、一緒に手を動かしてみてください！
STEP① 切り抜きを作る
まず、元画像から、
モデルさんだけを
切り抜いていきます。
STEP② 長方形を作って、配置
切り抜きが終わったら、
長方形ツールを使って、
帽子に被るように、
長方形を配置していきます。
STEP③ もう１枚、元画像を入れ込む
ここで、元画像を
もう１枚、先ほど作った
四角形に被さるように配置。
STEP④ クリッピングマスクを設定
レイヤータブにて、
長方形レイヤーの上に、
元画像レイヤーを持ってきて、
「クリッピングマスク」を設定。
クリッピングマスクは、
「option」または「alt」を押しながら
レイヤーの境界線をクリックすると
適用されますよ！
STEP⑤ 画像の、大きさ調整
元画像が、無事に入れ込めたら
大きさの調整をしてあげます。
今回は、ベレー帽をピックアップです！
STEP⑥ ジャケットとパンツを作る
同じように、
ジャケットと、パンツも作りましょう！
まずは、元画像を入れ込む図形作りから。
STEP⑦ 切り抜きを、最前面に配置
ベレー帽と同じように、
元画像を入れ込んでから、
大きさを調整。
最後に、
切り抜きを最前面に持ってくれば
完成です！意外とカンタンですよね！
【Canva プロ版】切り抜きは「背景リムーバ」
もし、Canvaのプロ版をお持ちの方は
切り抜きが、超カンタンにできちゃいます！
だって「背景リムーバ」を押すだけですから！
Canvaを無料版でやられている人も
多いかと思われますが、
切り抜きは他の無料サイトでもできます。
「GIMP」とかが有名なので、
もしご興味がある方は、ググってください。
Canva① 写真をトリミング
Canvaでは、もっとカンタンに
サイズ調整できちゃいます。
画像を選択すると、
4辺に白い棒状のものが表示されます。
これをクリックして、引っ張ると…
画像がトリミングされます！
超カンタンな、便利機能ですよね！
Canva② 切り抜きモードで、大きさ調整
Canvaでは、トリミングした後も
大きさを自由に変えれちゃいます。
画像をダブルクリックすると、
「切り抜きモード」が展開。
今度は、元画像の
四隅を引っ張って、大きさを調整。
ベレー帽がよく映るように。
同じように、
ジャケットと、パンツも
トリミングしていきましょう。
Canva③ 作った拡大画像を、切り抜きの下に
最後に、
作った拡大画像、3種類を
切り抜きの下に配置すれば、完成です！
お疲れ様でした！
今回も、完走おめでとうございます！！
見た目はオシャレなのに、
案外、カンタンに作れちゃう
アイデアだったんじゃないでしょうか？
自分も思いついた時は、
「これは皆さんにお伝えしなきゃ！」と
ある種の使命感が芽生えてました笑
無事に仕上げられて、自分も大満足です。
このアイデアで、少しでも
お悩みの解決や、デザインの方向性が
決まってくれたら、デザイナー冥利に尽きますね。
Canva限定ですが、
今回と同じような編集方法で、
イラストが作れちゃいます！
ぜひ、あわせてご覧ください↓
デザインの無料アドバイス、やってます。
ここまで詳しく解説してきましたが、
実践するのはあなた自身。
時には、つまずいたり、
分からなくなる事もありますよね。
でも、デザイン詳しい人なんて
周りにいないし、どうしたら…
そんなあなたに吉報です！
現在、自分は「公式LINE」を運営し、
このたび、LINEの友達登録者限定で、
デザインの無料相談を開始しました！
現役デザイナーに直接相談できるチャンス！
ぜひ、活用してみてくださいね↓
コメント