webデザイン

ヘッダーデザインの役割に応じた文章表現の考え方と構成方法。Photoshop編

魅せる伝えるヘッダーデザインを作成する5つの工程の4番目、ここでは④ 文章の表現について解説します。

デザインにおける活字は視覚的にテーマ&コンセプトを伝える重要な役割があります、可読性や視認性を高めるために適切に配列してグラフィカルに整えよう。

  • ① 基調と概念
  • ② 構成要素の配置
  • ③ 色彩の統一
  • ④ 文章の表現
  • ⑤ 細部の作り込み

伝わりにくいテキスト

↑ パっと見ではキャッチコピーの意味が汲み取りにくいですね・・

④ 文章の表現

テンプレにはめ込んでみるとなんだか少し説明っぽく感じてしまいます

テンプレ

① 基調と概念の工程で「おとなしい大人になれない、おとなげない大人達へ」というキャッチフレーズを考えてみましたが、《おとなげない》の言葉ひとつでも《おとなしくない》《やんちゃ》などの意味合いも含まれるので、、

ここは「おとなげない大人達」と、よりキャッチーな響きで行ってみます。

テンプレ

少し厚ぼったく感じるのでスタイリッシュ感のある細身の書体に変更し、《おとなげない ⇔ 大人》双方の言葉に含まれる対比の意味を表現するため大きさを変えてみよう。

細身の書体

さらに対比を強調するために書体をずらし、枠に収めることで視覚的に《整列できないおとなげなさ ⇔ 規律ある正統な大人》といった印象を与えてみると・・

うんっ、それっぽくなりましたね♪

文章表現完成

ここでは文章表現の考え方と構成方法について解説しましたが、活字の意味を理解したうえで表現を加えていくことで、視覚的に基調や概念を伝えることが可能になっていきます

テンプレ文章表現

続いて、ヘッダーデザインを作成する最後の工程 ⑤ 細部の作り込み細部(ディティール)へのこだわりがWEBデザインに差をつける。】に進んでいきます。

基調と概念構成要素の配置色彩の統一文章の表現細部の作り込み
スリームデザインの無料メールマガジン

ピックアップ記事

  1. 思わずクリックしてしまう画像でアクセスアップ!2番目に簡単なブログのアイキャッチ…
  2. 必読!安易に起業ブームに乗っかる前に…絶対に読んでおきたい【おすすめのビジネス書…
  3. 柔軟な思考を大切にしたいクリエイター必読の5冊。私の頭をグニャングニャンに柔らか…
  4. WordPress日本語有料テーマの決定版っ!TCDシリーズのまとめ
  5. WordPressの使い方に迷ったらまずこの記事をチェック!すごく参考になる秀逸…

関連記事

  1. webデザイン

    初心者でも60秒でマスターできるPhotoshopで角丸の画像を作る方法

    WEBデザインなどをしていると画像の角を丸くしたいケースはよくあります…

  2. キュレーション

    インスピレーションを掻き乱されるほどのPhotoshop超絶テクニック!Youtube動画12選。

    デザイナーやクリエイターなら誰しも、自分の想像を超えるような作品を生み…

  3. フォトショップ

    photoshopでしわ取りするのは案外簡単だよ。

    しわ取りするのは案外簡単、というより最近のphotoshopはすごい!…

  4. フォトショップ

    細部にこだわってポスターデザインを仕上げるためのディティールを詰めるコツ

    ディティールを詰める技術を覚える男性の怪しさが増すような画像を重ね…

Wordpress日本語テーマのまとめ
photoshop日本語チュートリアル

よく読まれている人気の記事

最近の記事

  1. 「特訓Photoshopプロのテクニック教えます!」という本…
  2. 「いつも締め切りに追われてしまう」そんな人がミッションを成し…
  3. Photoshop CCのメニュー文字やツールバーが異常に小…

思考系のおもろい記事

ブログラ
  1. 3分の話

    柔軟な思考を大切にしたいクリエイター必読の5冊。私の頭をグニャングニャンに柔らか…
  2. キュレーション

    必読!安易に起業ブームに乗っかる前に…絶対に読んでおきたい【おすすめのビジネス書…
  3. SNS

    思わずクリックしてしまう画像でアクセスアップ!2番目に簡単なブログのアイキャッチ…
  4. webデザイン

    photoshopで仕事をしたい人が身につけておきたい技術や使い方のまとめ。日本…
  5. コピーライティング

    「ブロガーがこんなの読んだら反則レベルでしょっ、、」と思うくらい文章力が上がりそ…
PAGE TOP