デザインちーむテクニックこの業界に入って最初に教わったことを書きます。それは「1px単位まで気を使ったデザインを心掛ける」です。これ、WEBデザイナーさんにとっては基本中の基本だと思いますが、意外とその基本が出来てない人を見かけるので紹介します。拡大表示でパスを直接調整シェイプの端がぼやけて汚くなる初期設定のPhotoshopで長方形などの図形を作成した場合、パッと見では問題無いように見えて、実はピクセル単位まで拡大すると端がぼやけていることがほとんどなんです。グリッドに沿って描かれた場合はもちろんきれいに表示されますが、たいていの場合ぼやけてしまいます。ここで「そんなの大したことないじゃん」と思ったアナタ。デザイナーとしてまだまだ未熟ですよ(笑)これ、簡単な設定で綺麗に作成出来るようになるんです!ぼやけないシェイプの描き方ここで紹介する方法は3パターン。どれか1つを押さえて置けばシェイプのぼやけは解消されます。cs6以降は設定が異なる可能性があります。表示倍率を100%にしておけば、グリッド上に自動でアンカーポイントが作られるのでぼやけません。200%、300%など倍率で描くと、アンカーポイントの描画可能位置が変わってしまうのか何度やってもぼやけてしまいます。パスをピクセルにスナップこれオススメです。ピクセルにスナップ(くっつく)して描画してくれるのでぼやけなくなるんです。長方形ツールオプションで「ピクセルにスナップ」にチェック入れておけば、表示倍率が変わってもグリッドに沿ったシェイプを一発で描くことができます。デフォルトでチェックされてないことが不思議なくらいですよね。最後は手作業でグリッドに合わせて綺麗にしていかないといけません。ことで、基本この方法だけしっかり覚えておけばいいのかなとも思います。拡大表示でグリッド線を目安にパスをぼやけない位置まで調整していきます。慣れてくると、グリッド線にピシッと合わさった時の気持ち良さがクセになります。これらの方法で、適当に長方形を描いても境界線がぼやけることなく綺麗に描けるようになると思います。ぼやけ1つでデザインイメージが変わってくるので、今まで特に気にしていなかった方はぜひお試しください。スライスの際も綺麗に切れて気持ちいいですよー。WEBデザイナーシステムエンジニアからWEBクリエイターに転身。「思い立ったが吉日なら、その日以降はすべて凶日」。大切さ」を意識してチャンスを逃がさないよう心掛けていきたいです。スマホサイト制作にかかせないbackground-sizeについて5簡単作成!オリジナルのイラストなどのデザインQRコードを作ってみた。Hubot連携でSlack2016.08.31【とな編】レタッチャーは見た...世にも奇妙な超常現象!2014.09.19なぜレタッチは必要なのか、レタッチの役割と効果について。Analyticsで頻出!かなり役立つ正規表現2015.12.07第二種電気工事士への道~衝撃の結末へ~2014.07.21ほんのり解説Linux。~仕様編~2016.04.14インフラ系女子、モニターを修理してみた。2019.07.26現在リニューアル中。多忙につきお待たせしております。