こんにちは。イーネクスト渋谷のHです🌷
イーネクスト渋谷にて、デザインプログラムの運営やAdobeソフトの指導を行っています。
前職ではWebデザイナーをしていました👀
今回から全4回に分けて、今日からすぐに使える「デザインの基本原則」についてご紹介します。
私もWebデザインを始めたばかりの新人時代、このポイントを意識しながらデザインしていました💭ちょっとしたコツを押さえるだけで、資料や制作物の見栄えがぐんと良くなります✨
ぜひ、今日から！試してみてくださいね💡
📍デザインの基本原則とは？
デザインの基本原則には、「近接」「整列」「反復」「対比」があります。
簡単に説明すると、
🔗近接：関連する情報をまとめて配置する
🔗整列：要素の位置を揃えて統一感を持たせる
🔗反復：同じデザイン要素を繰り返し使うことで統一感を出す
🔗対比：色やフォントの違いを活かしてメリハリをつける
今日はこの中から「近接」について詳しく説明します。
📍近接とは？
「近接」とは、関連する情報を近づけてまとめることです。
例えば、チラシを想像してみてください。画像や商品名と値段がバラバラに配置されていると、どの値段がどの商品に対応しているのかわかりにくいですよね（例A）
でも、商品名と値段をセットにして近づけると、一目でわかりやすくなります（例B）
📍近接を意識すると何がいいの？
✅情報が整理されて見やすくなる
✅どこを見ればいいのかが直感的にわかる
✅読み手のストレスが減る などなど
たとえば、商品一覧のデザインを考えてみましょう。
例C | 改善が必要
このように画像とテキストがバラバラに配置されていると、情報が散らばっていて読みづらくなります。どのように改善できるでしょうか。
例D | 改善後
例Dでは、関連する情報同士を近づけてから並べてみました。
例Cと比較しても、ぐんと視線の動きがスムーズになったはずです。
📍すぐに使える！「近接」のポイント
✅関連する要素はグループ化する
タイトルと説明文、見出しと本文などは近づける
✅不要なスペースをなくす
逆に、関係のない要素は適度に間をあけることで区別する
✅揃えて配置するとより見やすい
近接と整列*を組み合わせると、さらに洗練されたデザインになる
今日紹介した「近接」を意識して、ぜひ身の回りの資料やデザインをもっと見やすくしてみてください😺
次回は、要素の位置を揃えて統一感を持たせる「整列」について紹介します！
ぜひお楽しみに！
—-
イーネクスト渋谷では、いつでも見学・体験のご予約を承っております。
「就労移行支援事業所を見学してみたい」
「働くことに悩みがあるので聞いてほしい」
「どんなサポートを受けることができるのか知りたい」など、
どんなことでも結構ですのでお気軽にご連絡ください。
🍃イーネクスト渋谷
TEL： 03-6383-3455
Email： enext-shb@thomasgroup.info
どうぞよろしくお願いいたします。
—-