サムネイルは「デザインの基礎」の一つ
「揃える」
ことを行うだけでうまくまとまります。
え?それだけ?と思うかもしれませんが実は大勢の人ができていない基本の一つです。
では早速やっていきましょう!
スポンサーリンク
サムネイルの基本「揃える」とは?
揃えるなんて簡単!!
なんて僕も最初は思っていたのですが、
これがまた意外と難しいもので。。。
揃える部分って思っているよりたくさんあるんです。
早速みながらデザインしていきましょう!
サムネイルデザインの基本 おおまかなレイアウトを決める
![](https://blogdesign-lab.com/wp-content/uploads/2021/07/2021-07-13-10.30.34-1024x535.jpg.webp)
まずざっくりとしたレイアウトを上の画像の様に決めていきます。
今回は
「メイン」「サブ」「ロゴ」「イラスト」を使って作っていきます!
サムネイルデザインの基本 揃えていく
使う素材が決まったところで、早速揃えていきます!
テキストを揃える
まずはテキストから揃えていきます。
テキストは「左揃え」で組んでいきます。
![](https://blogdesign-lab.com/wp-content/uploads/2021/07/2021-07-13-10.37.51-1024x535.jpg.webp)
これは簡単なのでサクっとそろえて次にいきましょう!
テキスト上下の空間を揃える
![](https://blogdesign-lab.com/wp-content/uploads/2021/07/2021-07-13-10.37.16-1024x537.jpg.webp)
上下の余白のスペースを揃えていきます。
![](https://blogdesign-lab.com/wp-content/uploads/2021/07/2021-07-13-10.38.36-1024x535.jpg.webp)
これだけでだいぶデザインとしてまとまってきましたね!
この調子でどんどん揃えていきましょう!
余白を揃えていく
![](https://blogdesign-lab.com/wp-content/uploads/2021/07/2021-07-13-10.44.30-1024x536.jpg.webp)
文字の左右の余白を揃えていきます!
![](https://blogdesign-lab.com/wp-content/uploads/2021/07/2021-07-13-10.47.14-1024x537.jpg.webp)
どうでしょうか!これで整いましたね!
デザインの比較
最初のデザインと比較してみましょうか!
![](https://blogdesign-lab.com/wp-content/uploads/2021/07/2021-07-13-10.51.51-1024x267.jpg.webp)
どうみても左の方が揃っていて綺麗ですよね!
サムネイルデザインの基本 完成!
![](https://blogdesign-lab.com/wp-content/uploads/2021/07/00-1-1024x538.jpg.webp)
さっぱりしたデザインですが、しっかり揃えるところは揃っていますので
綺麗なデザインになっていますね!
デザインの基礎はこのブログにたくさんありますので
少しでもデザインに興味がでてきたらそのほかの記事も見てみてくださいね!
スポンサーリンク