デザインをする時に、見出しが弱かったり、要素間の境界線がわかりにくい時ってありませんか?
今回紹介する線は、文字を強調したり、要素同士の区切りに使用することができます。また、ちょっとしたあしらいとして使用することもできます。
線は、視線誘導や情報の整理に役立つ、大事なデザイン要素です。
線の基本的な種類と特徴
1.実線

【使い所】区切り線、ボタンの枠、タイトル下の装飾など
【印象】シンプル、高級感
最も一般的な罫線。
さりげないアクセントとして活用できます。
シンプルなので、なんでも使えるのがいいですね。
-
シンプルなので邪魔にならず、情報の区切りに適している
-
見出しや文字が目立ってないときに下線を引くことによって、強調することができる
-
視線誘導として使用できる
-
角度を変えると勢いがつく(斜線)
-
先を丸くすると柔らかくなる
※太さや多用しすぎに注意しましょう。
2.点線

【使い所】補足情報の枠、ゆるい区切り、メンフィス
【印象】柔らかい、子供っぽさ、POP
ドット柄の線。
実線よりも優しい強調ができる。
あしらいに使うとメンフィスっぽさが出て、レトロ感を演出できます。ビビッドカラーを使うと尚良し!
-
実線よりも優しく、抜け感がある。
-
抑えめの強調に使える。
-
小さいドットは、さりげなく優しい印象。
-
大きいドットは、POP感や強調が強くなる。
※ドットのサイズによって与える印象が変わるので注意。
3.破線

【使い所】注意書き、囲み枠など
【印象】カジュアル、柔軟、注意
使い方が難しいですが、矢印や放射状など装飾のアクセントにするとおしゃれになります。
実線よりも目立ちすぎずに情報を強調できることが強みです。
-
注意や変化を与える時に効果的
-
切り取り線として使える。
-
点の長さをまばらにし、放射状にすると太陽光線ができる。
-
動きが見える。
-
実線よりも重すぎないため、段間に配置するとおしゃれ。
※細すぎると見辛い。
※線の太さは均一にしましょう。
4.二重線

【使い所】見出し、重要な枠
【印象】リッチ、高級感、おしゃれ
線が2つ並ぶので、強い強調ができます。
上の線を太くすると子持ち罫になり、枠として使うとおしゃれです。
-
装飾性が高く、リッチな印象を与える。
-
カフェやナチュラルなデザインに使える。
-
実線よりも区切り感が強い。
-
違う色を使うとPOPになる。
※線と線の間隔に注意しましょう。
5.波線

【使い所】水系のあしらい、子供向けのバナー
【印象】柔らかい、POP、可愛い
角がないので、柔らかく可愛らしい線です。
文字の強調に使うよりは、区切りやあしらいに使う印象です。
飲食の可愛らしい雑誌などで見られました。
-
二重線+波線で柔らかい印象だが、区切り感は強くできる。
-
波線を手書きにすると、さらに可愛らしさと親しみやすさが増す。
-
丸みを帯びた線なので、女性向けのデザインに使える。
※ウェーブの縦と横幅に気をつけましょう。
線を使うときのコツ
線はさまざまな場面で使用することができますが、使い方によっては、情報を伝える邪魔になってしまうので注意が必要です。
以下のポイントを意識すると、線の効果を引き出すことができます。
● 間隔(マージン)をしっかり取る
線の上下が詰まりすぎていると、かえって読みにくくなります。
余白をしっかり取ることで、線が効果的に“区切り”として機能します。
● 情報の階層に合わせて線の強さを変える
重要な要素:太い実線や二重線
補足的な要素:細めの破線や点線
→ 情報の優先順位を視覚的に伝えることができます。
● 統一感を意識する
デザイン全体で線の種類を使い分けすぎると、統一感がなくなります。
→ 1つのデザイン内で2~3種類程度に絞るのが◎。
線を使う上で気をつけること
線を使う上で気をつけたいことは、下記の通りです。
-
あちこちに波線・点線を多用してゴチャついている
-
色がバラバラで視線が散る
-
線の太さが不均一で統一感がない
-
枠に使った線が細すぎて見えない
まとめ
よく使う線をご紹介させていただきました!
まとめると、
-
情報を区切り、見やすく整理できる
-
見出しやタイトルをぐっと引き立てる
-
あしらいとして使うことで、より洗練されたデザインになる
-
線のサイズや太さに気をつける
今回ご紹介した線以外にも、装飾イラストをリピートした飾り罫やユニークな形のラインなど、表現の幅は無限にあります。
「飾り罫 種類」や「線 あしらい デザイン」などで検索してみると、新しい発見があるかもしれません。
気になる方は調べてみてください。
情報が分かりにくい時やあしらいに困っている時にぜひ線を使ってみてください!
最後まで読んでいただきありがとうございます。