CREATOR BLOG

駆け出しのデザイナー必見!デザイン基礎知識 良記事まとめ

2014/07/24
あんな
  • このエントリーをはてなブックマークに追加

こんにちは。あんなです。

頭文字Dにハマりすぎて、なんとかブログのネタに
結びつけられないかと考えたのですが・・・駄目でした><

今回はデザインを学ぶ上で参考になった記事をまとめました!
駆け出しのデザイナーさんや、デザインの基礎を学びたい方向けです!では早速~♪

もくじ

  1. フォント
  2. カラー
  3. レイアウト
  4. その他

フォント(文字まわり)

求められるデザインによって、使用するフォントも変わってきますよね!
適切なフォントの選び方と、文字調整について詳しくまとめられた記事をご紹介します。

▼フォント選びに困ったら!

フォントの基本的な選び方 (Arch
各フォントの特徴と、そのフォントが与える印象をわかりやすい図とともに解説しています!
フォントの選択に迷っている人もこの記事を読めば絞れるはず!

▼読みやすい行間・字間って?

文章の作り方 (伝わるデザイン
読みやすい文章にするための適切な行間・文字間について書かれています。
このサイトはプレゼン資料に役立つデザインテクニックを紹介しているんですが、
デザインの現場でも使えるテクニックが満載です!

▼カーニング+タイポグラフィー

【Webデザイナー(私)によるタイポグラフィーレイアウトの注意書き】 (Webデザインレシピ
文字のカーニングや、いろんなレイアウトのタイポグラフィーを実例とともにまとめています。
こちらのブログはどの記事も解説がすごく丁寧でわかりやすいです!

カラー

▼色が与える印象について

12色の色が与える印象について。配色に困った時のいろいろ。 (handywebdesign
色が与える心理的作用と、配色する際のポイントについてまとめられています!
色相・彩度・明度といった基礎から解説して下さっているので、予備知識がなくても大丈夫!

▼配色が苦手!サブカラーがなかなか決まらない!そんな方は・・・

「色相環」とか「トーン」ってどう使うの?配色のコツは「ジャッドの色彩調和論」 (WebNAUT
色彩学者Deane B. Juddが提案した色彩調和論をもとに配色について書かれた記事です。
記事の解説に使われている図が美しい・・・。そしてわかりやすいです!
過去記事(【前編】「色彩の芸術家」に近づくための配色理論(基礎知識&色彩心理))こちらもすごく参考になります!

▼配色に迷ったときはこの技法を試しちゃおう!

配色に悩んだときに、きっと役立つ7つの配色技法【基本】Webクリエイターズマニュアル
配色にもいろんな技法がある!その技法の特徴と効果についてまとめています。
感覚的に色を選ぶのではなく、このような技法をもとに考えるとより効果的な配色ができそうですね!
このブログの「カラーデザインの基本。トーンを理解する!」もオススメです!

レイアウト

▼この4点はしっかりおさえよう!レイアウトの基本!

レイアウト (伝わるデザイン
レイアウトの基本である「揃える」「まとめる」「余白を取る」「コントラスト」について書かれています。
この4つを徹底することでデザインの印象は大きくかわるはず!

▼とっても大事な余白の話

ホワイトスペースを使ったウェブデザインの考え方 (vanillate_design
余白は単なる空きスペースではありません。大事な構成要素の一つ!
実例とともに余白のあたえる印象について解説しています。

▼デザインの目的別レイアウト

これで完璧。目的別Webデザイン・レイアウト8選 (Liskul
そのサイトはブランドイメージを訴求したいのか、はたまた、商品の売上を伸ばすことなのか・・・
サイトを目的別にわけ、そこから見えてきた共通点から抑えるべきポイントをまとめています。

その他

カテゴリにわけることができなかったものの、個人的にためになった記事。

▼角丸使うときの注意点

デザイン時に注意したい角丸の使いかた (Design Color
たかが角丸・・・されど角丸!角丸のR半径で、デザインの印象がかわります!

▼ヴィジュアル要素を作るときに悩んだら!

ヴィジュアル要素の表現方法 (Arch
間接的な表現を修辞技法をもとにまとめています。ヴィジュアルを作る際、制作のヒントになるはず!

 

いかがでしょうか??
同じ業界、職種の方がWEB上でいろんな知識を共有して下さっているのは本当にありがたいですね!
私もすごくお世話になっています><ありがとうございます!
めいっぱい活用させていただいて、さらなるステップアップを目指しましょうー♪

それではまた!

Recent Entry

CSSの単位まとめ pxからvm/vh/vmin/vmaxまで

レスポンシブHTMLメールを作ってみての感想

CSSのリファクタリングでした5つのこと

大人が読んでも頭を使う絵本の紹介

サイト内にうまくInstagramを取り入れてるサイト11選

Category

Archive