$hrmのおべんきょノート

<使用する効果> - Photoshop

●ドロップシャドウ…黒、不透明度60%
●光彩(外側)…深緑
●ベベルとエンボス…ハイライト(オレンジ)、シャドウ(濃赤紫)
●輪郭線…深緑

↓

別のレイヤーに木目のクリッピングマスクを作成。

↓

選択範囲を少し縮小し、別レイヤーに白の塗りつぶしを作成。
それに少し「ぼかし(ガウス)」をかける。
不透明度を40%にする。
下半分を硬さ80%の消しゴムツールで消す。


参考サイトへリンク
$hrmのおべんきょノート

文字マスクツールで文字を書く。
選択範囲をアルファチャンネルに保存。
レイヤーを2枚作成。

<上レイヤー>
保存した選択範囲を塗りつぶし。
グラデーションオーバーレイの「クロム」(逆方向)+境界線

<下レイヤー>
保存した選択範囲を塗りつぶし。
グラデーションオーバーレイのスタイル「反射」(逆方向)+境界線

好みでベベルとエンボスも適用。

参考サイトへリンク




$hrmのおべんきょノート

文字マスクツールで文字を書く。
選択範囲を塗りつぶし。
レイヤーをコピーして2枚にする。

<文字レイヤー>
フィルタメニューの「描画」→「照明効果」、光源タイプ「全指向性」、光源を少し上へ。

<影レイヤー>
自由変形で上辺を下方向へドラッグし、垂直方向へ反転させる。
編集メニューの「変形」→「遠近法」、下角のハンドルを横方向にドラッグ。
グラデーションオーバーレイの「「描画色から透明に」(逆方向)
不透明度35%、塗りの不透明度を0%に。

参考サイトへリンク





$hrmのおべんきょノート

文字マスクツールで文字を書く。
選択範囲をアルファチャンネルに保存。
(失敗した場合を考えてアルファチャンネルをコピーしておく)

フィルタメニューの「ノイズを加える…」→「ガウス配布」にチェックしノイズを加える。
フィルタメニューの「表現手法」→「拡散…」比較(明)にチェック。
選択を解除し、もう一度フィルタメニュー→「拡散」
イメージメニューの「モード」→「2階調化…」
  *しきい値の数値が小さいと最終的に色が入る部分が大きくなる。
編集メニューの「塗りつぶし…」で色をつける。

参考サイトへリンク



$hrmのおべんきょノート

文字マスクツールで文字を書く。
選択範囲を50%グレーで塗りつぶし。

選択範囲メニューの「選択範囲を変更」→「縮小…」で境界線を2ピクセル縮小。
選択範囲メニューの「選択範囲を変更」→「境界をぼかす…」で境界線を2ピクセルぼかす。
フィルタメニューの「スケッチ」→「プラスター…」
フィルタメニューの「アーティステック」→「ラップ…」
イメージメニューの「色調補正」でコントラストを強める。
イメージメニューの「色調補正」→「トーンカーブ…」
  *金属的な感じにしたい場合は、山と谷を2~3個作る。
イメージメニューの「色調補正」→「色相・彩度…」
レイヤーメニューの「効果」→「ドロップシャドウ…」+「ベベルとエンボス」(内側)

参考サイトへリンク



$hrmのおべんきょノート

文字をカンバスの下部に配置。
レイヤーを複製し、1つは非表示にしておく。

表示している文字にエンボスをかけ、フチに明暗をつける。
ラスタライズし、自由変形で上辺の狭い台形状にする。

移動ツールで、option(Alt)+↑キーで複製を繰り返し、高さを作る。
その後、複製したレイヤーは結合しておく。
結合したオブジェクトを自由変形で、下辺の狭い台形状にし、飛び出る感じをつける。

始めに非表示にしておいた文字を、作ったオブジェクトの上に配置して変形などの調整をする。

参考サイトへリンク
<ページ内のある部分へのリンク方法>

リンク先に指定したい部分に<a name="1" id="1"></a>と記述する。
(タグの中は空でOK。name、idは好きなもので良い)

他のページからのリンクは<a href="price.html#1">と記述する。
ヘルベチカ ~世界を魅了する書 [DVD]/マイケル・ビェルート,ネヴィル・ブロディ,デヴィッド・カーソン

¥4,935
Amazon.co.jp


<印象に残ったことば>


「イメージを植え付けるのだから、デザイナーの責任は重い。」


クローバー


「デザイナーの人生は闘い。醜さとの闘いだ。
 
 私たちは視覚的に美しくないものを、デザインで治療しようとするんだ。」


クローバー


「文字は黒。文字間は白。
 
 タイポグラフィとは、白い部分のことだ。」


クローバー


「ノイエ・ハース・グロテスクやヘルベチカを語る時は

 ポジとネガがどのように作用し合うかが全てと言えるだろう。

 図と地の関係だ。文字間や文字の"ふところ"の形で、黒いインキの間の部分だ。

 スイス人は背景に注意を払う。

 空間によって文字がしっかり固定されると考える。

 何も動いたりしない。がっちり固まっている。

 文字は曲がったりしない。しっかりした鋳型の中に固定されている。

 うまく使うとすばらしい出来になる。」
のびやか


作品の善し悪しを決定するときの最近の僕の基準、「のびやか」かどうか?
 
思想もカタチも色彩も配置も。
 
