Как сделать интерфейс под разные размеры(IOS)?

Question

[Никита Болдышев]

Моей задачей стало сделать мобильный интерфейс под IOS. Сначала я сделал под Iphone 6. Теперь у меня появилась проблема, я не знаю, как мне сделать интерфейс под другие размеры, не начиная с самого начала.

Как обычно решают такую проблему?

Answer 1

[Максим Шайхалов]

Есть несколько основных правил и техник, которые помогут избавится от таких проблем

• Дизайн в векторе. Это позволяет нашим интерфейсам, иконкам и прочей графике масштабироваться в любой нужный размер. Разработчики берут векторную графику и спокойно масштабируют её под @2x и @3x.
  
• Дизайн в 1х. Масштабирование 2x-графики в 150% для генерации версии в 3х провоцирует появление размытых контуров. Макеты для стандартных размеров iPhone 6 должны быть 375×667, а не 750×1334.
  
• Иногда устройства лгут. Они делают вид, что их коэффициент преобразования пикселей в точку один, например, 3х, а на самом деле, оно 2.61х, а сам исходник масштабируется в 3х просто для удобства. Создавайте дизайн под iPhone Plus, как если бы он на самом деле был 3х. Телефон сам смасштабирует его в 87%.
  
• Если используйте Sketch, то можно поставить Fluid — плагин, который помогает налету изменять ваши дизайны в соответствии с разной шириной экрана.
  

Comments

[Никита Болдышев]

Спасибо. А что с Андроид?