Just for my own curiosity, why is it becoming a trend to create “@2x” mockups in photoshop? Other than creating larger native file-sizes, what’s the difference between a 360ppi mock vs a 72ppi mock (other than the obvious)?
Usually, I’ll use vector shapes to create the page and smart-object raster images in a 72ppi doc. From there, I can export assets to any size for development.
I’m told this “way” is silly – I should just design at 360ppi, but I’ve noticed some drawbacks:
- Very large file sizes
- Unrealistic proportions
- Pixel measurement inaccuracy in development
- Font size inaccuracy
- “Half-pixel” measurements when scaling back to 72ppi
Am I missing a bigger picture? * pun *
Answer
I do not understand the @2x as a “trend”. It sometimes is a requirement on web design.
@2x, @3x, @Nx is not a way to design everything, it is a declaration on a css stylesheet to use an image at higher resolution.
It is a specific case of high resolution devices. Aka Iphone, Ipad.
The resolution is higher than normal. If thoose systems declare the resolution as everyone else, the images and text would be tiny.
So the system is declaring half posible resolution (a normal one) but pays special attention when find a image marked as @2x. In this particular case, it takes this higher resolution image and do not dispays it at “half” but in its real high resolution.
Think of this as the diference on having a preview (low resolution) and then using a high resolution image ath the end.
So that is not a trend, it is a need in some cases.
There are some devices now with twice linear resolution than Full HD.
BTW. Save you some trouble and start designing in vectors. Not In PhotoDontDoAllInItShop.
In electronic devices ppi is not an issue
I’m told I should just design at 360ppi
No. PPI does not count at all in electronic devices. You need to use pixels as dimensions. Then you have a choice for example to use a maximum width of lets say FullHD 1920px.
Although yes, a device can have a pixel density of let us say 360 ppi, this information is not used the same as a printed document. It only counts the absolute value in pixels.
Here are 2 images. They have totally different declared ppi inside the file, but are exactly the same size. (You can only see the diference opening them inside a image processing program and reading the ppi data)
Photo: Scott F. Snyder
Model: Amy Lee Fathbruckne
Attribution
Source : Link , Question Author : Aaron Benjamin , Answer Author : Community