https://ameblo.jp/study-design/ 純度100％、デザインの勉強用ノート１つの記事を何度も上書きして更新しています。修正カ所やアドバイスなど、お気軽にコメント下さい。 ja

＜使用する効果＞ - Photoshop

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

↓

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

↓

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


参考サイトへリンク ]]> https://ameblo.jp/study-design/entry-10716324384.html Tue, 23 Nov 2010 23:15:15 +0900

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

＜上レイヤー＞
保存した選択範囲を塗りつぶし。
グラデーションオーバーレイの「クロム」（逆方向）＋境界線

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

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

参考サイトへリンク






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

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

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

参考サイトへリンク







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

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

参考サイトへリンク





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

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

参考サイトへリンク





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

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

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

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

参考サイトへリンク ]]> https://ameblo.jp/study-design/entry-10649848714.html Thu, 16 Sep 2010 04:43:38 +0900
リンク先に指定したい部分に＜a name="1" id="1"＞＜/a＞と記述する。
（タグの中は空でOK。name、idは好きなもので良い）

他のページからのリンクは＜a href="price.html#1"＞と記述する。 ]]> https://ameblo.jp/study-design/entry-10643754375.html Thu, 09 Sep 2010 18:21:09 +0900 ヘルベチカ ~世界を魅了する書 [DVD]/マイケル・ビェルート,ネヴィル・ブロディ,デヴィッド・カーソン

￥4,935
Amazon.co.jp


＜印象に残ったことば＞


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





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





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





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

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

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

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

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

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

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

　うまく使うとすばらしい出来になる。」 ]]> https://ameblo.jp/study-design/entry-10633239763.html Sun, 29 Aug 2010 10:46:48 +0900 のびやか


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




＜コメントから＞

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



原文へリンク ]]> https://ameblo.jp/study-design/entry-10616669482.html Wed, 11 Aug 2010 19:13:57 +0900 スキルについて苦言。


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


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

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




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

＊我流さん＝ナスくん「ナストマくん公式サイト（β版）」 ]]> https://ameblo.jp/study-design/entry-10612481110.html Sat, 07 Aug 2010 10:07:42 +0900 依頼内容をよく確認する

＊依頼内容

＊広告主に関する情報

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

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

＊媒体入稿規定（ガイドライン）…バナーを載せる先の規定

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

＊画像素材の有無・加工や制作の要／不要



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


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



バナーデザインの基本


（１）アイキャッチ・アテンション

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


（２）訴求優先順位に基づいた要素ごとのメリハリ


（３）レイアウトのバランス

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




制作の手順


（１）キャンバスに要素をすべて入れ込む


（２）訴求優先順位に応じて大まかなレイアウトを作る

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


（３）デザインを入れる

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



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


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

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



つまり…

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

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

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

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




最後に大事なこと


身の回りの「デザイン」を数多く見てみること。
ただ眺めるのではなく、色・大きさ・書体・余白の取り方など
デザインの構成要素に注目しながら見ることが大切。
それを繰り返すことで、優れたデザインがなぜ優れているのか分かるようになる。
日々、注意深く観察することが大切！ ]]> https://ameblo.jp/study-design/entry-10612112278.html Fri, 06 Aug 2010 21:34:28 +0900 できる人とできない人の違い　（要約）

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



できる人

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



できない人

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




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




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

＊我流さん＝ナスくん「ナストマくん公式サイト（β版）」 ]]> https://ameblo.jp/study-design/entry-10611889874.html Fri, 06 Aug 2010 18:14:42 +0900 　高級感

＜古典的な雰囲気＞

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（ニコラ・コシャン） ]]> https://ameblo.jp/study-design/entry-10610694456.html Thu, 05 Aug 2010 11:34:04 +0900 面白いことに目の前に座っているモデルの顔よりも
自分の顔によく似た仕上がりになる。


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

本来の意味を変えずにメッセージや機能を
造形へと翻訳するデザイン作業の行程で、
「観察」はとくに重要である。 ]]> https://ameblo.jp/study-design/entry-10609426761.html Wed, 04 Aug 2010 00:56:10 +0900