iPhoneアプリ用のアートボードサイズ

Q: これからiPhoneアプリのデザインを始めるのですが、アートボードのサイズをどうすればいいか教えてください。

A:
Sketchに用意されているアートボードの中から「iPhone7」を選んでください。


実際にはiPhone7は横750px、縦1334pxなのでアートボードのサイズはその半分の大きさです。
スケールは、以下の通りです。
iPhone3 : @1x
iPhone4/5/SE/6/7 : @2x(2倍)
iPhone6 plus/7 plus: @3x(3倍)

@1xでデザインを作成して、画像assetsを書き出す際に2倍、3倍のサイズの画像を用意します。(Sketchがいっぺんに作成してくれる)

ここに注意

iPhone4/5/6とiPhone6/7はスケールはどちらも@2xですが、
実際のデバイスの大きさは異なります。
iPhone6/7で収まっていた要素がiPhone4/5/SEでは入らないということが起こり得ますので、その点を十分に注意してデザインしてください。




写真が横に並ぶ場合は、(1)余白を維持して画像を拡大表示するのか、(2)画像サイズを維持するのかを考える必要があります。




コメント