のびやかとは無意識なのに無軌道でなく、意図せずとも信念が潜んでいるような、
自由でしなやかな状態。
 
シャープで緻密なデザインをやるときほど、必要な感覚かもしれない。




<コメントから>

これは、自身への戒めでもあるんです。
 
頭で色々考えて、作り始めた時の「ここいいな」っていう動機の部分が
おろそかになってしまうとたいてい上手くいかないのです。
 
自分で意識せずとも、のびやかな姿勢で取り組めれば、出来上がったものも、
のびやかな、魅力あるものになるので、自身への戒めも込めて。



原文へリンク
アメーバスキルについて苦言。


日々積み重ねた物しか残りません。
授業についていけたかどうかなんて大した問題じゃないです。
できるようになるかどうかです。
復習して何度も試して、自分の手と目と頭が自然と動くようになって初めて「スキル」です。


1回やって出来なかったら10回、
10回やって出来なかったら100回。

イチローや松井ですら素振しない日は無いんですよ。




*会員限定のSNSの日記のため、リンクは省略しました。

*我流さん=ナスくん「ナストマくん公式サイト(β版)」
依頼内容をよく確認する

*依頼内容

*広告主に関する情報

*ランディングページ…バナーをクリックした際のリンク先のページのこと
           バナーの内容と合っているかどうか(親和性)

*過去クリエイティブなどの参考情報

*媒体入稿規定(ガイドライン)…バナーを載せる先の規定

*構成案…コピー、ヴィジュアル要素と大まかなレイアウト

*画像素材の有無・加工や制作の要/不要



デザインのテイストや訴求優先順位などは、明示されていない場合も確認すること。


Point 訴求優先順位とは
 要素の中で、何を一番伝えたいのか。伝えたいことの重要さの順位。



バナーデザインの基本


(1)アイキャッチ・アテンション

    ユーザーの視線を誘引し、興味を喚起すること


(2)訴求優先順位に基づいた要素ごとのメリハリ


(3)レイアウトのバランス

    見やすく読みやすく情報がスムーズに伝わること




制作の手順


(1)キャンバスに要素をすべて入れ込む


(2)訴求優先順位に応じて大まかなレイアウトを作る

   優先順位の高いものは目立つように、
   低いものでも最低限判別できるように整えるのがポイント


(3)デザインを入れる

   あくまで要件にそった、クリックしたくなるようなデザインにする



モバイルバナー特有のポイント


*PCバナーに比べてサイズが小さいため、いかに端的に伝えるかが重要!

*PCバナーに比べてファイル容量が小さいため、規定に沿って書き出した際の再現性を意識する。



つまり…

*写真画像やグラデーションは不向き

*ディテールの凝り方によっては無駄になってしまう

*小さな文字は可読性の確保が必須

*ドット補正によって視認性を上げる




最後に大事なこと


身の回りの「デザイン」を数多く見てみること。
ただ眺めるのではなく、色・大きさ・書体・余白の取り方など
デザインの構成要素に注目しながら見ることが大切
。
それを繰り返すことで、優れたデザインがなぜ優れているのか分かるようになる。
日々、注意深く観察することが大切!
アメーバできる人とできない人の違い (要約)

注:人格についてではなく、あくまで「作業をする」場面での話。



てんとうむしできる人

・どうやったらそれを達成できるかの方法をまず考える
・「大胆かつ繊細」
  →大きな事を取り組もうとする時に、下準備が如何に大事かを知ってるかどうか。
   根回しをしっかりできるか。



てんとうむしできない人

・なぜ達成できないのかの理由を考える
・どうやったら回避できるかの方法を模索する
・「臆病かつ大雑把」
  →大事な事を後回しにしたり、下準備もおろそかになり、成功する物も成功しない。




 「なんとかなる」の楽観性   「なんとかする」の責任感




*会員限定のSNSの日記のため、リンクは省略しました。

*我流さん=ナスくん「ナストマくん公式サイト(β版)」
アメーバ 高級感

<古典的な雰囲気>

Century Old Style (センチュリーオールドスタイル)

Times Roman (タイムズローマン)

Trajan(トレイジャン)

Stemple Schneidler(ステンペルシュナイドラー)

Optima nova (オプティマノバ)

Gill Sans (ギルサン)

Augustea Open(アウグステア・オープン)

Waters Titling(ウォーターズ・タイトリング)

Palatino nova Imperial(パラティノ・ノバ・インペリアル)

Palatino nova Titling(パラティノ・ノバ・タイトリング)


<繊細で洗練された雰囲気> 銅版彫刻系

Palace Script(パレス・スクリプト)

Chevalier(シュバリエ)

Copperplate Gothic(カッパープレート・ゴシック)

Shelley Script(シェリー・スクリプト)

Bickham Script)ビッカム・スクリプト)

Engravers(エングレイバーズ)Linoscript(ライノスクリプト)

ITC Redonda(れどんだ)

Cochin(コシャン)

Nicolas Cochin(ニコラ・コシャン)
モデル観察が不足した初心者のスケッチは
面白いことに目の前に座っているモデルの顔よりも
自分の顔によく似た仕上がりになる。


人間は観察を怠るとはじめから良く知っている形や
考え方にとらわれて、表現すべきものの姿を曲げてしまうようだ。
 

本来の意味を変えずにメッセージや機能を
造形へと翻訳するデザイン作業の行程で、
「観察」はとくに重要である。