Retina や、HiDPIのディスプレイでPhotoshopを使うとぼやけてしまいます

[fannrei]

現在 Surface Book 2 でPhotoshopを使っています。

ディスプレイの解像度が、3240 x 2160px となっています。

Photoshopでウェブサイトのカンプを作成する際には、

横幅 1400px でデザインカンプを作っています。

ただ、このまま　1400pxで作ると、Photoshopの画面で100%でみると小さいので、200%まで拡大してデザインを進めていますが、

そうすると、フォントなどがぼやけて見えます…

フォントは、通常のデバイス文字で、14px か、16px でデザインしていますが、

200％でみると、ぼやけてしまいます（ギザギザ）。

しかし、100％で見ると、小さすぎて目が疲れてしまい、とても作業ができません。

※ 2倍の、2800px サイズでは作れません（重いし、お客さんやコーダーの環境はRetinaではないため、2800pxでブラウザでデザイン確認すると、横スクロールがスクロールされてしまいます）

HiDPIや、RetinaのディスプレイでPhotoshopで、文字がぼやけない方法はないでしょうか‥‥？

[ajabon grinsmith · Accepted solution]

ここでの200%拡大とはズーム比率のことですね？

ピクセル等倍（100%）に対して拡大表示すればピクセルの輪郭が見えてくるのは当たり前というか仕方ない話になるのですが、

作業の内容によっては、「画像解像度」で200%拡大（2800px）、納品時に50%縮小、でなんとかならないでしょうか？

[fannrei]

ありがとうございます。

> ここでの200%拡大とはズーム比率のことですね？

はい、そうですね。

> 作業の内容によっては、「画像解像度」で200%拡大（2800px）、納品時に50%縮小、でなんとかならないでしょうか？

お客様へのJPGは納品時に50％縮小すればよいのですが、

コーダーへお渡しする際も、縮小する必要がありますね。

また、Photoshopのカンバス内で確認ではなく、ブラウザーへJPGをドラッグして全体を見る際にもいちいち縮小することになりますね（Photoshopは左右ツールが多いので、全体感把握が難しいため）

HiDPIのパソコンで、Photoshopは通常100％表示する際は小さく表示できない方法はないですね…？

このHiDPIのパソコンに変えてから画面も鮮明でよいですが、Photoshopの作業がとてもしづらくなりました…

[assause · Accepted solution]

ディスプレイのピクセル数の意味があまりなくなってきますが、設定で解像度を落として、1920×1080、かつ倍率100%で作るしかないように思います。

高密度ディスプレイは主としてエンターテインメント利用に向いたものなので、今回のような要件だと利用としては難しいことになります。

[r360studio Kazue Mori · Accepted solution]

fannreiさん、こんにちは。

「ディスプレイの解像度が、3240 x 2160px」とのことですが、表示スケールは何パーセントですか？

　

HiDPIディスプレイとして利用されているのであれば、表示スケールは100％以上になっていることかと思います。

わたしは、Surface Book3を使っているのですが、どちらも推奨設定で使っているので「ディスプレイ解像度 3000×2000／表示スケール 200%」となっています。ピクセルがスケーリングされているので、実画面のサイズは「1500×1000」、デバイスピクセル比 2の環境です。

この環境では、画面の表示がピクセル実寸の2倍の大きさとなるはずですが、Photoshopのドキュメントでは、2倍にならずにピクセル等倍で表示されます（ピクセルが主体となる、ビットマップデータを作成するソフトですので、ピクセルの実寸で表示するのは、あたりまえと言えばあたりまえなのですが）。

そのため、「表示スケール 200%」のマシン環境でPhotoshopを使っている場合は、2倍のサイズでビットマップデータを作成しないと、綺麗に表示されません。

1400pxのサイズでデザインカンプを作る場合、「表示スケール 200%」のマシン環境では、2800pxで作らないと、Photoshop上ではブラウザで表示したときのスケールにならないのです。

ここまでが、表示が綺麗に見られない理由です。

対策としてはいくつかありますが、Photoshopだけで作業をするのであれば、ajabon grinsmithさんがコメントされている「2倍の解像度でPhotoshopデータを作成し、納品用のデータは50％縮小して書き出す」というのが、よさそうです。

また、ベクターデータを扱える、Adobe XDを使ってカンプを作れば、納品用の最終サイズのピクセル数でドキュメントを作っても、図形・線・文字などのベクターデータはそのまま扱えますし、写真などのビットマップデータを貼り込む時には、2倍のピクセル数のデータを縮小して配置することで解像度を保ったまま作業できるのでオススメです。

以上、ご参考になりましたら幸いです。
.