2018.09.23 2020.02.10

パターンからパターンを作る方法

PSDなどのデザインデータをもらってコーディングをしていくときに、背景などにパターンが使われている場合があります。たまに遭遇するこのあるある、自分でそのパターンの素材を書き出さないといけないときの方法を備忘録します。

パターンの書き出し

パターン素材のサイズ

使われているパターンをレイヤーのところでダブルクリックなどをするとダイアログが出ます。そのパターンの上にカーソルを持っていくとパターンのサイズが表示されます。

スライスでパターンを書き出す

あとは新しいアートボードなどに広げて、先ほどのパターン素材と同じサイズにスライスして書き出したら完了です。

僕はこの方法で書き出したあと、ちょろっと圧縮してWEBサイトの背景などに使用しています。最近はスマホの解像度とかも高いので、基本的にはjpgかpngしか使っていません。

おわりに

人やコーディングの仕方にも依存するところはあると思いますが、コーディングができないデザイナーさんの素材って使いにくいよね。WEBデザイナーってやっぱり守備範囲広くないといけないし大変な職業だなと改めて思ったね。