NORI-BEN

WEBデザインデザイン・イラストなど。エンジニアさん向けにphotoshop解説とかちょこちょこしてます。

それとなく三角形のパターンが作れる便利なpsdを用意しました。

近頃よく見るこの三角形模様。

三角形の単純なパターンですが、

それぞれの色ごとに調整するのは面倒。ラフの時点で、ざっくりと雰囲気をつかめるようになれば楽なのにな!

 

ということでつくりました。

psdのDLは以下からドウゾ。クレジット必要なし、パーソナルでもコマーシャルでも使ってください。

 https://app.box.com/s/tiv1ljtzjdqm87farff4

 

 

使い方

①DLしたPSDを編集>パターンを定義 で、パターンとして使えるようにしてあげてください。

②色を引いたレイヤーにレイヤースタイル>パターンオーバーレイで、①のパターンを適応

 

------

②では、通常以外にもスクリーンなどのいろんな描画スタイルを選べるので適当に遊んでみましょう。

また、

 

内容の構成と編集

PSD内に、5色の三角形が含まれています。

明るい色3色、暗い色2色+ベースカラー(三角形を置いていないスペース)をうっすらと配置しています。

 

明るい色は太陽の光をイメージして黄色味がかっています。

暗い色は影の色、濃い紫をうっすら入れています。

 f:id:franxx00:20131120175207j:plain

 

大胆に色を変えてみても意外といい感じになるのでやってみてください!

 

また、パスデータで配置してあるので、色味や透明度の具合など調整できます。

下にベースカラーを引きながら目で調整しましょー

 

小さい三角がいい!横長の三角がいい!なども簡単

 

三角のサイズをかえたい!

①1~5のレイヤーを全部選択して、拡大縮小

※この時、環境設定>一般>ベクトルツールと変形をピクセルグリッドにスナップにチェックがはいってないと境界線がボケてシームレスにならないので注意!(ctrl+kで一発ででる)

②alt+i > r でトリミング 

③再度パターンを定義する

 

そんな感じです。1つパターンを持っておくことで、

ベースカラーの変更1つでさっくり雰囲気掴めるというのが利点。

やっぱり綺麗につくるのには適切な色を選ぶ必要があるので、いい感じに修正して行ってくださいな。

 

使用例

f:id:franxx00:20131120172158j:plain

f:id:franxx00:20131120172215j:plain

f:id:franxx00:20131120172235j:plain

 

 

 

 

テクスチャ入れたりするとこんな感じ。

f:id:franxx00:20131120173712j:plain

f:id:franxx00:20131120173814j:plain